@odori/cli 0.0.5 → 0.0.7

package/bin/odori.mjs

@@ -1,6 +1,5 @@
 #!/usr/bin/env node
 import {existsSync} from "node:fs";
-import {createRequire} from "node:module";
 import {dirname, resolve} from "node:path";
 import {fileURLToPath, pathToFileURL} from "node:url";
 
@@ -19,21 +18,44 @@ import {fileURLToPath, pathToFileURL} from "node:url";
 const here = dirname(fileURLToPath(import.meta.url));
 const built = resolve(here, "..", "dist", "cli.js");
 
+/*
+ * import.meta.resolve, not createRequire().resolve.
+ *
+ * The published runtime is ESM only: its exports declare `import` and no
+ * `require`, so a CommonJS resolver cannot see it at all and throws
+ * ERR_PACKAGE_PATH_NOT_EXPORTED. The catch below then answered "yes, source",
+ * which meant every installed copy took the transform branch. Not just the
+ * pause this was written to avoid, but a real failure: the CLI would run its
+ * TypeScript through tsx while Node was already stripping types itself, and
+ * loading a project's odori.config.ts landed in a require(esm) cycle that
+ * Node refuses outright. odori doctor could not run in a new project.
+ *
+ * import.meta.resolve honours the same conditions the CLI's own imports use,
+ * so it answers the question that was actually being asked.
+ */
 const runtimeIsSource = () => {
   try {
-    return /\.tsx?$/.test(createRequire(import.meta.url).resolve("odori"));
+    return /\.tsx?$/.test(import.meta.resolve("odori"));
   } catch {
     // Unresolvable from here: let the transform handle whatever it is.
     return true;
   }
 };
 
-if (existsSync(built) && !runtimeIsSource()) {
-  const {run} = await import(pathToFileURL(built).href);
-  process.exitCode = await run(process.argv.slice(2));
-} else {
-  const {register} = await import("tsx/esm/api");
-  register();
-  const {run} = await import("../src/cli.ts");
-  process.exitCode = await run(process.argv.slice(2));
-}
+/*
+ * The transform is registered either way, because it is not there for the
+ * CLI. A project's videos are .tsx, and Node's own type stripping erases
+ * types without understanding JSX, so `odori list` on a real project fails
+ * with "Unknown file extension .tsx" the moment nothing is registered.
+ *
+ * What the branch decides is only where the CLI's own code comes from: its
+ * build when there is one, its source inside this repository, where `odori`
+ * resolves to a .tsx the build could not have linked against.
+ */
+const {register} = await import("tsx/esm/api");
+register();
+
+const {run} = await import(
+  existsSync(built) && !runtimeIsSource() ? pathToFileURL(built).href : "../src/cli.ts"
+);
+process.exitCode = await run(process.argv.slice(2));

package/dist/{chunk-RHG23EWW.js → chunk-STVORYOF.js}

@@ -317,7 +317,7 @@ var toComponent = (item) => ({
 });
 var snapshotItems = async () => {
   try {
-    const loaded = await import("./registry-snapshot-JEVXYGS2.js");
+    const loaded = await import("./registry-snapshot-ADKSTGDR.js");
     return loaded.default.items;
   } catch {
     throw new Error(
@@ -1757,9 +1757,10 @@ var renderUrl = (origin, target, frame) => {
   if (target.prepared !== void 0) params.set("prepared", encodeParam(target.prepared));
   return `${origin}/?${params.toString()}`;
 };
+var BROWSER_ARGS = ["--enable-unsafe-swiftshader"];
 var openRenderPage = async (origin, target, config) => {
   const executablePath = await browserExecutable(config);
-  const browser = await chromium.launch({ executablePath, headless: true });
+  const browser = await chromium.launch({ executablePath, headless: true, args: BROWSER_ARGS });
   const page = await browser.newPage({
     viewport: { width: target.width, height: target.height },
     deviceScaleFactor: 1
@@ -2990,7 +2991,7 @@ var doctorCommand = async (root = process.cwd()) => {
 };
 
 // src/commands/init.ts
-import { mkdir as mkdir15, writeFile as writeFile16 } from "fs/promises";
+import { mkdir as mkdir15, readFile as readFile15, writeFile as writeFile16 } from "fs/promises";
 import { existsSync as existsSync19 } from "fs";
 import { relative as relative10, resolve as resolve22 } from "path";
 
@@ -3125,8 +3126,28 @@ var initCommand = async (root = process.cwd()) => {
     await writeFile16(file, contents, "utf8");
     log.success(`Created ${relative10(root, file)}`);
   }
+  await ensureModuleType(root);
   log.detail("Next: odori doctor, then odori add title-reveal end-card, then odori dev.");
 };
+var ensureModuleType = async (root) => {
+  const file = resolve22(root, "package.json");
+  if (!existsSync19(file)) {
+    log.warn('No package.json here. Odori needs an ESM package: run npm init, then add "type": "module".');
+    return;
+  }
+  let manifest;
+  try {
+    manifest = JSON.parse(await readFile15(file, "utf8"));
+  } catch {
+    log.warn('package.json is not readable JSON, so "type": "module" was not set. Odori needs it.');
+    return;
+  }
+  if (manifest.type === "module") return;
+  manifest.type = "module";
+  await writeFile16(file, `${JSON.stringify(manifest, null, 2)}
+`, "utf8");
+  log.success('Set "type": "module" in package.json');
+};
 
 // src/commands/inspect.ts
 import { isOdoriSchema, resolveEntryLayout as resolveEntryLayout5 } from "odori";
@@ -3339,7 +3360,7 @@ var checkInstalledContracts = async (config, videos) => {
 };
 
 // src/determinism.ts
-import { readdir as readdir8, readFile as readFile15 } from "fs/promises";
+import { readdir as readdir8, readFile as readFile16 } from "fs/promises";
 import { existsSync as existsSync21 } from "fs";
 import { join as join7, relative as relative11, resolve as resolve25 } from "path";
 var FORBIDDEN = [
@@ -3386,7 +3407,7 @@ var checkDeterminism = async (config) => {
   if (!existsSync21(root)) return [];
   const files = await walk2(root);
   const findings = await Promise.all(
-    files.map(async (file) => scanSource(await readFile15(file, "utf8"), relative11(config.root, file)))
+    files.map(async (file) => scanSource(await readFile16(file, "utf8"), relative11(config.root, file)))
   );
   return findings.flat();
 };
@@ -3407,15 +3428,36 @@ var CANVAS_SCRIPT = `(() => {
   });
 
   return canvases.map(function (canvas, index) {
-    var context = canvas.getContext("2d");
-    if (!context || canvas.width === 0 || canvas.height === 0) {
+    if (canvas.width === 0 || canvas.height === 0) {
       return {index: index, hash: "no-context", blank: true};
     }
     var data;
-    try {
-      data = context.getImageData(0, 0, canvas.width, canvas.height).data;
-    } catch (error) {
-      return {index: index, hash: "tainted", blank: false};
+    var isGl = false;
+    var context = canvas.getContext("2d");
+    if (context) {
+      try {
+        data = context.getImageData(0, 0, canvas.width, canvas.height).data;
+      } catch (error) {
+        return {index: index, hash: "tainted", blank: false};
+      }
+    } else {
+      /*
+       * A canvas that already holds a GL context returns null for "2d", and
+       * reading that as an empty canvas reported every shader video as having
+       * drawn nothing while it was drawing correctly. Pixels come back through
+       * readPixels instead, which is the only way to see a GL surface.
+       *
+       * Worth knowing when this comes back empty: a drawing buffer is cleared
+       * once it has been composited unless the context was asked for with
+       * preserveDrawingBuffer, so an author who has not set that gets a real
+       * frame on screen and nothing here.
+       */
+      var gl = canvas.getContext("webgl2") || canvas.getContext("webgl");
+      if (!gl) return {index: index, hash: "no-context", blank: true};
+      var pixels4 = new Uint8Array(canvas.width * canvas.height * 4);
+      gl.readPixels(0, 0, canvas.width, canvas.height, gl.RGBA, gl.UNSIGNED_BYTE, pixels4);
+      data = pixels4;
+      isGl = true;
     }
 
     // A prime stride over the whole buffer rather than a coarse grid: a grid
@@ -3431,7 +3473,7 @@ var CANVAS_SCRIPT = `(() => {
       hash =
         ((hash << 5) + hash + data[offset] + data[offset + 1] * 3 + data[offset + 2] * 7 + data[offset + 3] * 11) | 0;
     }
-    return {index: index, hash: String(hash), blank: opaque === 0};
+    return {index: index, hash: String(hash), blank: opaque === 0, gl: isGl};
   });
 })()`;
 var FRAME_SCRIPT = `(() => {
@@ -3446,6 +3488,11 @@ var FRAME_SCRIPT = `(() => {
 
   for (var index = 0; index < nodes.length; index += 1) {
     var node = nodes[index];
+    /* The subtree an effect surface is photographing is deliberately parked
+       outside the frame. It is the input to a canvas, not something a viewer
+       ever sees, so judging its position or its type size is judging the
+       wrong thing. */
+    if (node.closest("[data-odori-capture]")) continue;
     var box = node.getBoundingClientRect();
     if (box.width === 0 || box.height === 0) continue;
     var style = getComputedStyle(node);
@@ -3462,6 +3509,18 @@ var FRAME_SCRIPT = `(() => {
     if (!media && text.length === 0) continue;
 
     var label = text.length > 0 ? '"' + text.slice(0, 32) + '"' : "<" + node.tagName.toLowerCase() + ">";
+
+    /*
+     * Chrome is exempt from the readability floor.
+     *
+     * A component that recreates somebody else's app is right to draw that
+     * app's sidebar at the size that app draws it. Slack's rail really is
+     * 16px, and enlarging it until this check is happy produces a Slack that
+     * does not look like Slack. That text is furniture: it says "this is
+     * Slack", and nobody is meant to read it. What has to be legible is the
+     * content the video is actually about, which is what stays checked.
+     */
+    var chrome = node.closest("[data-odori-chrome]") !== null;
     if (
       box.right > bounds.right + 1 ||
       box.left < bounds.left - 1 ||
@@ -3474,8 +3533,18 @@ var FRAME_SCRIPT = `(() => {
     // Normalize against the shorter side, the same reference useDesignScale
     // uses, so a vertical cut is not judged as if it were letterboxed.
     var reference = Math.min(bounds.width, bounds.height);
-    var relative = (parseFloat(style.fontSize) / reference) * 1080;
-    if (text.length > 0 && relative > 0 && relative < 20) {
+    /*
+     * What the glyphs actually measure on screen, not what the stylesheet
+     * asked for. A scene that pushes in on a surface makes its text bigger,
+     * and reading font-size alone called that a violation while the viewer
+     * was looking at type half again as large. The ratio of the painted box
+     * to the laid-out box is every ancestor transform multiplied together,
+     * which is exactly the correction wanted, and it cancels the root's own
+     * fit scale because the reference is measured through it too.
+     */
+    var zoom = node.offsetHeight > 0 ? box.height / node.offsetHeight : 1;
+    var relative = ((parseFloat(style.fontSize) * zoom) / reference) * 1080;
+    if (!chrome && text.length > 0 && relative > 0 && relative < 20) {
       var note = label + " at " + Math.round(relative) + "px";
       if (small.indexOf(note) < 0) small.push(note);
     }
@@ -3530,7 +3599,10 @@ var testVideo = async (origin, video, config, failures, quiet = false) => {
         for (const canvas of canvases) {
           const second = again.find((item) => item.index === canvas.index);
           if (canvas.blank) {
-            failures.push({ video: id, message: `Frame ${frame}: canvas ${canvas.index} drew nothing.` });
+            failures.push({
+              video: id,
+              message: canvas.gl ? `Frame ${frame}: canvas ${canvas.index} read back empty. A WebGL drawing buffer is cleared once it has been composited, so ask for the context with {preserveDrawingBuffer: true}.` : `Frame ${frame}: canvas ${canvas.index} drew nothing.`
+            });
             continue;
           }
           if (canvas.hash === "tainted") {

package/dist/cli.js

@@ -2,7 +2,7 @@ import {
   checkFlags,
   parseArgs,
   run
-} from "./chunk-RHG23EWW.js";
+} from "./chunk-STVORYOF.js";
 export {
   checkFlags,
   parseArgs,

package/dist/index.js

@@ -75,7 +75,7 @@ import {
   withServer,
   writeGenerated,
   writePrepareCache
-} from "./chunk-RHG23EWW.js";
+} from "./chunk-STVORYOF.js";
 export {
   CHROME_BUILD,
   FORMATS,