feat(stammbaum): first-load touch affordance hint (#692)
Add StammbaumAffordance: a touch-only "drag to explore · pinch to zoom" hint that auto-dismisses on the first canvas pointer interaction (wired via the gesture action's onGestureStart) or the explicit close, and stays dismissed for 30 days via a localStorage timestamp (boolean gate only, never rendered). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,34 @@
|
||||
import { describe, it, expect, beforeEach, vi } from 'vitest';
|
||||
import { render } from 'vitest-browser-svelte';
|
||||
import StammbaumAffordance from './StammbaumAffordance.svelte';
|
||||
|
||||
const STORAGE_KEY = 'stammbaumAffordanceDismissedAt';
|
||||
|
||||
describe('StammbaumAffordance (#692)', () => {
|
||||
beforeEach(() => localStorage.clear());
|
||||
|
||||
it('shows the hint on a touch device that has not dismissed it', async () => {
|
||||
render(StammbaumAffordance, { touch: true });
|
||||
await vi.waitFor(() => expect(document.querySelector('[role="status"]')).not.toBeNull());
|
||||
expect(document.body.textContent).toContain('Ziehen');
|
||||
});
|
||||
|
||||
it('does not show on non-touch devices (OQ-008)', async () => {
|
||||
render(StammbaumAffordance, { touch: false });
|
||||
expect(document.querySelector('[role="status"]')).toBeNull();
|
||||
});
|
||||
|
||||
it('hides and records dismissal when the close button is clicked', async () => {
|
||||
render(StammbaumAffordance, { touch: true });
|
||||
const dismiss = [...document.querySelectorAll<HTMLButtonElement>('button')][0];
|
||||
dismiss.click();
|
||||
await vi.waitFor(() => expect(document.querySelector('[role="status"]')).toBeNull());
|
||||
expect(localStorage.getItem(STORAGE_KEY)).toBeTruthy();
|
||||
});
|
||||
|
||||
it('does not reappear within the 30-day window (NFR-USE-001)', async () => {
|
||||
localStorage.setItem(STORAGE_KEY, String(Date.now()));
|
||||
render(StammbaumAffordance, { touch: true });
|
||||
expect(document.querySelector('[role="status"]')).toBeNull();
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user