feat(search): add SmartModeToggle pill component (#739)
Toggle pill with aria-pressed, active/resting styles matching the AND/OR operator button pattern, and mobile-expanded KI/Text labels. 4 vitest-browser-svelte specs (red/green). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
36
frontend/src/routes/search/SmartModeToggle.svelte.spec.ts
Normal file
36
frontend/src/routes/search/SmartModeToggle.svelte.spec.ts
Normal file
@@ -0,0 +1,36 @@
|
||||
import { describe, expect, it, afterEach } from 'vitest';
|
||||
import { cleanup, render } from 'vitest-browser-svelte';
|
||||
import { page } from 'vitest/browser';
|
||||
import SmartModeToggle from './SmartModeToggle.svelte';
|
||||
|
||||
afterEach(() => cleanup());
|
||||
|
||||
describe('SmartModeToggle', () => {
|
||||
it('renders aria-pressed="false" by default and toggles on click', async () => {
|
||||
render(SmartModeToggle, { smartMode: false });
|
||||
const btn = page.getByRole('button');
|
||||
await expect.element(btn).toHaveAttribute('aria-pressed', 'false');
|
||||
await btn.click();
|
||||
await expect.element(btn).toHaveAttribute('aria-pressed', 'true');
|
||||
await btn.click();
|
||||
await expect.element(btn).toHaveAttribute('aria-pressed', 'false');
|
||||
});
|
||||
|
||||
it('shows the smart label when smartMode is true', async () => {
|
||||
render(SmartModeToggle, { smartMode: true });
|
||||
const btn = page.getByRole('button');
|
||||
await expect.element(btn).toHaveTextContent('KI');
|
||||
});
|
||||
|
||||
it('shows the keyword label when smartMode is false', async () => {
|
||||
render(SmartModeToggle, { smartMode: false });
|
||||
const btn = page.getByRole('button');
|
||||
await expect.element(btn).toHaveTextContent('Text');
|
||||
});
|
||||
|
||||
it('applies the active pill style only in smart mode', async () => {
|
||||
render(SmartModeToggle, { smartMode: true });
|
||||
const btn = page.getByRole('button');
|
||||
await expect.element(btn).toHaveClass(/bg-primary/);
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user