test(shared): cover BackButton and OverflowPillButton
BackButton: visible vs aria-only label branches, custom class application, history.back() click handler. OverflowPillButton: +N pill render, aria-expanded matrix (closed default → open after click), per-person link rendering with correct href, Escape closes the dropdown. Both are reused widely; their coverage closes the line and function gap left after the DocumentTopBar split inflated the denominator. Refs #496. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
50
frontend/src/lib/shared/primitives/BackButton.svelte.test.ts
Normal file
50
frontend/src/lib/shared/primitives/BackButton.svelte.test.ts
Normal file
@@ -0,0 +1,50 @@
|
||||
import { describe, it, expect, vi, afterEach } from 'vitest';
|
||||
import { cleanup, render } from 'vitest-browser-svelte';
|
||||
import { page } from 'vitest/browser';
|
||||
import BackButton from './BackButton.svelte';
|
||||
|
||||
afterEach(cleanup);
|
||||
|
||||
describe('BackButton', () => {
|
||||
it('renders the visible label by default (showLabel=true)', async () => {
|
||||
render(BackButton, { props: {} });
|
||||
|
||||
await expect.element(page.getByRole('button', { name: /^zurück$/i })).toBeVisible();
|
||||
});
|
||||
|
||||
it('hides the visible label when showLabel is false', async () => {
|
||||
render(BackButton, { props: { showLabel: false } });
|
||||
|
||||
const btn = (await page.getByRole('button').element()) as HTMLButtonElement;
|
||||
// The label is exposed via aria-label only when showLabel=false.
|
||||
expect(btn.getAttribute('aria-label')).toBe('Zurück');
|
||||
expect(btn.textContent?.trim()).toBe('');
|
||||
});
|
||||
|
||||
it('does not set an aria-label when the visible label is shown', async () => {
|
||||
render(BackButton, { props: { showLabel: true } });
|
||||
|
||||
const btn = (await page.getByRole('button').element()) as HTMLButtonElement;
|
||||
expect(btn.getAttribute('aria-label')).toBeNull();
|
||||
});
|
||||
|
||||
it('applies the supplied class string to the button', async () => {
|
||||
render(BackButton, { props: { class: 'custom-class' } });
|
||||
|
||||
const btn = (await page.getByRole('button').element()) as HTMLButtonElement;
|
||||
expect(btn.classList.contains('custom-class')).toBe(true);
|
||||
});
|
||||
|
||||
it('calls history.back() when clicked', async () => {
|
||||
const backSpy = vi.spyOn(globalThis.history, 'back').mockImplementation(() => {});
|
||||
try {
|
||||
render(BackButton, { props: {} });
|
||||
|
||||
await page.getByRole('button').click();
|
||||
|
||||
expect(backSpy).toHaveBeenCalledOnce();
|
||||
} finally {
|
||||
backSpy.mockRestore();
|
||||
}
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user