Agent skill · software engineering · remotion-dev
canvas-capture-extension
Rebuild, install, and reload the private Remotion Canvas Capture unpacked Chrome extension. Use when the extension needs to be restored after a Codex worktree was deleted, rebuilt after source changes, moved to its durable install directory, or reloaded in Chrome or Chrome Canary.
Why this skill is useful
Adds a specific script for rebuilding and installing the Remotion Canvas Capture extension that the AI wouldn't reliably generate on its own.
What it needs
Requires bun installed locally. About 2k tokens when loaded. Last updated 2026-08-06. 55,698 stars on the source repository.
What this skill does
Canvas Capture Extension Build the extension from packages/canvas-capture-extension, but always install the unpacked copy outside the checkout so deleting a worktree cannot break it. Rebuild and install 1. Locate a Remotion checkout containing packages/canvas-capture-extension/package.json. Prefer the current checkout; otherwise use /Users/jonathanburger/remotion. 2. Run: The script builds with Bun and installs the complete WXT bundle in /Users/jonathanburger/Applications/Remotion Canvas Capture Extension. Building does not require an installed browser. To use the extension, choose Chrome 157.0.8080.0 or newer with Canvas Draw Element enabled. 3. Confirm that the installed directory contains manifest.json, background.js, capture.js, drag-image.js, shot-tools.js, logo.svg, and the generated extension icons. Develop with React and Vite 1. Close any running Recorder Chrome instance that uses the dedicated Canvas Capture profile. 2. From packages/canvas-capture-extension, run bun run dev. 3. WXT writes the development bundle to the durable directory /Users/jonathanburger/Applications/Remotion Canvas Capture Extension Dev, launches Chrome for Testing with the Canvas Draw Element feature enabled, and loads the extension automatically. 4. Click the extension icon to show the in-page controls. Source and manifest changes cause WXT to rebuild and reload the affected extension contexts. Use the separate development directory only for bun run dev. Continue using the production install directory above for manually loaded builds. The Remotion pages receive recordings through externallyconnectable messaging; the extension does not inject a receiver content script. To test a local destination, set CANVASCAPTUREHANDOFFORIGIN (for example http://localhost:3000) when running bun run dev. Production builds always use https://www.remotion.dev. To select another Chrome 157.0.8080.0 or newer browser, set CANVASCAPTUREBROWSEREXECUTABLE to its executable path when running bun run dev. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills remotion-dev/canvas-capture-extension