feat(ui): add AnnotateHintStrip — 18px hint strip, hidden md:flex, annotateMode gated
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
27
frontend/src/lib/components/AnnotateHintStrip.svelte.spec.ts
Normal file
27
frontend/src/lib/components/AnnotateHintStrip.svelte.spec.ts
Normal file
@@ -0,0 +1,27 @@
|
||||
import { describe, it, expect, afterEach } from 'vitest';
|
||||
import { cleanup, render } from 'vitest-browser-svelte';
|
||||
import { page } from 'vitest/browser';
|
||||
import AnnotateHintStrip from './AnnotateHintStrip.svelte';
|
||||
|
||||
afterEach(cleanup);
|
||||
|
||||
describe('AnnotateHintStrip', () => {
|
||||
it('is absent from the DOM when annotateMode is false', async () => {
|
||||
render(AnnotateHintStrip, { annotateMode: false });
|
||||
const strip = page.getByTestId('annotate-hint-strip');
|
||||
await expect.element(strip).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('is present in the DOM when annotateMode is true', async () => {
|
||||
render(AnnotateHintStrip, { annotateMode: true });
|
||||
const strip = page.getByTestId('annotate-hint-strip');
|
||||
await expect.element(strip).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('has hidden md:flex class to hide below 768px', async () => {
|
||||
render(AnnotateHintStrip, { annotateMode: true });
|
||||
const strip = page.getByTestId('annotate-hint-strip');
|
||||
await expect.element(strip).toHaveClass('hidden');
|
||||
await expect.element(strip).toHaveClass('md:flex');
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user