test(e2e): cover pagination clamping and page retention, drop the jsdom describe

The pagination e2e now clamps at the last page under real clicks and
key presses, and a shared-state test drives a bundled copy through the
page-index semantics: a re-publish of the same problems keeps the page
the user navigated to, a different set starts back at page one.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Author: bjohansebas

test/e2e/overlay.test.js

@@ -323,6 +323,9 @@ describe("error overlay (browser)", () => {
       document.body.textContent.includes("2 / 2"),
     );
 
+    // Clamped at the last page.
+    await frame.click('[aria-label="Next problem"]');
+    await page.keyboard.press("ArrowRight");
     expect(await frame.evaluate(() => document.body.textContent)).toContain(
       "2 / 2",
     );
@@ -683,6 +686,47 @@ describe("overlay shared state across bundled copies (browser)", () => {
     expect(await page.$(`#${OVERLAY_ID}`)).toBeNull();
   });
 
+  it("resets the page for a new problem set and keeps it for a re-publish", async () => {
+    await start();
+    await page.goto(hotApp.url);
+
+    await page.evaluate(() => {
+      globalThis.overlayA.showProblems("errors", ["first boom", "second boom"]);
+    });
+    const frame = await overlayFrame();
+    await frame.click('[aria-label="Next problem"]');
+    await frame.waitForFunction(() =>
+      document.body.textContent.includes("2 / 2"),
+    );
+
+    // Re-publishing the same problems (every clean rebuild does) keeps the
+    // page the user navigated to…
+    await page.evaluate(() => {
+      globalThis.overlayA.showProblems("errors", ["first boom", "second boom"]);
+    });
+    await frame.waitForFunction(() =>
+      document.body.textContent.includes("2 / 2"),
+    );
+    expect(await frame.evaluate(() => document.body.textContent)).toContain(
+      "second boom",
+    );
+
+    // …while a different set starts back at the first page.
+    await page.evaluate(() => {
+      globalThis.overlayA.showProblems("errors", [
+        "new first",
+        "new second",
+        "new third",
+      ]);
+    });
+    await frame.waitForFunction(() =>
+      document.body.textContent.includes("1 / 3"),
+    );
+    expect(await frame.evaluate(() => document.body.textContent)).toContain(
+      "new first",
+    );
+  });
+
   it("fills state fields missing from an older copy's shape", async () => {
     await start();
     // An older package version created a leaner shared state before the

test/overlay.test.js

@@ -202,66 +202,6 @@ describe("overlay", () => {
     });
   });
 
-  describe("pagination", () => {
-    afterEach(() => {
-      // Restore the default.
-      configureOverlay({ paginate: true });
-    });
-
-    it("navigates with the prev/next buttons and clamps at the ends", () => {
-      showProblems("errors", ["first boom", "second boom"]);
-
-      const next = [...getCard().querySelectorAll("button")].find(
-        (button) => button.getAttribute("aria-label") === "Next problem",
-      );
-
-      next.click();
-      expect(getCard().textContent).toContain("second boom");
-      expect(getCard().textContent).toContain("2 / 2");
-
-      // Clamped at the last page.
-      const nextAgain = [...getCard().querySelectorAll("button")].find(
-        (button) => button.getAttribute("aria-label") === "Next problem",
-      );
-
-      nextAgain.click();
-      expect(getCard().textContent).toContain("2 / 2");
-
-      const prev = [...getCard().querySelectorAll("button")].find(
-        (button) => button.getAttribute("aria-label") === "Previous problem",
-      );
-
-      prev.click();
-      expect(getCard().textContent).toContain("first boom");
-    });
-
-    it("resets to the first page on a new problem set", () => {
-      showProblems("errors", ["first boom", "second boom"]);
-
-      getOverlay().contentDocument.dispatchEvent(
-        new KeyboardEvent("keydown", { key: "ArrowRight" }),
-      );
-      showProblems("errors", ["new first", "new second", "new third"]);
-
-      expect(getCard().textContent).toContain("new first");
-      expect(getCard().textContent).toContain("1 / 3");
-    });
-
-    it("keeps the current page when the same problems are re-published", () => {
-      showProblems("errors", ["first boom", "second boom"]);
-
-      getOverlay().contentDocument.dispatchEvent(
-        new KeyboardEvent("keydown", { key: "ArrowRight" }),
-      );
-      expect(getCard().textContent).toContain("2 / 2");
-
-      showProblems("errors", ["first boom", "second boom"]);
-
-      expect(getCard().textContent).toContain("second boom");
-      expect(getCard().textContent).toContain("2 / 2");
-    });
-  });
-
   describe("configureOverlay", () => {
     it("returns the overlay API", () => {
       const api = configureOverlay({});