fix(notifications): preserve action state and accessible recovery

job-tracker-ui/src/app-shell-notifications.test.tsx

@@ -1,12 +1,17 @@
 import React from "react";
 import "@testing-library/jest-dom";
-import { fireEvent, render, screen } from "@testing-library/react";
+import { act, fireEvent, render, screen } from "@testing-library/react";
 import { CssVarsProvider } from "@mui/material/styles";
 
 import { I18nProvider } from "./i18n/I18nProvider";
 import AppShell from "./layout/AppShell";
 import { getTheme } from "./theme";
 
+beforeEach(() => {
+  localStorage.removeItem("uiLanguage");
+  document.documentElement.lang = "en";
+});
+
 test("notification bell exposes its unread count and keyboard-accessible action", () => {
   const open = jest.fn();
   render(
@@ -32,6 +37,8 @@ test("notification bell exposes its unread count and keyboard-accessible action"
 
   const bell = screen.getByRole("button", { name: "Notifications" });
   expect(screen.getByText("3")).toBeInTheDocument();
+  expect(bell.getAttribute("aria-describedby")).toBeTruthy();
+  expect(bell).toHaveAccessibleDescription("Unread notifications: 3");
   fireEvent.click(bell);
   expect(open).toHaveBeenCalledTimes(1);
   expect(open.mock.calls[0][0]).toBeInstanceOf(HTMLElement);
@@ -102,3 +109,36 @@ test("shell icon controls expose accessible names", () => {
   expect(screen.getByRole("button", { name: "Settings" })).toBeInTheDocument();
   expect(screen.getByRole("button", { name: "User" })).toBeInTheDocument();
 });
+
+function renderNotificationShell(count?: number) {
+  return render(<CssVarsProvider theme={getTheme("light") as any} defaultMode="light"><I18nProvider><AppShell pageTitle="Dashboard" breadcrumbs={["Home"]} pathname="/dashboard" nav={[]} navBottom={[]} onNavigate={() => undefined} onToggleDrawer={() => undefined} drawerOpen={false} notificationsCount={count}><div>Content</div></AppShell></I18nProvider></CssVarsProvider>);
+}
+
+test("[P7-08 notifications] an unavailable unread count stays unknown and its description follows the UI language", async () => {
+  renderNotificationShell();
+  const bell = screen.getByRole("button", { name: "Notifications" });
+  expect(bell.getAttribute("aria-describedby")).toBeTruthy();
+  expect(bell).toHaveAccessibleDescription("Unread notification count is unavailable.");
+  expect(bell).not.toHaveAccessibleDescription("Unread notifications: 0");
+  await act(async () => { window.dispatchEvent(new StorageEvent("storage", { key: "uiLanguage", newValue: "nb" })); });
+  expect(screen.getByRole("button", { name: "Varsler" })).toHaveAccessibleDescription("Antall uleste varsler er utilgjengelig.");
+});
+
+test("[P7-08 notifications] a recorded zero unread count has a truthful separate description", () => {
+  renderNotificationShell(0);
+  const bell = screen.getByRole("button", { name: "Notifications" });
+  expect(bell.getAttribute("aria-describedby")).toBeTruthy();
+  expect(bell).toHaveAccessibleDescription("Unread notifications: 0");
+  expect(bell).not.toHaveAccessibleDescription("Unread notification count is unavailable.");
+});
+
+test("[P7-08 notifications] the known unread count is described in Bokmål without changing the bell action's name", async () => {
+  localStorage.setItem("uiLanguage", "nb");
+  renderNotificationShell(3);
+  const bell = screen.getByRole("button", { name: "Varsler" });
+  expect(screen.getByText("3")).toBeInTheDocument();
+  expect(bell.getAttribute("aria-describedby")).toBeTruthy();
+  expect(bell).toHaveAccessibleDescription("Uleste varsler: 3");
+  await act(async () => { window.dispatchEvent(new StorageEvent("storage", { key: "uiLanguage", newValue: "en" })); });
+  expect(screen.getByRole("button", { name: "Notifications" })).toHaveAccessibleDescription("Unread notifications: 3");
+});