58 lines
1.9 KiB
TypeScript
58 lines
1.9 KiB
TypeScript
import {expect, test} from 'vitest';
|
|
import {
|
|
registerNavbarPicker,
|
|
registerSidebarPicker,
|
|
} from '@/views/admin/Customization';
|
|
|
|
test('preview navbar color', () => {
|
|
const nav = document.createElement('nav');
|
|
nav.className = 'navbar-primary navbar-dark';
|
|
const picker = document.createElement('div');
|
|
picker.innerHTML = `
|
|
<label><input type="radio" name="navbar" value="cyan"></label>
|
|
<label><input type="radio" name="navbar" value="orange"></label>
|
|
`;
|
|
const cyan = picker.querySelector<HTMLInputElement>('[value=cyan]')!;
|
|
const orange = picker.querySelector<HTMLInputElement>('[value=orange]')!;
|
|
|
|
registerNavbarPicker(nav, picker, 'primary');
|
|
cyan.click();
|
|
expect(nav.className).toContain('navbar-cyan');
|
|
expect(nav.className).toContain('navbar-dark');
|
|
expect(nav.className).not.toContain('navbar-light');
|
|
orange.click();
|
|
expect(nav.className).toContain('navbar-orange');
|
|
expect(nav.className).not.toContain('navbar-cyan');
|
|
expect(nav.className).toContain('navbar-light');
|
|
expect(nav.className).not.toContain('navbar-dark');
|
|
});
|
|
|
|
test('preview sidebar color', () => {
|
|
const sidebar = document.createElement('aside');
|
|
sidebar.className = 'sidebar-dark-primary';
|
|
|
|
const darkPicker = document.createElement('div');
|
|
darkPicker.innerHTML = `
|
|
<label><input type="radio" name="sidebar" value="dark-cyan"></label>`;
|
|
const darkCyan = darkPicker.querySelector<HTMLInputElement>(
|
|
'[value="dark-cyan"]',
|
|
)!;
|
|
|
|
const lightPicker = document.createElement('div');
|
|
lightPicker.innerHTML = `
|
|
<label><input type="radio" name="sidebar" value="light-cyan"></label>`;
|
|
const lightCyan = lightPicker.querySelector<HTMLInputElement>(
|
|
'[value="light-cyan"]',
|
|
)!;
|
|
|
|
registerSidebarPicker(
|
|
sidebar,
|
|
{dark: darkPicker, light: lightPicker},
|
|
'dark-primary',
|
|
);
|
|
darkCyan.click();
|
|
expect(sidebar.className).toContain('sidebar-dark-cyan');
|
|
lightCyan.click();
|
|
expect(sidebar.className).toContain('sidebar-light-cyan');
|
|
});
|