fix(cv): align preview pagination with native PDF

2026-10-07 08:46:43 +02:00
parent 046dc304aa
commit efc9e7bdd4
182 changed files with 16092 additions and 47 deletions
@@ -0,0 +1,51 @@
+import { expect, test } from "@playwright/test";
+import fs from "node:fs/promises";
+import path from "node:path";
+import { previewDocumentHtml } from "../src/cvPreview";
+
+const original = path.resolve("../docs/redesign/phase-5/p5-09-readiness/evidence/fidelity");
+
+test("[PRES-C09 C12] original flowing/boundary fixtures retain native PDF page membership", async ({ page }) => {
+  const baseline = JSON.parse(await fs.readFile(path.join(original, "fidelity-results.json"), "utf8"));
+  for (const fixture of baseline.fixtures.filter((fixture: { pass: boolean }) => !fixture.pass)) {
+    await page.setContent(previewDocumentHtml(await fs.readFile(path.join(original, fixture.fixture, "render.html"), "utf8"), 1122.52));
+    await expect.poll(() => page.evaluate(() => document.documentElement.dataset.cvPreviewReady)).toBe("true");
+    expect(await page.evaluate(() => Number(document.documentElement.dataset.cvPreviewPages)), fixture.fixture).toBe(fixture.pdfPages);
+    const membership = await page.evaluate(() => {
+      const width = Number(document.documentElement.dataset.cvPreviewWidth);
+      const walker = document.createTreeWalker(document.querySelector(".page")!, NodeFilter.SHOW_TEXT);
+      const markers: { token: string; page: number }[] = [];
+      let node;
+      while ((node = walker.nextNode())) for (const match of (node.textContent || "").matchAll(/\b[SEBPR]\d{2}\b/g)) {
+        const range = document.createRange();
+        range.setStart(node, match.index!); range.setEnd(node, match.index! + match[0].length);
+        markers.push({ token: match[0], page: Math.floor(range.getClientRects()[0].x / width) + 1 });
+      }
+      return markers;
+    });
+    expect(membership, fixture.fixture).toEqual(fixture.comparisons.map((marker: { token: string; pdfPage: number }) => ({ token: marker.token, page: marker.pdfPage })));
+    expect(await page.evaluate(() => document.body.innerText)).not.toContain("HIDDEN-MARKER");
+  }
+});
+
+test("[PRES-C06 C09] pagination waits for image layout and publishes one settled measurement", async ({ page }) => {
+  let releaseImage!: () => void;
+  const gate = new Promise<void>(resolve => { releaseImage = resolve; });
+  await page.route("**/pagination-photo.svg", async route => {
+    await gate;
+    await route.fulfill({ contentType: "image/svg+xml", body: '<svg xmlns="http://www.w3.org/2000/svg" width="200" height="100"><rect width="200" height="100" fill="navy"/></svg>' });
+  });
+  const html = '<html><head><style>:root{--cv-page-margin:16mm}body{margin:0}.page{width:210mm;min-height:297mm}@media print{.page{width:auto;min-height:0}}</style></head><body><div class="page"><img alt="Synthetic fixture" src="http://localhost:3300/pagination-photo.svg" style="width:20mm"></div></body></html>';
+  await page.setContent(previewDocumentHtml(html, 1122.52), { waitUntil: "domcontentloaded" });
+  expect(await page.evaluate(() => document.documentElement.dataset.cvPreviewReady)).toBeUndefined();
+  await page.evaluate(() => {
+    document.documentElement.dataset.readyEvents = "0";
+    window.addEventListener("cv-preview-ready", () => { document.documentElement.dataset.readyEvents = String(Number(document.documentElement.dataset.readyEvents) + 1); });
+  });
+  releaseImage();
+  await expect.poll(() => page.evaluate(() => document.documentElement.dataset.cvPreviewReady)).toBe("true");
+  expect(await page.evaluate(() => ({ events: document.documentElement.dataset.readyEvents, pages: document.documentElement.dataset.cvPreviewPages }))).toEqual({ events: "1", pages: "1" });
+  expect(await page.evaluate(() => document.querySelector("img")!.getBoundingClientRect().height)).toBeCloseTo(10 * 96 / 25.4, 1);
+  await page.evaluate(() => new Promise<void>(resolve => requestAnimationFrame(() => requestAnimationFrame(() => resolve()))));
+  expect(await page.evaluate(() => document.documentElement.dataset.readyEvents)).toBe("1");
+});