test(todo): update add-task tests for toolbar button migration

The "Add new task..." button moved from the panel into the shared
toolbar and is triggered via addItemSignal. Rewrite the three affected
tests to drive that signal through a rerender instead of clicking the
removed in-panel button.
This commit is contained in:
Maurice
2026-04-18 00:25:06 +02:00
parent 0c00f8e0b3
commit 10d1f8d428
@@ -37,9 +37,10 @@ describe('TodoListPanel', () => {
expect(screen.getByText('Buy tickets')).toBeInTheDocument(); expect(screen.getByText('Buy tickets')).toBeInTheDocument();
}); });
it('FE-COMP-TODO-002: shows Add new task button', () => { it('FE-COMP-TODO-002: raising addItemSignal opens the new task form', async () => {
render(<TodoListPanel tripId={1} items={[]} />); const { rerender } = render(<TodoListPanel tripId={1} items={[]} addItemSignal={0} />);
expect(screen.getByText('Add new task...')).toBeInTheDocument(); rerender(<TodoListPanel tripId={1} items={[]} addItemSignal={1} />);
await screen.findByText('Create task');
}); });
it('FE-COMP-TODO-003: sidebar filter buttons are rendered', () => { it('FE-COMP-TODO-003: sidebar filter buttons are rendered', () => {
@@ -119,11 +120,9 @@ describe('TodoListPanel', () => {
expect(screen.getByText(/1 \/ 2 completed/i)).toBeInTheDocument(); expect(screen.getByText(/1 \/ 2 completed/i)).toBeInTheDocument();
}); });
it('FE-COMP-TODO-011: clicking Add new task opens detail form', async () => { it('FE-COMP-TODO-011: raising addItemSignal opens detail form with Create task button', async () => {
const user = userEvent.setup(); const { rerender } = render(<TodoListPanel tripId={1} items={[]} addItemSignal={0} />);
render(<TodoListPanel tripId={1} items={[]} />); rerender(<TodoListPanel tripId={1} items={[]} addItemSignal={1} />);
await user.click(screen.getByText('Add new task...'));
// The detail pane shows "Create task" button
await screen.findByText('Create task'); await screen.findByText('Create task');
}); });
@@ -398,15 +397,12 @@ describe('TodoListPanel', () => {
return HttpResponse.json({ item: buildTodoItem({ id: 99, name: 'Brand New Task' }) }); return HttpResponse.json({ item: buildTodoItem({ id: 99, name: 'Brand New Task' }) });
}), }),
); );
render(<TodoListPanel tripId={1} items={[]} />); const { rerender } = render(<TodoListPanel tripId={1} items={[]} addItemSignal={0} />);
// Open the new task pane // Raising the signal opens the new task pane (simulates the toolbar button click)
await user.click(screen.getByText('Add new task...')); rerender(<TodoListPanel tripId={1} items={[]} addItemSignal={1} />);
// Wait for "Create task" button to appear
await screen.findByText('Create task'); await screen.findByText('Create task');
// Type a task name in the autoFocus input (Task name placeholder)
const nameInput = screen.getByPlaceholderText('Task name'); const nameInput = screen.getByPlaceholderText('Task name');
await user.type(nameInput, 'Brand New Task'); await user.type(nameInput, 'Brand New Task');
// Click the Create task button
await user.click(screen.getByText('Create task')); await user.click(screen.getByText('Create task'));
await waitFor(() => expect(postCalled).toBe(true)); await waitFor(() => expect(postCalled).toBe(true));
}); });