bf82ebfe1d
- Add comment count badge on the Discussion tab (seeded from SSR, updated live) - Add 'Diskussion starten' nudge above collapsed panel when no comments exist - Add empty state hint with speech-bubble icon inside the discussion panel - Fix CommentThread to fire onCountChange with SSR-seeded count on mount - Add tests for all three behaviours in CommentThread and DocumentBottomPanel Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
71 lines
2.1 KiB
TypeScript
71 lines
2.1 KiB
TypeScript
import { describe, it, expect, vi, afterEach } from 'vitest';
|
||
import { cleanup, render } from 'vitest-browser-svelte';
|
||
import { page } from 'vitest/browser';
|
||
import CommentThread from './CommentThread.svelte';
|
||
import type { Comment } from '$lib/types';
|
||
|
||
afterEach(() => {
|
||
cleanup();
|
||
vi.unstubAllGlobals();
|
||
});
|
||
|
||
function makeComment(id: string, content = 'Hello'): Comment {
|
||
return {
|
||
id,
|
||
authorId: 'user-1',
|
||
authorName: 'Alice',
|
||
content,
|
||
createdAt: new Date().toISOString(),
|
||
updatedAt: new Date().toISOString(),
|
||
replies: []
|
||
};
|
||
}
|
||
|
||
const baseProps = {
|
||
documentId: 'doc-1',
|
||
canComment: true,
|
||
currentUserId: 'user-1',
|
||
canAdmin: false
|
||
};
|
||
|
||
describe('CommentThread – empty state', () => {
|
||
it('shows empty state hint when there are no comments', async () => {
|
||
render(CommentThread, { ...baseProps, initialComments: [] });
|
||
await expect
|
||
.element(page.getByText('Noch keine Kommentare – starte die Diskussion!'))
|
||
.toBeInTheDocument();
|
||
});
|
||
|
||
it('does not show empty state hint when comments exist', async () => {
|
||
render(CommentThread, { ...baseProps, initialComments: [makeComment('c-1')] });
|
||
await expect
|
||
.element(page.getByText('Noch keine Kommentare – starte die Diskussion!'))
|
||
.not.toBeInTheDocument();
|
||
});
|
||
});
|
||
|
||
describe('CommentThread – onCountChange', () => {
|
||
it('calls onCountChange with initial SSR count on mount', async () => {
|
||
const onCountChange = vi.fn();
|
||
render(CommentThread, {
|
||
...baseProps,
|
||
initialComments: [makeComment('c-1'), makeComment('c-2')],
|
||
onCountChange
|
||
});
|
||
expect(onCountChange).toHaveBeenCalledWith(2);
|
||
});
|
||
|
||
it('calls onCountChange with 0 when no initial comments', async () => {
|
||
const onCountChange = vi.fn();
|
||
render(CommentThread, { ...baseProps, initialComments: [], onCountChange });
|
||
expect(onCountChange).toHaveBeenCalledWith(0);
|
||
});
|
||
|
||
it('counts replies in the total', async () => {
|
||
const onCountChange = vi.fn();
|
||
const comment = { ...makeComment('c-1'), replies: [makeComment('r-1') as never] };
|
||
render(CommentThread, { ...baseProps, initialComments: [comment], onCountChange });
|
||
expect(onCountChange).toHaveBeenCalledWith(2);
|
||
});
|
||
});
|