Record a video walkthrough of a feature and add it to the PR description
Records a feature walkthrough video and embeds it in the PR description
/plugin marketplace add settlemint/agent-marketplace/plugin install crew@settlemint[PR number or 'current'] [optional: base URL, default localhost:3000]work/Record browser walkthrough demonstrating a feature using Claude-in-Chrome, create GIF, upload to GitHub release, and embed in PR description.
</objective> <workflow># Verify ffmpeg and gh CLI are available
command -v ffmpeg || echo "ERROR: ffmpeg required - brew install ffmpeg"
command -v gh || echo "ERROR: gh required - brew install gh"
gh auth status || echo "ERROR: gh not authenticated - gh auth login"
const args = "$ARGUMENTS".split(" ");
const prNumber = args[0] || "current";
const baseUrl = args[1] || "http://localhost:3000";
// Get PR number if "current"
if (prNumber === "current") {
const pr = Bash({ command: "gh pr view --json number -q '.number'" });
}
gh pr view $PR_NUMBER --json title,body,files,headRefName -q '.'
MCPSearch({ query: "select:mcp__claude-in-chrome__navigate" });
MCPSearch({ query: "select:mcp__claude-in-chrome__gif_creator" });
MCPSearch({ query: "select:mcp__claude-in-chrome__tabs_context_mcp" });
MCPSearch({ query: "select:mcp__claude-in-chrome__form_input" });
MCPSearch({ query: "select:mcp__claude-in-chrome__computer" });
mcp__claude-in-chrome__tabs_context_mcp({});
AskUserQuestion({
questions: [
{
question: `Video flow for PR #${prNumber}:\n1. Start: ${baseUrl}\n2. Navigate to feature\n3. Demonstrate interactions\n4. Show result\n\nProceed?`,
header: "Flow",
options: [
{ label: "Yes", description: "Start recording" },
{ label: "Modify", description: "Describe changes" },
],
multiSelect: false,
},
],
});
// Setup recording directory
Bash({ command: "mkdir -p tmp/videos && rm -f tmp/videos/*.gif" });
// Start GIF recording
mcp__claude-in-chrome__gif_creator({
action: "start",
filename: "tmp/videos/feature-demo.gif",
});
// Navigate and perform interactions
mcp__claude-in-chrome__navigate({ url: `${baseUrl}/feature-route` });
// ... perform user flow interactions ...
// Stop recording
mcp__claude-in-chrome__gif_creator({ action: "stop" });
REPO=$(gh repo view --json nameWithOwner -q '.nameWithOwner')
RELEASE_TAG="pr-assets"
# Create release if not exists
gh release view "$RELEASE_TAG" || gh release create "$RELEASE_TAG" \
--title "PR Demo Assets" --notes "Automated demo videos"
# Upload GIF
gh release upload "$RELEASE_TAG" tmp/videos/feature-demo.gif --clobber
VIDEO_URL="https://github.com/${REPO}/releases/download/${RELEASE_TAG}/feature-demo.gif"
# Get current body and append demo section
CURRENT_BODY=$(gh pr view $PR_NUMBER --json body -q '.body')
gh pr edit $PR_NUMBER --body "${CURRENT_BODY}
## Demo

_Feature walkthrough recorded with Claude Code_"
console.log(`Feature video complete:
- PR: #${prNumber}
- Video: ${videoUrl}
- PR updated with demo section`);
</workflow>
<success_criteria>
</success_criteria>