diff --git a/src/components/ThemeSwitch/index.test.tsx b/src/components/ThemeSwitch/index.test.tsx
index f3eb956..b4f4e1f 100644
--- a/src/components/ThemeSwitch/index.test.tsx
+++ b/src/components/ThemeSwitch/index.test.tsx
@@ -1,21 +1,32 @@
-import { cleanup, fireEvent, render, waitFor } from '@testing-library/react'
-import ThemeSwitch from '.'
+import { cleanup, fireEvent, render, screen } from '@testing-library/react'
+import ThemeSwitch, { getIconName } from '.'
describe('ThemeSwitch', () => {
afterEach(cleanup)
it('renders correctly', async () => {
- const { container } = render()
- await waitFor(() => container.querySelector('aside'))
- expect(container.querySelector('aside')).toBeInTheDocument()
+ render()
+ const button = await screen.findByRole('combobox')
+ expect(button).toBeInTheDocument()
})
- it('checkbox can be changed', async () => {
- const { container } = render()
+ it('button can be clicked', async () => {
+ render()
+ const button = await screen.findByRole('combobox')
+ fireEvent.click(button)
+ })
- const toggle = container.querySelector('input')
- const label = container.querySelector('label')
- fireEvent.click(label)
- fireEvent.change(toggle, { target: { checked: true } })
+ it('getIconName', () => {
+ let theme = 'light'
+ const icon = getIconName(theme)
+ expect(icon).toBe('Sun')
+
+ theme = 'dark'
+ const icon2 = getIconName(theme)
+ expect(icon2).toBe('Moon')
+
+ theme = 'system'
+ const icon3 = getIconName(theme)
+ expect(icon3).toBe('Monitor')
})
})