test(document): cover TimelineControls and TimelineXAxis branches
TimelineControls: empty render when neither flag is set, reset button gated on isZoomed, clear button gated on hasSelection, both-on, both callback wirings. TimelineXAxis: empty filled → no ticks, populated → ticks render, omit-year branch when all buckets share a year, show-year branch across multiple years, length-4 bucket-string fallback. 11 tests across two timeline primitives. Refs #496. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
84
frontend/src/lib/document/TimelineControls.svelte.test.ts
Normal file
84
frontend/src/lib/document/TimelineControls.svelte.test.ts
Normal file
@@ -0,0 +1,84 @@
|
||||
import { describe, it, expect, vi, afterEach } from 'vitest';
|
||||
import { cleanup, render } from 'vitest-browser-svelte';
|
||||
import { page } from 'vitest/browser';
|
||||
import TimelineControls from './TimelineControls.svelte';
|
||||
|
||||
afterEach(cleanup);
|
||||
|
||||
describe('TimelineControls', () => {
|
||||
it('renders neither button when not zoomed and no selection', async () => {
|
||||
render(TimelineControls, {
|
||||
props: {
|
||||
isZoomed: false,
|
||||
hasSelection: false,
|
||||
onresetzoom: () => {},
|
||||
onclearselection: () => {}
|
||||
}
|
||||
});
|
||||
|
||||
const buttons = document.querySelectorAll('button');
|
||||
expect(buttons.length).toBe(0);
|
||||
});
|
||||
|
||||
it('renders the reset-zoom button when isZoomed is true', async () => {
|
||||
render(TimelineControls, {
|
||||
props: {
|
||||
isZoomed: true,
|
||||
hasSelection: false,
|
||||
onresetzoom: () => {},
|
||||
onclearselection: () => {}
|
||||
}
|
||||
});
|
||||
|
||||
await expect.element(page.getByRole('button', { name: /zur übersicht/i })).toBeVisible();
|
||||
});
|
||||
|
||||
it('renders the clear-selection button when hasSelection is true', async () => {
|
||||
render(TimelineControls, {
|
||||
props: {
|
||||
isZoomed: false,
|
||||
hasSelection: true,
|
||||
onresetzoom: () => {},
|
||||
onclearselection: () => {}
|
||||
}
|
||||
});
|
||||
|
||||
await expect.element(page.getByRole('button', { name: /auswahl zurücksetzen/i })).toBeVisible();
|
||||
});
|
||||
|
||||
it('renders both buttons when both flags are true', async () => {
|
||||
render(TimelineControls, {
|
||||
props: {
|
||||
isZoomed: true,
|
||||
hasSelection: true,
|
||||
onresetzoom: () => {},
|
||||
onclearselection: () => {}
|
||||
}
|
||||
});
|
||||
|
||||
const buttons = document.querySelectorAll('button');
|
||||
expect(buttons.length).toBe(2);
|
||||
});
|
||||
|
||||
it('calls onresetzoom when the reset button is clicked', async () => {
|
||||
const onresetzoom = vi.fn();
|
||||
render(TimelineControls, {
|
||||
props: { isZoomed: true, hasSelection: false, onresetzoom, onclearselection: () => {} }
|
||||
});
|
||||
|
||||
await page.getByRole('button', { name: /zur übersicht/i }).click();
|
||||
|
||||
expect(onresetzoom).toHaveBeenCalledOnce();
|
||||
});
|
||||
|
||||
it('calls onclearselection when the clear button is clicked', async () => {
|
||||
const onclearselection = vi.fn();
|
||||
render(TimelineControls, {
|
||||
props: { isZoomed: false, hasSelection: true, onresetzoom: () => {}, onclearselection }
|
||||
});
|
||||
|
||||
await page.getByRole('button', { name: /auswahl zurücksetzen/i }).click();
|
||||
|
||||
expect(onclearselection).toHaveBeenCalledOnce();
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user