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:
Marcel
2026-03-31 22:46:32 +02:00
parent 20dbe04d45
commit 7bd995a045
2 changed files with 45 additions and 0 deletions

View 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');
});
});