chore: refresh dependencies and browser test baselines

- bump the package to 5.29.0 and update acad-ts, Playwright, TypeScript, Node types, esbuild, pretext, and the getBoxQuads polyfill

- run Chromium test projects through Chrome Canary with experimental web platform features so Element and Text use native getBoxQuads implementations

- preserve native box-quad APIs, harden generated binary writes on Windows, and update media, font, form-control, and SVG assertions for current browser behavior

- regenerate Chrome Canary and Firefox demo artifacts, writer outputs, assets, and previews

Validated with the TypeScript build, production bundle, dependency-tree check, package dry-run, the comprehensive Playwright suite, and focused reruns of all initially failing cases.

Author: jogibear9988

AGENT.md

@@ -13,8 +13,8 @@
 
 ### Browser Selection
 - **Always use Firefox** for finding rendering issues.
-- The `getBoxQuads` API is only emulated in Chrome and does not accurately reflect real-world behavior, especially for edge cases.
-- Firefox in our tests has enabled native gtBoxQuads API!
+- Chrome tests use Chrome Canary with Experimental Web Platform Features enabled, which exposes native `getBoxQuads`.
+- Firefox tests also enable the native `getBoxQuads` API.
 
 ### Regression Testing
 - When testing for new issues, **always verify that no other renderings are broken**.

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@node-projects/layout2vector",
-  "version": "5.28.0",
+  "version": "5.29.0",
   "description": "DOM → Geometry → DXF/PDF/PNG library",
   "repository": {
     "type": "git",
@@ -37,7 +37,7 @@
     "bundle": "esbuild ./dist/index.js --format=esm --minify --external:@tarikjabiri/dxf --external:@node-projects/acad-ts --external:@chenglou/pretext --external:fonteditor-core --platform=neutral --bundle --outfile=./dist/index-min.js"
   },
   "dependencies": {
-    "@node-projects/acad-ts": "^2.3.0",
+    "@node-projects/acad-ts": "^3.0.0",
     "@tarikjabiri/dxf": "^2.8.9"
   },
   "peerDependencies": {
@@ -50,11 +50,11 @@
     }
   },
   "devDependencies": {
-    "@chenglou/pretext": ">=0.0.6",
-    "@playwright/test": "^1.59.1",
-    "@types/node": "^25.6.1",
-    "esbuild": "^0.28.0",
-    "get-box-quads-polyfill": "^4.43.0",
-    "typescript": "^6.0.3"
+    "@chenglou/pretext": ">=0.0.8",
+    "@playwright/test": "^1.62.1",
+    "@types/node": "^26.2.0",
+    "esbuild": "^0.28.2",
+    "get-box-quads-polyfill": "^4.47.0",
+    "typescript": "^7.0.2"
   }
 }

package.json

@@ -1,80 +1,70 @@
 import { defineConfig } from "@playwright/test";
 
-const browser = (process.env.BROWSER as "chromium" | "firefox") || "chromium";
+const chromeCanary = {
+  browserName: "chromium" as const,
+  channel: "chrome-canary",
+  launchOptions: {
+    args: ["--enable-experimental-web-platform-features"],
+  },
+};
+
+const firefox = {
+  browserName: "firefox" as const,
+  launchOptions: {
+    firefoxUserPrefs: {
+      "layout.css.getBoxQuads.enabled": true,
+    },
+  },
+};
 
 export default defineConfig({
   testDir: "./tests",
   timeout: 30000,
   retries: 0,
   use: {
-    browserName: browser,
     headless: true,
   },
   projects: [
     {
       name: "unit",
       testMatch: "unit/**/*.test.ts",
+      use: chromeCanary,
     },
     {
       name: "integration",
       testMatch: "integration/**/*.test.ts",
+      use: chromeCanary,
     },
     {
       name: "ui",
       testMatch: "ui/**/*.test.ts",
+      use: chromeCanary,
     },
     {
       name: "demos",
       testMatch: "demos/**/*.test.ts",
+      use: chromeCanary,
     },
     // Firefox projects — use native getBoxQuads (no polyfill needed)
     {
       name: "firefox-unit",
       testMatch: "unit/**/*.test.ts",
-      use: {
-        browserName: "firefox",
-        launchOptions: {
-          firefoxUserPrefs: {
-            "layout.css.getBoxQuads.enabled": true,
-          },
-        },
-      },
+      use: firefox,
     },
     {
       name: "firefox-integration",
       testMatch: "integration/**/*.test.ts",
-      use: {
-        browserName: "firefox",
-        launchOptions: {
-          firefoxUserPrefs: {
-            "layout.css.getBoxQuads.enabled": true,
-          },
-        },
-      },
+      use: firefox,
     },
     {
       name: "firefox-ui",
       testMatch: "ui/**/*.test.ts",
-      use: {
-        browserName: "firefox",
-        launchOptions: {
-          firefoxUserPrefs: {
-            "layout.css.getBoxQuads.enabled": true,
-          },
-        },
-      },
+      use: firefox,
     },
     {
       name: "firefox-demos",
       testMatch: "demos/**/*.test.ts",
-      use: {
-        browserName: "firefox",
-        launchOptions: {
-          firefoxUserPrefs: {
-            "layout.css.getBoxQuads.enabled": true,
-          },
-        },
-      },
+      use: firefox,
     },
   ],
 });

playwright.config.ts

@@ -71,6 +71,24 @@ export function ensureDirectory(dirPath: string): void {
   }
 }
 
+function writeBinaryFile(filePath: string, data: Uint8Array): void {
+  let lastError: unknown;
+  for (let attempt = 0; attempt < 10; attempt++) {
+    try {
+      fs.writeFileSync(filePath, data);
+      return;
+    } catch (error) {
+      lastError = error;
+      // Windows scanners and preview handlers can briefly retain generated
+      // binaries after a previous test has read them.
+      if ((error as NodeJS.ErrnoException).code !== "UNKNOWN") throw error;
+      Atomics.wait(new Int32Array(new SharedArrayBuffer(4)), 0, 0, 50);
+    }
+  }
+
+  throw lastError;
+}
+
 ensureDirectory(outputRootDir);
 
 export function getProjectOutputDir(browserName: string): string {
@@ -754,28 +772,28 @@ export async function convertPageToAllWriters(options: ConvertPageToAllWritersOp
   expect(emfBytes).toBeInstanceOf(Uint8Array);
   expect(emfBytes.length).toBeGreaterThan(80);
   const emfPath = path.join(outputDir, `${name}.emf`);
-  fs.writeFileSync(emfPath, emfBytes);
+  writeBinaryFile(emfPath, emfBytes);
 
   const emfPlusWriter = new EMFPlusWriter({ width: viewport.width, height: viewport.height });
   const emfPlusBytes = await renderIR(fontFallbackIr, emfPlusWriter);
   expect(emfPlusBytes).toBeInstanceOf(Uint8Array);
   expect(emfPlusBytes.length).toBeGreaterThan(80);
   const emfPlusPath = path.join(outputDir, `${name}-emfplus.emf`);
-  fs.writeFileSync(emfPlusPath, emfPlusBytes);
+  writeBinaryFile(emfPlusPath, emfPlusBytes);
 
   const dwgWriter = new DWGWriter({ maxY: viewport.height });
   const dwgBytes = await renderIR(fontFallbackIr, dwgWriter);
   expect(dwgBytes).toBeInstanceOf(Uint8Array);
   expect(dwgBytes.length).toBeGreaterThan(100);
   const dwgPath = path.join(outputDir, `${name}.dwg`);
-  fs.writeFileSync(dwgPath, dwgBytes);
+  writeBinaryFile(dwgPath, dwgBytes);
 
   const acadDxfWriter = new AcadDXFWriter({ maxY: viewport.height });
   const acadDxfBytes = await renderIR(fontFallbackIr, acadDxfWriter);
   expect(acadDxfBytes).toBeInstanceOf(Uint8Array);
   expect(acadDxfBytes.length).toBeGreaterThan(100);
   const acadDxfPath = path.join(outputDir, `${name}-acad.dxf`);
-  fs.writeFileSync(acadDxfPath, acadDxfBytes);
+  writeBinaryFile(acadDxfPath, acadDxfBytes);
 
   const dxfSize = fs.statSync(dxfPath).size;
   const pdfSize = fs.statSync(pdfPath).size;
@@ -813,4 +831,4 @@ export async function convertPageToAllWriters(options: ConvertPageToAllWritersOp
       png: pngError,
     },
   };
-}
+}

tests/demos/demo-conversion.ts

@@ -162,7 +162,7 @@ <h1>First-frame video export</h1>
 
         drawFrame(ctx, "FRAME 1", "#eb3b5a", "#fed330");
 
-        const stream = canvas.captureStream(8);
+        const stream = canvas.captureStream(30);
         const recorder = new MediaRecorder(stream, {
           mimeType,
           videoBitsPerSecond: 300000,
@@ -181,9 +181,9 @@ <h1>First-frame video export</h1>
         });
 
         recorder.start();
-        await delay(180);
+        await delay(500);
         drawFrame(ctx, "FRAME 2", "#2d98da", "#20bf6b");
-        await delay(180);
+        await delay(500);
         recorder.stop();
         await stopped;
         stream.getTracks().forEach((track) => track.stop());
@@ -247,4 +247,4 @@ <h1>First-frame video export</h1>
     })();
   </script>
 </body>
-</html>
+</html>

tests/demos/video.html

@@ -127,9 +127,13 @@ export async function injectLibrary(page: Page): Promise<void> {
  * ONLY used in tests — never bundled in production.
  */
 export async function injectBoxQuadsPolyfill(page: Page): Promise<void> {
-  // Firefox has native getBoxQuads — skip the polyfill
-  const browserName = page.context().browser()?.browserType().name();
-  if (browserName === "firefox") return;
+  // Preserve native implementations (Firefox and Chrome Canary with
+  // Experimental Web Platform Features enabled).
+  const hasNativeBoxQuads = await page.evaluate(() =>
+    typeof Element.prototype.getBoxQuads === "function"
+    && typeof Text.prototype.getBoxQuads === "function"
+  );
+  if (hasNativeBoxQuads) return;
 
   // Read the polyfill source from node_modules
   const polyfillPath = path.resolve(