- Implement tests for Pagination, StatusBadge, ConfirmDialog, and MobileInput components. - Add tests for useSubscription, usePaymentConfig, and usePwaInstall hooks. - Create tests for API requests in the api module, including success and error handling. - Add utility function tests for formatting and validating Iranian mobile numbers. - Implement tests for BlogFormPage and BlogsPage to validate form submissions and data fetching. - Add tests for LoginPage to ensure proper validation and state management. - Create tests for authStore and uiStore to validate state management and functionality. - Set up Vitest configuration and testing utilities for consistent testing environment.
67 lines
2.8 KiB
TypeScript
67 lines
2.8 KiB
TypeScript
import { describe, it, expect, beforeEach } from 'vitest';
|
|
import { useUiStore, HUES } from '@/stores/uiStore';
|
|
|
|
const initial = useUiStore.getInitialState();
|
|
|
|
beforeEach(() => {
|
|
localStorage.clear();
|
|
useUiStore.setState(initial, true);
|
|
document.documentElement.className = '';
|
|
document.documentElement.removeAttribute('data-theme');
|
|
document.documentElement.removeAttribute('data-density');
|
|
});
|
|
|
|
describe('sidebar', () => {
|
|
it('toggleSidebar وضعیت را برعکس میکند', () => {
|
|
expect(useUiStore.getState().sidebarOpen).toBe(true);
|
|
useUiStore.getState().toggleSidebar();
|
|
expect(useUiStore.getState().sidebarOpen).toBe(false);
|
|
});
|
|
it('setSidebarOpen مقدار صریح میگذارد', () => {
|
|
useUiStore.getState().setSidebarOpen(false);
|
|
expect(useUiStore.getState().sidebarOpen).toBe(false);
|
|
});
|
|
});
|
|
|
|
describe('darkMode + applyTheme', () => {
|
|
it('toggleDarkMode کلاس dark و data-theme را روی root میگذارد', () => {
|
|
useUiStore.getState().toggleDarkMode();
|
|
expect(useUiStore.getState().darkMode).toBe(true);
|
|
expect(document.documentElement.classList.contains('dark')).toBe(true);
|
|
expect(document.documentElement.getAttribute('data-theme')).toBe('dark');
|
|
});
|
|
it('toggle دوباره به light برمیگرداند', () => {
|
|
useUiStore.getState().toggleDarkMode();
|
|
useUiStore.getState().toggleDarkMode();
|
|
expect(useUiStore.getState().darkMode).toBe(false);
|
|
expect(document.documentElement.classList.contains('dark')).toBe(false);
|
|
expect(document.documentElement.getAttribute('data-theme')).toBe('light');
|
|
});
|
|
});
|
|
|
|
describe('density', () => {
|
|
it('setDensity مقدار و data-density را تنظیم میکند', () => {
|
|
useUiStore.getState().setDensity('compact');
|
|
expect(useUiStore.getState().density).toBe('compact');
|
|
expect(document.documentElement.getAttribute('data-density')).toBe('compact');
|
|
});
|
|
});
|
|
|
|
describe('brandHue', () => {
|
|
it('setBrandHue متغیرهای CSS را روی root مینویسد', () => {
|
|
const hue = HUES[2];
|
|
useUiStore.getState().setBrandHue(hue);
|
|
expect(useUiStore.getState().brandHue).toEqual(hue);
|
|
expect(document.documentElement.style.getPropertyValue('--brand-h')).toBe(String(hue.h));
|
|
expect(document.documentElement.style.getPropertyValue('--brand-c')).toBe(String(hue.c));
|
|
});
|
|
});
|
|
|
|
describe('settingsPanel', () => {
|
|
it('toggleSettingsPanel وضعیت را برعکس میکند', () => {
|
|
expect(useUiStore.getState().settingsPanelOpen).toBe(false);
|
|
useUiStore.getState().toggleSettingsPanel();
|
|
expect(useUiStore.getState().settingsPanelOpen).toBe(true);
|
|
});
|
|
});
|