diff --git a/frontend/src/lib/notification/NotificationDropdown.svelte b/frontend/src/lib/notification/NotificationDropdown.svelte
index 9f2c6c58..412cef4f 100644
--- a/frontend/src/lib/notification/NotificationDropdown.svelte
+++ b/frontend/src/lib/notification/NotificationDropdown.svelte
@@ -14,7 +14,7 @@ type Props = {
let { notifications, onMarkRead, onMarkAllRead, onClose }: Props = $props();
function handleViewAll() {
- onClose();
+ onClose(); // close first — avoids stale dropdown during navigation transition
goto('/aktivitaeten');
}
@@ -135,8 +135,9 @@ function handleViewAll() {
diff --git a/frontend/src/lib/notification/NotificationDropdown.svelte.test.ts b/frontend/src/lib/notification/NotificationDropdown.svelte.test.ts
index 3c410403..5337b752 100644
--- a/frontend/src/lib/notification/NotificationDropdown.svelte.test.ts
+++ b/frontend/src/lib/notification/NotificationDropdown.svelte.test.ts
@@ -159,7 +159,7 @@ describe('NotificationDropdown', () => {
expect(onMarkAllRead).toHaveBeenCalledOnce();
});
- it('calls onClose when the view-all button is clicked', async () => {
+ it('calls onClose when the view-all link is clicked', async () => {
const onClose = vi.fn();
render(NotificationDropdown, {
props: {
@@ -170,12 +170,12 @@ describe('NotificationDropdown', () => {
}
});
- await page.getByRole('button', { name: /alle aktivitäten|view all/i }).click();
+ await page.getByRole('link', { name: /alle aktivitäten|view all/i }).click();
expect(onClose).toHaveBeenCalledOnce();
});
- it('navigates to /aktivitaeten when the view-all button is clicked', async () => {
+ it('navigates to /aktivitaeten when the view-all link is clicked', async () => {
render(NotificationDropdown, {
props: {
notifications: [],
@@ -185,11 +185,29 @@ describe('NotificationDropdown', () => {
}
});
- await page.getByRole('button', { name: /alle aktivitäten|view all/i }).click();
+ await page.getByRole('link', { name: /alle aktivitäten|view all/i }).click();
expect(goto).toHaveBeenCalledWith('/aktivitaeten');
});
+ it('calls onClose before navigating to /aktivitaeten', async () => {
+ const callOrder: string[] = [];
+ const onClose = vi.fn(() => callOrder.push('close'));
+ (goto as ReturnType).mockImplementation(() => callOrder.push('goto'));
+ render(NotificationDropdown, {
+ props: {
+ notifications: [],
+ onMarkRead: () => {},
+ onMarkAllRead: () => {},
+ onClose
+ }
+ });
+
+ await page.getByRole('link', { name: /alle aktivitäten|view all/i }).click();
+
+ expect(callOrder).toEqual(['close', 'goto']);
+ });
+
it('renders MENTION items with the mention verb text', async () => {
render(NotificationDropdown, {
props: {