Skip to content

Add generate-video plugin#26

Open
masnwilliams wants to merge 3 commits into
mainfrom
hypeship/oss-generate-video
Open

Add generate-video plugin#26
masnwilliams wants to merge 3 commits into
mainfrom
hypeship/oss-generate-video

Conversation

@masnwilliams

@masnwilliams masnwilliams commented Jun 11, 2026

Copy link
Copy Markdown
Contributor

Summary

Open-sources the generate-video skill as a new plugin in this marketplace.

The skill renders smooth, judder-free MP4s from web pages and animated visualizations: instead of screen-capturing whatever the browser paints, it drives headless Chromium over raw CDP with an injected virtual clock, steps time frame-by-frame, captures each exact instant as a lossless PNG, and encodes with ffmpeg. Includes the React clock/ramp hooks, the self-contained Node recorder (no puppeteer/playwright), encode recipes (MP4 + two-pass-palette GIF), and the gotchas list.

Changes:

  • plugins/generate-video/ — new plugin (plugin.json + SKILL.md)
  • .claude-plugin/marketplace.json — register the plugin
  • .cursor-plugin/plugin.json — include the new skills path
  • README.md — install instructions + Available Skills entry

Compared to the internal version, references to internal-only skills and environment specifics were generalized; the technical content is unchanged.

This skill doesn't require a Kernel account — just Chromium, Node ≥ 18, and ffmpeg. The README entry calls that out.

Test plan

  • All three JSON files validate
  • /plugin marketplace add kernel/skills + /plugin install generate-video resolves the new plugin
  • Cursor plugin picks up the new skills path

🤖 Generated with Claude Code


Note

Low Risk
Documentation and plugin metadata only; no changes to auth, APIs, or runtime Kernel services.

Overview
Adds a new generate-video plugin to the Kernel skills marketplace so agents can render smooth MP4s from web scenes via CDP virtual-clock frame stepping and ffmpeg.

New plugin: plugins/generate-video/ with plugin.json and a large SKILL.md that documents scene composition, React useClock/useRamp hooks, a dependency-free Node CDP recorder, ffmpeg/GIF encoding, iteration/delivery (including cloudflared), and common gotchas. Internal-only references were generalized for open source.

Wiring: Registers the plugin in .claude-plugin/marketplace.json, adds ./plugins/generate-video/skills/ to Cursor’s skills list, and updates README with install paths (/plugin install generate-video, manual copy) plus an Available Skills section noting no Kernel account is required (Chromium, Node, ffmpeg only).

Reviewed by Cursor Bugbot for commit 6fca4af. Bugbot is set up for automated code reviews on this repo. Configure here.

Public release of the generate-video skill: render smooth, deterministic
MP4s from web scenes by driving headless Chromium over CDP with an
injected virtual clock, capturing exact per-frame PNGs, and encoding
with ffmpeg.
Tabular numerals for count-up readouts, one-reveal-at-a-time pacing,
explicit end-frame hold, and MP4 verification steps (frame count vs
expected, spot-check first/mid/last frames).
@masnwilliams masnwilliams marked this pull request as ready for review June 11, 2026 00:49
@firetiger-agent

Copy link
Copy Markdown

Firetiger deploy monitoring skipped

This PR didn't match the auto-monitor filter configured on your GitHub connection:

PRs in the kernel, infra, hypeman, and hypeship repos. kernel is a ~mono repo with many logical services underneath, ensure to focus on the implicated service for the PR

Reason: PR appears to be for a plugin marketplace or skills system, not for the kernel, infra, hypeman, or hypeship repositories themselves.

To monitor this PR anyway, reply with @firetiger monitor this.

Setting window.__vt alone doesn't refresh the scene — useClock only
updates on the vt event, so the preview would capture the prior frame.
Comment thread plugins/generate-video/skills/generate-video/SKILL.md Outdated

@cursor cursor Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cursor Bugbot has reviewed your changes and found 1 potential issue.

Fix All in Cursor

❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.

Reviewed by Cursor Bugbot for commit 6fca4af. Configure here.

// connect to a PAGE target (not the browser endpoint — it lacks Page/Runtime)
const list = await (await fetch(`http://127.0.0.1:${PORT}/json/list`)).json();
const page = list.find((t) => t.type === "page") || list[0];
const ws = new WebSocket(page.webSocketDebuggerUrl.replace("localhost", "127.0.0.1"));

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Wrong CDP target fallback

Medium Severity

The sample recorder picks a CDP target with list.find((t) => t.type === "page") || list[0], so when no page entry exists it attaches to whatever is first in /json/list, often the browser endpoint. That endpoint cannot run Page.* / Runtime.*, which matches the gotcha that says not to use the browser socket—so the script can fail in a confusing way instead of failing clearly.

Fix in Cursor Fix in Web

Reviewed by Cursor Bugbot for commit 6fca4af. Configure here.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant