@erclx/canon 5.75.0 → 5.77.0

package/src/capture/render.ts

@@ -34,10 +34,13 @@ const FONT_PROBE_SIZE = 72
 const FONT_PROBE_TEXT = 'canon capture 0123456789'
 const ABSENT_FAMILY = '__canon_absent_family__'
 
+export type ColorScheme = 'light' | 'dark'
+
 export interface CaptureOptions {
   selector: string
   outDir?: string
   width?: number
+  colorScheme?: ColorScheme
 }
 
 export type CaptureResult =
@@ -60,9 +63,7 @@ export async function captureSources(
   const browser = await chromium.launch()
   try {
     return await Promise.all(
-      sources.map((source) =>
-        captureOne(browser, source, options.selector, options.width),
-      ),
+      sources.map((source) => captureOne(browser, source, options)),
     )
   } finally {
     await browser.close()
@@ -76,8 +77,7 @@ export async function captureSources(
 async function captureOne(
   browser: Browser,
   source: CaptureSource,
-  selector: string,
-  width: number | undefined,
+  { selector, width, colorScheme }: CaptureOptions,
 ): Promise<CaptureResult> {
   /**
    * A viewport rather than a wrapper, since a media query answers to the
@@ -90,11 +90,13 @@ async function captureOne(
     ...(width === undefined
       ? {}
       : { viewport: { width, height: DEFAULT_VIEWPORT_HEIGHT } }),
+    ...(colorScheme === undefined ? {} : { colorScheme }),
   })
   try {
     await page.goto(
       source.kind === 'url' ? source.url : pathToFileURL(source.htmlPath).href,
     )
+    if (colorScheme !== undefined) await applyColorScheme(page, colorScheme)
     const element = page.locator(selector).first()
     if ((await element.count()) === 0) {
       return failed(source, `no element matched ${selector}`)
@@ -177,6 +179,29 @@ function sourceIdentifier(source: CaptureSource): string {
   return source.kind === 'url' ? source.url : source.htmlPath
 }
 
+/**
+ * Writes the theme the three switches a stylesheet reads, being the media
+ * query, a `data-theme` attribute, and a `light` or `dark` class on the root,
+ * which is the set Frameboard's theme toggle writes on every frame. The media
+ * query alone leaves a stylesheet keyed on the attribute in its default set,
+ * which is dark for one `canon design css` emits.
+ *
+ * Written after the load event, so a page script restoring a stored theme on
+ * load has already run and cannot overwrite it.
+ */
+async function applyColorScheme(
+  page: Page,
+  scheme: ColorScheme,
+): Promise<void> {
+  await page.evaluate((theme) => {
+    const root = document.documentElement
+    root.setAttribute('data-theme', theme)
+    root.style.colorScheme = theme
+    root.classList.remove('light', 'dark')
+    root.classList.add(theme)
+  }, scheme)
+}
+
 function failed(source: CaptureSource, reason: string): CaptureResult {
   return { status: 'failed', source: sourceIdentifier(source), reason }
 }

package/src/claude/cases/git.ts

@@ -22,6 +22,11 @@ export const GIT_CASES: readonly SkillCase[] = [
     prompt: 'Turn this bug into a GitHub issue and file it.',
     expect: 'git-issue',
   },
+  {
+    prompt:
+      'Log this bug, but add it to the open issue if one already covers it.',
+    expect: 'git-issue',
+  },
   {
     prompt: 'Close #42 without merging, #57 supersedes it.',
     expect: 'git-pr-close',

package/src/claude/cases/workflow.ts

@@ -96,6 +96,10 @@ export const WORKFLOW_CASES: readonly SkillCase[] = [
       'Our backlog only ever grows, measure each row and suggest which to decline.',
     expect: 'backlog-triage',
   },
+  {
+    prompt: 'File the open issues on this repo into an intake folder.',
+    expect: 'issue-triage',
+  },
   // Rot across documents nobody changed is what this reads, rather than a
   // stated rule broken on a given line. It is also not `target-check`, which
   // asks whether a document exists and holds its sections rather than whether

package/src/commands/capture.ts

@@ -31,6 +31,9 @@ const DEFAULT_SOURCE = 'assets'
  */
 type Renderer = typeof import('@/capture/render')
 type CaptureResult = Awaited<ReturnType<Renderer['captureSources']>>[number]
+type ColorScheme = import('@/capture/render').ColorScheme
+
+const COLOR_SCHEMES: readonly ColorScheme[] = ['light', 'dark']
 
 /**
  * Holds wiring only. Every browser reference sits behind a dynamic import,
@@ -58,6 +61,10 @@ export function register(program: Command): void {
       '--width <px>',
       'Viewport width in pixels, so a media query resolves at that width',
     )
+    .option(
+      '--color-scheme <scheme>',
+      'Theme to render in, light or dark; defaults to whichever theme the page renders unset',
+    )
     .addHelpText(
       'after',
       [
@@ -70,12 +77,21 @@ export function register(program: Command): void {
         'font-family. --width takes one whole number and sets the viewport, so',
         'run it once per breakpoint with its own --out.',
         '',
+        '--color-scheme sets prefers-color-scheme, a data-theme attribute, and',
+        'a light or dark class on the root, so a stylesheet keyed on any of the',
+        'three renders that theme. Run it once per scheme with its own --out.',
+        '',
       ].join('\n'),
     )
     .action(
       async (
         source: string,
-        opts: { out?: string; selector?: string; width?: string },
+        opts: {
+          out?: string
+          selector?: string
+          width?: string
+          colorScheme?: string
+        },
       ): Promise<void> => {
         /**
          * Refused rather than defaulted, and refused ahead of every other
@@ -102,6 +118,15 @@ export function register(program: Command): void {
           return
         }
 
+        const colorScheme = parseColorScheme(opts.colorScheme)
+        if (colorScheme === null) {
+          frameError(
+            `--color-scheme takes ${COLOR_SCHEMES.join(' or ')}, got ${JSON.stringify(opts.colorScheme)}.`,
+          )
+          process.exitCode = 1
+          return
+        }
+
         const isUrl = isUrlSource(source)
         const sourcePath = isUrl ? source : resolve(process.cwd(), source)
         if (!isUrl && !existsSync(sourcePath)) {
@@ -117,6 +142,7 @@ export function register(program: Command): void {
           results = await renderer.captureSources(sourcePath, {
             selector,
             width,
+            colorScheme,
             outDir: opts.out ? resolve(process.cwd(), opts.out) : undefined,
           })
         } catch (error) {
@@ -160,6 +186,17 @@ function parseWidth(raw: string | undefined): number | undefined {
   return Number.isInteger(value) && value >= 1 ? value : Number.NaN
 }
 
+/**
+ * Undefined for an absent flag and `null` for a value naming no scheme, so the
+ * caller can tell no scheme from a bad one.
+ */
+function parseColorScheme(
+  raw: string | undefined,
+): ColorScheme | undefined | null {
+  if (raw === undefined) return undefined
+  return COLOR_SCHEMES.find((scheme) => scheme === raw) ?? null
+}
+
 /**
  * Closes an open frame around a failure that stopped the whole run rather than
  * one source. Two of them are setup states rather than defects and each names

package/src/commands/claude.ts

@@ -713,6 +713,10 @@ async function runSync(target: string): Promise<number> {
     logWarn(
       'settings.json lacks the merge deny entries. Run `canon migrate session-defaults --write`',
     )
+  } else if (defaults.kind === 'planned' && defaults.plan.lacksPushAllow) {
+    logWarn(
+      'settings.json lacks the lease push allow. Run `canon migrate session-defaults --write`',
+    )
   }
 
   logStep('Scanning .gitignore')

package/src/commands/targets.ts

@@ -267,6 +267,8 @@ function refuseDepth(opts: ListOptions): number {
 interface BackfillSummary {
   readonly recorded: number
   readonly skipped: number
+  /** Skipped too, but for sitting under a scratch root, so its line names that cause. */
+  readonly scratch: number
   readonly failed: number
 }
 
@@ -285,16 +287,18 @@ async function runBackfill(
 
   let recorded = 0
   let skipped = 0
+  let scratch = 0
   let failed = 0
 
   for (const path of paths) {
     const outcome = backfillTarget({ path, stampedAt: stampedAtOf(path) })
     if (outcome === 'recorded') recorded++
     else if (outcome === 'no-stamp') skipped++
+    else if (outcome === 'scratch') scratch++
     else failed++
   }
 
-  return { recorded, skipped, failed }
+  return { recorded, skipped, scratch, failed }
 }
 
 /**
@@ -340,6 +344,12 @@ function reportBackfill(summary: BackfillSummary): void {
     )
   }
 
+  if (summary.scratch > 0) {
+    logWarn(
+      `${plural(summary.scratch, 'target')} skipped, sitting under a scratch folder the index never records.`,
+    )
+  }
+
   if (summary.failed > 0) {
     logError(
       `${plural(summary.failed, 'target')} failed to write, so its row is unchanged.`,

package/src/markdown/scope.ts

@@ -260,6 +260,8 @@ export const GATED_PATHS: readonly string[] = [
   'claude/skills/git-worktree/REQUIREMENT.md',
   'claude/skills/git-worktree/SKILL.md',
   'claude/skills/git-worktree/references/cleanup.md',
+  'claude/skills/issue-triage/REQUIREMENT.md',
+  'claude/skills/issue-triage/SKILL.md',
   'claude/skills/markdown-craft/REQUIREMENT.md',
   'claude/skills/markdown-craft/SKILL.md',
   'claude/skills/markdown-craft/references/markdown.md',

package/src/migrate/session-defaults.ts

@@ -1,8 +1,8 @@
 /**
  * Adds the session defaults the seeded `.claude/settings.json` carries to a
  * target that was seeded before them: the subagent deny, the memory default,
- * the merge deny entries, and the plan guard's PreToolUse wiring where the
- * project holds the guard script.
+ * the merge deny entries, the lease push allow entries, and the plan guard's
+ * PreToolUse wiring where the project holds the guard script.
  *
  * `canon claude init` copies a seed only when the file is absent, so a target
  * holding its own settings never sees a later seed change. This verb adds each
@@ -29,6 +29,17 @@ export const MERGE_DENIED: readonly string[] = [
   'Bash(gh pr merge:*)',
 ]
 
+/**
+ * The two lease pushes a worker runs after rebasing onto a merged pull request,
+ * each pushing the current branch to its own name. An allow rule resolves
+ * before auto mode's classifier, so each entry is exact: a wildcard would also
+ * approve a refspec, a remote, or a flag that reaches the default branch.
+ */
+export const PUSH_ALLOWED: readonly string[] = [
+  'Bash(git push --force-with-lease)',
+  'Bash(git push --force-with-lease origin HEAD)',
+]
+
 /** The command the seed wires, as the seeded settings spell it. */
 export const PLAN_GUARD_COMMAND =
   '"$CLAUDE_PROJECT_DIR"/.claude/hooks/plan-guard.sh'
@@ -61,6 +72,8 @@ export interface SessionDefaultsPlan {
   readonly predates: boolean
   /** True when the deny list lacks any merge entry, whatever else it holds. */
   readonly lacksMergeDeny: boolean
+  /** True when the allow list lacks any lease push entry. */
+  readonly lacksPushAllow: boolean
 }
 
 export type SessionDefaultsRead =
@@ -92,12 +105,20 @@ export function planSessionDefaults(
   const next: SettingsRecord = { ...current }
   const permissions = isRecord(current.permissions) ? current.permissions : {}
   const deny = Array.isArray(permissions.deny) ? permissions.deny : []
+  const allow = Array.isArray(permissions.allow) ? permissions.allow : []
 
   const subagentsMissing = DENIED_TOOLS.filter((tool) => !deny.includes(tool))
   const mergeMissing = MERGE_DENIED.filter((entry) => !deny.includes(entry))
   const missing = [...subagentsMissing, ...mergeMissing]
-  if (missing.length > 0) {
-    next.permissions = { ...permissions, deny: [...deny, ...missing] }
+  const allowMissing = PUSH_ALLOWED.filter((entry) => !allow.includes(entry))
+
+  const nextPermissions: SettingsRecord = { ...permissions }
+  if (missing.length > 0) nextPermissions.deny = [...deny, ...missing]
+  if (allowMissing.length > 0) {
+    nextPermissions.allow = [...allow, ...allowMissing]
+  }
+  if (missing.length + allowMissing.length > 0) {
+    next.permissions = nextPermissions
   }
 
   const memoryAbsent = !('autoMemoryEnabled' in current)
@@ -111,6 +132,7 @@ export function planSessionDefaults(
 
   const keys: SettingsKey[] = [
     { label: 'permissions.deny', changed: missing.length > 0 },
+    { label: 'permissions.allow', changed: allowMissing.length > 0 },
     { label: 'autoMemoryEnabled', changed: memoryAbsent },
     { label: 'hooks.PreToolUse', changed: preToolUse !== undefined },
   ]
@@ -123,6 +145,7 @@ export function planSessionDefaults(
       subagentsMissing.length === DENIED_TOOLS.length &&
       mergeMissing.length === MERGE_DENIED.length,
     lacksMergeDeny: mergeMissing.length > 0,
+    lacksPushAllow: allowMissing.length > 0,
   }
 }
 
@@ -222,10 +245,15 @@ export async function readSessionDefaults(
   if (permissions !== undefined && !isRecord(permissions)) {
     return { kind: 'refused', reason: `${path}: permissions is not an object` }
   }
-  if (permissions?.deny !== undefined && !Array.isArray(permissions.deny)) {
-    return {
-      kind: 'refused',
-      reason: `${path}: permissions.deny is not a list`,
+  for (const list of ['deny', 'allow'] as const) {
+    if (
+      permissions?.[list] !== undefined &&
+      !Array.isArray(permissions[list])
+    ) {
+      return {
+        kind: 'refused',
+        reason: `${path}: permissions.${list} is not a list`,
+      }
     }
   }
 

package/src/targets/registry.ts

@@ -2,11 +2,12 @@ import {
   existsSync,
   mkdirSync,
   readFileSync,
+  realpathSync,
   renameSync,
   writeFileSync,
 } from 'node:fs'
-import { homedir } from 'node:os'
-import { dirname, join, resolve } from 'node:path'
+import { homedir, tmpdir } from 'node:os'
+import { dirname, isAbsolute, join, relative, resolve, sep } from 'node:path'
 
 /**
  * One project the toolkit has installed into, as the install recorded it.
@@ -116,15 +117,90 @@ function isRecord(value: Partial<TargetRecord>): value is TargetRecord {
 }
 
 /**
- * Reads every recorded target, sorted by path.
+ * The folders whose contents are never a project, resolved at call time so a
+ * test's `CANON_STATE_DIR` override moves the state root with it.
+ *
+ * Sandbox runs and replays live under the state folder, background jobs keep
+ * their scratch under `~/.claude/jobs/`, and unit tests stamp into the OS temp
+ * folder. Each one passes through a stamping sync, so without this list every
+ * run leaves a row behind for a folder that is gone a minute later.
+ */
+export function scratchRoots(): readonly string[] {
+  return [tmpdir(), stateDir(), join(homedir(), '.claude', 'jobs')]
+}
+
+/**
+ * Whether a path sits under a scratch root or inside any `.canon/tmp/` folder.
+ *
+ * Both sides are compared in their given and their real form, since macOS
+ * hands out its temp folder as `/var/folders/...` while a path that went
+ * through a symlink resolution reads `/private/var/folders/...`. A
+ * `.claude/worktrees/` checkout is not scratch: it is a real checkout of a real
+ * project, and only a root on the list or a `.canon/tmp/` segment refuses it.
+ */
+export function isScratchPath(
+  target: string,
+  roots: readonly string[] = scratchRoots(),
+): boolean {
+  const forms = bothForms(resolve(target))
+  const rootForms = roots.flatMap((root) => bothForms(resolve(root)))
+
+  return forms.some(
+    (form) =>
+      hasCanonTmpSegment(form) ||
+      rootForms.some((root) => isWithin(form, root)),
+  )
+}
+
+function bothForms(path: string): readonly string[] {
+  try {
+    const real = realpathSync(path)
+    return real === path ? [path] : [path, real]
+  } catch {
+    return [path]
+  }
+}
+
+function hasCanonTmpSegment(path: string): boolean {
+  const segments = path.split(sep)
+  return segments.some(
+    (segment, index) => segment === '.canon' && segments[index + 1] === 'tmp',
+  )
+}
+
+function isWithin(path: string, root: string): boolean {
+  const rel = relative(root, path)
+  return (
+    rel === '' ||
+    (rel !== '..' && !rel.startsWith(`..${sep}`) && !isAbsolute(rel))
+  )
+}
+
+/**
+ * Whether a row still names a project worth listing: a folder that exists and
+ * sits under no scratch root. The read filter and the write prune both call
+ * this, so the two can never disagree on a row.
+ */
+function isLive(row: TargetRecord, roots: readonly string[]): boolean {
+  return existsSync(row.path) && !isScratchPath(row.path, roots)
+}
+
+/**
+ * Reads every recorded target that is still live, sorted by path.
  *
  * A row missing either field is dropped rather than reported. This module is
  * the file's only writer, so a malformed row is a hand edit or a truncated
  * write and neither is a finding the caller can act on. What a caller can act
  * on is the file being absent, which is its own kind above.
+ *
+ * A row whose folder is gone or under a scratch root is left out too, so the
+ * list is right on a machine whose file predates the prune, before any sync
+ * rewrites it. A target on a drive that is unmounted reads as gone here, and
+ * its next sync records it again.
  */
 export function readTargetRegistry(
   path: string = registryPath(),
+  roots: readonly string[] = scratchRoots(),
 ): TargetRegistry {
   let text: string
   try {
@@ -150,38 +226,46 @@ export function readTargetRegistry(
     .filter((row): row is TargetRecord =>
       isRecord(row as Partial<TargetRecord>),
     )
+    .filter((row) => isLive(row, roots))
     .sort((a, b) => a.path.localeCompare(b.path))
 
   return { kind: 'read', path, targets }
 }
 
-/** Why a record attempt did not land, so a caller can say so rather than assume it did. */
-export type RecordOutcome = 'recorded' | 'unwritten'
+/**
+ * Why a record attempt did not land, so a caller can say so rather than assume
+ * it did. `scratch` is a deliberate refusal of a path under a scratch root,
+ * not a failure.
+ */
+export type RecordOutcome = 'recorded' | 'unwritten' | 'scratch'
 
 /**
  * Records one target, keyed by its resolved path and replacing any row already
- * held for it.
+ * held for it, and refuses a path under a scratch root.
  *
  * The write is a temp file plus a rename, so a reader never meets a half
  * written file. Two syncs finishing together still resolve last-writer-wins on
  * the merged set, which can drop the row the loser added. That is left rather
  * than locked: the authoritative record of an install is the stamp inside the
  * target, this index is a cache over those, and the next sync of the dropped
- * target restores its row.
+ * target restores its row. The prune reads the same merged set the write
+ * already reads, so it adds no second read and does not widen that window.
  *
- * Nothing removes a row either, so a target that was deleted or that dropped
- * the toolkit stays here and the count drifts upward. `canon targets pulls`
- * meets that on use, since it refuses a path it cannot open rather than
- * reading it as a target with no work, but `canon targets list` does not: it
- * never opens a recorded path, and the count is its whole output.
+ * Every write also drops the rows `readTargetRegistry` leaves out, being a
+ * folder that is gone or one under a scratch root, so the file shrinks back to
+ * the live projects rather than growing with every sandbox run. A target on a
+ * drive that is unmounted drops with them, and its next sync restores it.
  */
 export function recordTarget(
   target: string,
   now: Date,
   path: string = registryPath(),
+  roots: readonly string[] = scratchRoots(),
 ): RecordOutcome {
   const resolved = resolve(target)
-  const current = readTargetRegistry(path)
+  if (isScratchPath(resolved, roots)) return 'scratch'
+
+  const current = readTargetRegistry(path, roots)
   const existing = current.kind === 'read' ? current.targets : []
 
   const targets = [
@@ -220,7 +304,8 @@ export type BackfillOutcome = RecordOutcome | 'no-stamp'
 export function backfillTarget(
   target: BackfillTarget,
   path: string = registryPath(),
+  roots: readonly string[] = scratchRoots(),
 ): BackfillOutcome {
   if (target.stampedAt === null) return 'no-stamp'
-  return recordTarget(target.path, new Date(target.stampedAt), path)
+  return recordTarget(target.path, new Date(target.stampedAt), path, roots)
 }

package/src/targets/resolve.ts

@@ -45,6 +45,8 @@ export interface ResolveTargetsOptions extends SweepOptions {
   /** Roots to walk, supplementing the record rather than replacing it. */
   readonly sweep?: readonly string[]
   readonly registryFile?: string
+  /** Folders whose recorded rows are left out, defaulting to `scratchRoots()`. */
+  readonly scratchRoots?: readonly string[]
 }
 
 /**
@@ -71,7 +73,7 @@ export async function resolveTargets(
   }
 
   const file = opts.registryFile ?? registryPath()
-  const registry = readTargetRegistry(file)
+  const registry = readTargetRegistry(file, opts.scratchRoots)
 
   const recorded: KnownTarget[] =
     registry.kind === 'read'

package/tooling/astro/configs/card.config.mjs

@@ -14,7 +14,11 @@ const portOffset = Number(process.env.WORKTREE_PORT_OFFSET) || 0
 // The base port sits outside the band `astro.config.mjs` serves from, so a card
 // server and a dev server of one worktree never contend, and two worktrees
 // separate here the way they separate there.
+//
+// The dev toolbar is off because this server exists to be captured, and the
+// toolbar paints over the viewport the capture cuts the card from.
 export default defineConfig({
+  devToolbar: { enabled: false },
   srcDir: './card-src',
   outDir: './card-dist',
   publicDir: './public',

package/tooling/astro/configs/scripts/check-card-exclusion.sh

@@ -50,8 +50,13 @@ if grep -rl "$MARKER" "$DIST" >/dev/null 2>&1; then
   exit 1
 fi
 
-if find "$DIST" -iname '*og-card*' | grep -q .; then
-  echo "A file named for the card route reached $DIST. See card.config.mjs's srcDir." >&2
+# Built pages only, since an image or font may carry the route's name without
+# being the route. The path test covers both formats Astro emits, being
+# og-card/index.html under build.format 'directory' and og-card.html under
+# 'file'. The search runs from inside dist so a project checked out under a
+# directory like blog-card-site cannot match on its own prefix.
+if (cd "$DIST" && find . -ipath '*og-card*' -name '*.html' | grep -q .); then
+  echo "A page named for the card route reached $DIST. See card.config.mjs's srcDir." >&2
   exit 1
 fi
 

package/tooling/astro/reference.md

@@ -64,7 +64,7 @@ The astro stack covers Astro + TypeScript projects, being content sites, marketi
 ## Social card route
 
 - Keep the social card as a route the project owns, so a re-render after a rename is one string edit and a re-capture rather than another `design-identity` pick loop
-- Expect `canon:design-identity` to write the picked composition into the route and capture it through the card server
+- Expect `canon:design-identity` to write the picked composition into the route and capture it through the card server, which runs with Astro's dev toolbar off so it never paints over the card
 - `card.config.mjs` is a second Astro config whose `srcDir` points at `./card-src`, which the main page router never reads, so the published build excludes the card structurally
 - It serves on base port `4421` plus `WORKTREE_PORT_OFFSET`, outside the band `astro.config.mjs` serves from, so a worktree's card and dev servers never contend
 - `bun run card:dev` serves the route and `bun run card:check` runs the exclusion check, which base's `scripts/verify.ts` also runs after its build stage
@@ -72,6 +72,7 @@ The astro stack covers Astro + TypeScript projects, being content sites, marketi
 ## Card exclusion and size
 
 - `scripts/check-card-exclusion.sh` fails when the route's `<meta name="og-card-marker">` tag reaches `dist/`, and when the route dropped the tag the leak test reads
+- The filename test reads built HTML pages only, under an `og-card` path in either build format, so an image or font may carry the route's name
 - Keep the exclusion a check rather than a convention, since the card server and the capture read the route and the published build must not carry it
 - Declare `.card` at 600x315, half the 1200x630 target, since `canon capture` shoots at a fixed 2x device scale and 1200x630 would capture at 2400x1260
 

package/tooling/claude/seeds/.claude/settings.json

@@ -1,6 +1,10 @@
 {
   "autoMemoryEnabled": false,
   "permissions": {
+    "allow": [
+      "Bash(git push --force-with-lease)",
+      "Bash(git push --force-with-lease origin HEAD)"
+    ],
     "deny": ["Agent", "Task", "Bash(canon pr merge:*)", "Bash(gh pr merge:*)"]
   },
   "hooks": {

package/tooling/web/configs/.github/workflows/readme-screenshot.yml

@@ -74,10 +74,12 @@ jobs:
         # Unconditional: the cache holds browser binaries and nothing apt
         # wrote, so gating this on a cache hit leaves a warm run launching
         # chromium without the libraries it needs.
-        run: bunx playwright install-deps chromium
+        timeout-minutes: 10
+        run: bash scripts/install-playwright-deps.sh chromium
 
       - name: Install Playwright Browser
         if: steps.playwright-cache.outputs.cache-hit != 'true'
+        timeout-minutes: 5
         run: bunx playwright install chromium
 
       - name: Capture README Screenshot

package/tooling/web/configs/.github/workflows/verify.yml

@@ -72,7 +72,7 @@ jobs:
       - name: Install Playwright System Dependencies
         if: steps.browser.outputs.enabled == 'true'
         timeout-minutes: 10
-        run: bunx playwright install-deps chromium
+        run: bash scripts/install-playwright-deps.sh chromium
 
       - name: Cache Playwright Browsers
         id: playwright-cache
@@ -84,6 +84,7 @@ jobs:
 
       - name: Install Playwright Chromium
         if: steps.browser.outputs.enabled == 'true' && steps.playwright-cache.outputs.cache-hit != 'true'
+        timeout-minutes: 5
         run: bunx playwright install chromium
 
       - name: Run Tests
@@ -151,7 +152,8 @@ jobs:
           path: dist/
 
       - name: Install Playwright System Dependencies
-        run: bunx playwright install-deps chromium
+        timeout-minutes: 10
+        run: bash scripts/install-playwright-deps.sh chromium
 
       - name: Cache Playwright Browsers
         id: playwright-cache
@@ -162,6 +164,7 @@ jobs:
 
       - name: Install Playwright Chromium
         if: steps.playwright-cache.outputs.cache-hit != 'true'
+        timeout-minutes: 5
         run: bunx playwright install chromium
 
       - name: Run E2E Tests