fix(notifications): a row is named by what it is about, not its kind alone

frontend/src/modules/notifications/NotificationsPanel.order.dom.test.tsx

@@ -223,7 +223,10 @@ describe("NotificationsPanel · order", () => {
     await act(async () => rerender());
     expect(listUnder("inbox.sectionNeedsYou:1")).toEqual(["Activity 2"]);
     const button = screen.getByRole("button", { name: "inbox.markAllRead" });
-    expect(button.hasAttribute("disabled")).toBe(false);
+    // Unavailable reads either way: natively while unfocused, aria-disabled while it holds the focus.
+    expect(button.hasAttribute("disabled") || button.getAttribute("aria-disabled") === "true").toBe(
+      false,
+    );
     fireEvent.click(button);
     await act(async () => rerender());
     expect(screen.queryByText(/inbox\.sectionNeedsYou/)).toBeNull();
@@ -266,4 +269,22 @@ describe("NotificationsPanel · order", () => {
     );
     await waitFor(() => expect(listUnder("inbox.sectionNeedsYou:1")).toEqual(["Ready 1"]));
   });
+
+  it("names each row by what it is about, so two of one kind tell apart", async () => {
+    // A screen reader hears the name while the keyboard is on the row, and Back finds the row it
+    // left by it: "Download ready" alone was every download's name.
+    h.server = [server(1, 1 * H, true), server(2, 2 * H, true)];
+    h.client = [client(3, 3 * H, { title: "Something broke", message: "Unexpected error." })];
+    mount();
+    await loaded();
+    expect(
+      [...document.querySelectorAll("[data-nav-index]")].map((r) =>
+        r.getAttribute("data-nav-name"),
+      ),
+    ).toEqual([
+      "inbox.downloadDone.title: Ready 1",
+      "inbox.downloadDone.title: Ready 2",
+      "Something broke: Unexpected error.",
+    ]);
+  });
 });