Some checks failed
CI / Unit & Component Tests (push) Successful in 3m47s
CI / Backend Unit Tests (push) Successful in 2m41s
CI / E2E Tests (push) Failing after 2h25m30s
CI / Unit & Component Tests (pull_request) Successful in 2m48s
CI / Backend Unit Tests (pull_request) Successful in 2m29s
CI / E2E Tests (pull_request) Failing after 2h29m1s
- AnnotationSidePanel: cover visibility (null vs set annotationId), close button callback, and targetCommentId forwarding - layout.svelte.spec: mock $env/static/public to satisfy PUBLIC_NOTIFICATION_POLL_MS import from NotificationBell - mention.spec: update assertion to match span-based mention rendering Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
90 lines
3.4 KiB
TypeScript
90 lines
3.4 KiB
TypeScript
import { afterEach, describe, expect, it, vi } from 'vitest';
|
||
import { cleanup, render } from 'vitest-browser-svelte';
|
||
import { page, userEvent } from 'vitest/browser';
|
||
import { createRawSnippet } from 'svelte';
|
||
|
||
vi.mock('$env/static/public', () => ({ PUBLIC_NOTIFICATION_POLL_MS: '60000' }));
|
||
|
||
afterEach(cleanup);
|
||
|
||
const emptySnippet = createRawSnippet(() => ({ render: () => '<span></span>' }));
|
||
import Layout from './+layout.svelte';
|
||
|
||
const tick = () => new Promise((r) => setTimeout(r, 0));
|
||
|
||
// Minimal data required by the layout
|
||
const makeData = (overrides = {}) => ({
|
||
user: {
|
||
id: '1',
|
||
username: 'max',
|
||
firstName: 'Max',
|
||
lastName: 'Müller',
|
||
groups: [],
|
||
enabled: true,
|
||
createdAt: ''
|
||
},
|
||
canWrite: true,
|
||
canAnnotate: false,
|
||
...overrides
|
||
});
|
||
|
||
// ─── User avatar ──────────────────────────────────────────────────────────────
|
||
|
||
describe('Layout – user avatar button', () => {
|
||
it('shows user initials when first and last name are set', async () => {
|
||
render(Layout, { data: makeData(), children: emptySnippet });
|
||
await expect.element(page.getByRole('button', { name: /MM/ })).toBeInTheDocument();
|
||
});
|
||
|
||
it('shows fallback icon button when names are not set', async () => {
|
||
render(Layout, {
|
||
data: makeData({
|
||
user: { id: '1', username: 'x', groups: [], enabled: true, createdAt: '' }
|
||
}),
|
||
children: emptySnippet
|
||
});
|
||
// Button should still exist (with aria-label for accessibility)
|
||
await expect.element(page.getByRole('button', { name: /Profil/i })).toBeInTheDocument();
|
||
});
|
||
});
|
||
|
||
// ─── Dropdown ─────────────────────────────────────────────────────────────────
|
||
|
||
describe('Layout – user dropdown', () => {
|
||
it('dropdown is hidden initially', async () => {
|
||
render(Layout, { data: makeData(), children: emptySnippet });
|
||
await tick();
|
||
await expect.element(page.getByRole('link', { name: /Profil/i })).not.toBeInTheDocument();
|
||
});
|
||
|
||
it('opens dropdown on button click', async () => {
|
||
render(Layout, { data: makeData(), children: emptySnippet });
|
||
await page.getByRole('button', { name: /MM/ }).click();
|
||
await expect.element(page.getByRole('link', { name: /Profil/i })).toBeInTheDocument();
|
||
});
|
||
|
||
it('profile link points to /profile', async () => {
|
||
render(Layout, { data: makeData(), children: emptySnippet });
|
||
await page.getByRole('button', { name: /MM/ }).click();
|
||
await expect
|
||
.element(page.getByRole('link', { name: /Profil/i }))
|
||
.toHaveAttribute('href', '/profile');
|
||
});
|
||
|
||
it('logout button is in the dropdown', async () => {
|
||
render(Layout, { data: makeData(), children: emptySnippet });
|
||
await page.getByRole('button', { name: /MM/ }).click();
|
||
await expect.element(page.getByRole('button', { name: /Abmelden/i })).toBeInTheDocument();
|
||
});
|
||
|
||
it('closes dropdown when Escape is pressed', async () => {
|
||
render(Layout, { data: makeData(), children: emptySnippet });
|
||
const btn = page.getByRole('button', { name: /MM/ });
|
||
await btn.click();
|
||
await expect.element(page.getByRole('link', { name: /Profil/i })).toBeInTheDocument();
|
||
await userEvent.keyboard('{Escape}');
|
||
await tick();
|
||
await expect.element(page.getByRole('link', { name: /Profil/i })).not.toBeInTheDocument();
|
||
});
|
||
});
|