diff --git a/src/components/Flowbite/Flowbite.spec.tsx b/src/components/Flowbite/Flowbite.spec.tsx index d28dd371b..bd05c64ff 100644 --- a/src/components/Flowbite/Flowbite.spec.tsx +++ b/src/components/Flowbite/Flowbite.spec.tsx @@ -1,24 +1,11 @@ -// TODO: fix test - import { act, render } from '@testing-library/react'; import { describe, expect, it } from 'vitest'; -import { Flowbite, useTheme } from '../../'; +import { useThemeMode } from '~/src/helpers/use-theme-mode'; +import { getTheme } from '~/src/theme-store'; +import { Flowbite } from '../../'; import { mergeDeep } from '../../helpers/merge-deep'; -import type { ThemeContextProps } from './ThemeContext'; describe('Components / Flowbite', () => { - describe('hook / useTheme', () => { - it('should return default values', () => { - render(); - - const { theme, mode, toggleMode } = context; - - expect(theme).toEqual(theme); - expect(mode).toBeUndefined(); - expect(toggleMode).toBeUndefined(); - }); - }); - describe('Flowbite', () => { it('should return default values', () => { render( @@ -27,8 +14,8 @@ describe('Components / Flowbite', () => { , ); - const { theme, mode, toggleMode } = context; - expect(theme).toEqual(theme); + const { mode, toggleMode } = themeMode; + expect(mode).toBe('light'); expect(toggleMode).not.toBeUndefined(); }); @@ -40,7 +27,7 @@ describe('Components / Flowbite', () => { , ); - const { theme } = context; + const theme = getTheme(); const mergedTheme = mergeDeep(theme, customTheme); expect(theme).toEqual(mergedTheme); @@ -53,7 +40,7 @@ describe('Components / Flowbite', () => { , ); - const { mode, toggleMode } = context; + const { mode, toggleMode } = themeMode; expect(mode).toBe('light'); expect(documentEl()).not.toHaveClass('dark'); @@ -62,7 +49,7 @@ describe('Components / Flowbite', () => { if (toggleMode) toggleMode(); }); - const { mode: mode2 } = context; + const { mode: mode2 } = themeMode; expect(mode2).toBe('dark'); expect(documentEl()).toHaveClass('dark'); @@ -75,7 +62,7 @@ describe('Components / Flowbite', () => { , ); - const { mode } = context; + const { mode } = themeMode; expect(mode).toBe('dark'); expect(documentEl()).toHaveClass('dark'); @@ -83,9 +70,10 @@ describe('Components / Flowbite', () => { }); }); -let context: ThemeContextProps; +let themeMode: ReturnType; + const TestComponent = () => { - context = useTheme(); + themeMode = useThemeMode(); return null; };