New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

Record PR Demo

by payloadcms in payloadcms/payload

A skill your agent uses when a Payload pull request needs a concise visual walkthrough for reviewers.

MITAuto-check passedDevelopment

Install Record PR Demo

skills CLI
$ npx skills add payloadcms/payload --skill record-pr-demo -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install payloadcms/payload record-pr-demo --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/payloadcms/payload.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/record-pr-demo .claude/skills/record-pr-demo && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
record-pr-demo
GitHub stars
45k
Token cost
~1k tokens
SKILL.md length
569 words
Files
11 (incl. scripts, references)
Skills in repo
9
Repo updated
First seen
Licence
MIT

At a glance

A skill your agent uses when a Payload pull request needs a concise visual walkthrough for reviewers.

  • Works in 9 steps: Inspect the feature, relevant diff, and… → Write a brief plan in /tmp with the… → Start the relevant dev server and make… → …
  • A Payload pull request needs a concise visual walkthrough for reviewers
  • SKILL.md covers Non-negotiable review gate, Workflow and Completion criteria
  • Runs JavaScript and Shell scripts from its folder; calls node

What it does

Record PR Demo is an agent skill from payloadcms/payload. Use when a Payload pull request needs a concise visual walkthrough for reviewers.

Its SKILL.md is about 1k tokens, which your agent loads only when the skill is triggered. The skill folder holds 12 other files, including scripts and reference files (for example `references/publishing.md`, `references/recording.md` and `scripts/convert-demo.sh`).

It sits in Development, covering Pull requests. It works with Payload CMS. The repository describes itself as: Payload is the open-source, fullstack Next.js framework, giving you instant backend superpowers. Get a full TypeScript backend and admin panel instantly. Use Payload as a… The licence is MIT.

When your agent uses it

  • A Payload pull request needs a concise visual walkthrough for reviewers
  • Tasks that involve Pull requests

Example prompts

  • “/record-pr-demo”

Requirements

  • Node.js
  • A Bash shell

Workflow steps

9 steps, taken from the first numbered list in SKILL.md.

  1. Inspect the feature, relevant diff, and available test configs. Choose the smallest existing Payload config that demonstrates the real…
  2. Write a brief plan in /tmp with the opening state, 2–6 visible actions, and the final proof a reviewer should see. Default to one…
  3. Start the relevant dev server and make its initial state deterministic. Do not expose credentials, personal data, tokens, or unrelated…
  4. Read recording.md and create a temporary scenario module in /tmp. Put deterministic recording-only data in optional scenario setup and…
  5. Use a take-specific label and run the candidate command from the repository root, for example node…
  6. Watch the entire MP4, use the contact sheet for a quick state check, and show the exact local video inline using its absolute path
  7. Stop and ask the user to approve, reject, or request another take. Do not call gh, open an upload UI, or otherwise upload the file yet.
  8. Only after explicit approval of that recording, read publishing.md and verify the reviewed manifest. Preserve the complete existing PR…
  9. Verify the PR renders the uploaded video, then remove temporary scenarios, plans, raw recordings, and temporary fixture changes. Preserve…

What it can do on your machine

Read from SKILL.md and the folder at commit c66a7be. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Ships 8 files in scripts/ (JavaScript and Shell), which the agent can run.

    Shell commands in SKILL.md call:

    • node

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Record PR Demo loads about 1k tokens when it runs, and up to ~4.3k if it reads all its reference files. Until then it costs about 24 tokens; SKILL.md has 569 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~24
When it runs · the whole SKILL.md, loaded when a task matches
~1k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~4.3k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); the scripts in this folder are not scanned.

SKILL.md

The full file from payloadcms/payload at commit c66a7be, republished under its MIT licence (© payloadcms). 569 words, ~1,035 tokens.

Download SKILL.mdSave it as .claude/skills/record-pr-demo/SKILL.md (or your agent's skills folder). This skill also uses 10 other files; get the full folder from GitHub.
name
record-pr-demo
description
Use when a Payload pull request needs a concise visual walkthrough for reviewers.

Record a PR Demo

Create a short, reviewer-focused screen recording of the current Payload feature. Produce and review the video locally before uploading anything to GitHub.

This skill is for feature demonstrations, not committed screenshot regression baselines.

Non-negotiable review gate

Uploading consumes GitHub storage and changes an external PR. Always stop after rendering the local MP4, show that exact file to the user, and request approval. A general request to “record and post a demo” does not waive this checkpoint.

Before showing the video, record its absolute path and SHA-256 digest. Immediately before an approved upload, recompute the digest. If it changed, show the new video and request approval again.

Do not upload previews, rejected takes, raw WebM recordings, or files the user has not reviewed. Never commit demo media to the repository.

Workflow

  1. Inspect the feature, relevant diff, and available test configs. Choose the smallest existing Payload config that demonstrates the real feature. Create a temporary config only when no existing config can show it clearly.

  2. Write a brief plan in /tmp with the opening state, 2–6 visible actions, and the final proof a reviewer should see. Default to one current-state feature demo; create Before/After recordings only when requested.

  3. Start the relevant dev server and make its initial state deterministic. Do not expose credentials, personal data, tokens, or unrelated records.

  4. Read recording.md and create a temporary scenario module in /tmp. Put deterministic recording-only data in optional scenario setup and teardown exports instead of recreating it manually between takes.

  5. Use a take-specific label and run the candidate command from the repository root, for example node .agents/skills/record-pr-demo/scripts/prepare-demo.mjs candidate --scenario /tmp/payload-pr-demo-feature.mjs --label feature-take-1. It performs preflight checks, fast validation, human-paced recording, conversion, full decode verification, contact-sheet generation, hashing, manifest creation, and raw-video cleanup. Keep the demo concise enough to stay below the converter's default 10 MB budget.

  6. Watch the entire MP4, use the contact sheet for a quick state check, and show the exact local video inline using its absolute path:

    md
    ![Feature demo](/absolute/path/to/payload-pr-demo-feature.mp4)

  7. Stop and ask the user to approve, reject, or request another take. Do not call gh, open an upload UI, or otherwise upload the file yet.

  8. Only after explicit approval of that recording, read publishing.md and verify the reviewed manifest. Preserve the complete existing PR description and append a final ## Preview section with the approved video in its own paragraph. Use a PR comment only when the user explicitly asks for one.

  9. Verify the PR renders the uploaded video, then remove temporary scenarios, plans, raw recordings, and temporary fixture changes. Preserve the approved MP4 until the upload is confirmed.

Show full SKILL.md (132 more words)Show less

Completion criteria

  • The recording tells one understandable visual story and ends on visible proof.
  • Pointer movement is smooth, clicks have readable dwell time, and the cursor does not jump between interactions.
  • The approved artifact is an H.264 .mp4, within GitHub's applicable upload limit.
  • The candidate command produced a contact sheet and manifest, and the manifest still matches before upload.
  • The user reviewed the exact bytes that were uploaded.
  • The existing PR description is preserved and ends with ## Preview and the approved inline player, unless the user explicitly requested a comment.
  • GitHub contains no rejected or superseded takes.
  • No media or recording-only fixture remains in the working tree.

Explicit user instructions about the feature, scenario, length, destination, or presentation override this skill's preferences, except that upload still requires review of the final file.

© payloadcms, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 10 other files (scripts, references) in .agents/skills/record-pr-demo of payloadcms/payload.

  • SKILL.md
  • references/publishing.md
  • references/recording.md
  • scripts/convert-demo.sh
  • scripts/convert-demo.test.mjs
  • scripts/prepare-demo.mjs
  • scripts/prepare-demo.test.mjs
  • scripts/record-demo.mjs
  • scripts/record-demo.test.mjs
  • scripts/scroll-demo.mjs
  • scripts/scroll-demo.test.mjs

Open the folder on GitHubat commit c66a7be

Compare with similar skills

Record PR Demo next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Record PR Demo compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Record PR Demo this skillpayloadcms/payload45k—~1kAutomated safety check: PassMIT
Finishing a Development Branchobra/superpowers296k5 repos~1.9kAutomated safety check: PassMIT
PR Babysitteropeninterpreter/openinterpreter69k3 repos~4.2kAutomated safety check: PassApache-2.0
Check PRonyx-dot-app/onyx32k2 repos~2.3kAutomated safety check: PassMIT
Understand Diff AnalysisEgonex-AI/Understand-Anything86k1 repos~1.4kAutomated safety check: PassMIT
PR Design DocOpenHands/OpenHands90k—~2.4kAutomated safety check: PassMIT

Similar skills

  • Finishing a Development Branch

    obra/superpowers

    Walks the last step of a branch: confirm tests pass, detect the git environment, ask how to integrate, carry out your choice and clean up the worktree.

    296k GitHub starsUsed in 5 repos~1.9k tokens
    DevelopmentAuto-check passed

  • PR Babysitter

    openinterpreter/openinterpreter

    Watches an open GitHub pull request until it merges, handling review comments, diagnosing CI failures and retrying flaky checks along the way.

    69k GitHub starsUsed in 3 repos~4.2k tokens
    DevelopmentAuto-check passed

  • Check PR

    onyx-dot-app/onyx

    Checks a GitHub, GitLab, or Perforce (p4) pull request (or merge request, or shelved changelist) for unresolved review comments, failing status checks, and incomplete PR descriptions.

    32k GitHub starsUsed in 2 repos~2.3k tokens
    DevelopmentAuto-check passed

  • Understand Diff Analysis

    Egonex-AI/Understand-Anything

    Reads your git changes or a pull request against a prebuilt knowledge graph of the project to explain what changed, which components are affected and what is risky.

    86k GitHub starsUsed in 1 repo~1.4k tokens
    DevelopmentAuto-check passed

  • PR Design Doc

    OpenHands/OpenHands

    For a non-trivial pull request, write a self-contained HTML design doc under the temporary .pr/ directory and link a visibility-appropriate preview in the PR description, so maintainers grasp the…

    90k GitHub stars~2.4k tokensUpdated today
    DevelopmentAuto-check passed

  • WooCommerce Code Review

    woocommerce/woocommerce

    Reviews WooCommerce code changes against the project's standards, flagging backend PHP architecture, naming, documentation, data integrity and testing violations.

    11k GitHub starsUsed in 3 repos~1.1k tokens
    DevelopmentAuto-check passed

More from payloadcms/payload

All 9 skills in this repo

  • Payload

    payloadcms/payload

    A skill your agent uses when working with Payload projects (payload.config.ts, collections, fields, hooks, access control, Payload API).

    45k GitHub starsUsed in 5 repos~6.2k tokens
    Auto-check passed

  • Audit Dependencies

    payloadcms/payload

    A skill your agent uses when fixing dependency vulnerabilities, running pnpm audit, or when the audit-dependencies CI check fails

    45k GitHub stars~2.8k tokensUpdated today
    Auto-check passed

  • Generate Translations

    payloadcms/payload

    A skill your agent uses when new translation keys are added to packages to generate new translations strings

    45k GitHub stars~1.1k tokensUpdated today
    Auto-check passed

  • Triage CI Flake

    payloadcms/payload

    A skill your agent uses when CI tests fail on main branch after PR merge, when investigating flaky test failures, or when user provides a PR URL/number to aggregate all failing tests

    45k GitHub stars~4.4k tokensUpdated today
    Auto-check passed

  • Ui4 Convert Tests

    payloadcms/payload

    A skill your agent uses when UI changes are complete and e2e tests need updating.

    45k GitHub stars~3.5k tokensUpdated today
    Auto-check passed

  • Payload Accessibility

    payloadcms/payload

    A skill your agent uses when changing or reviewing rendered Payload UI, interaction or focus behavior, semantic markup, accessibility tests, or WCAG/VPAT evidence.

    45k GitHub stars~808 tokensUpdated today
    Auto-check passed

Works with

Categories

Questions about Record PR Demo

What does Record PR Demo do?

A skill your agent uses when a Payload pull request needs a concise visual walkthrough for reviewers. Record PR Demo is an agent skill from payloadcms/payload. Use when a Payload pull request needs a concise visual walkthrough for reviewers.

When should I use Record PR Demo?

Record PR Demo fits situations like: A Payload pull request needs a concise visual walkthrough for reviewers; tasks that involve Pull requests.

How do I install Record PR Demo in Claude Code?

Run `npx skills add payloadcms/payload --skill record-pr-demo -a claude-code`. Or copy the skill folder (.agents/skills/record-pr-demo in payloadcms/payload) into .claude/skills/record-pr-demo in your project. Claude Code loads it when a task matches its description.

How do I install Record PR Demo in Codex?

Run `npx skills add payloadcms/payload --skill record-pr-demo -a codex`. Or copy the skill folder (.agents/skills/record-pr-demo in payloadcms/payload) into .agents/skills/record-pr-demo in your project. Codex loads it when a task matches its description.

Can I use Record PR Demo in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add payloadcms/payload --skill record-pr-demo -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/record-pr-demo, .gemini/skills/record-pr-demo, .github/skills/record-pr-demo and .opencode/skills/record-pr-demo in your project.

What does Record PR Demo need to run?

Going by SKILL.md and its folder, Record PR Demo needs JavaScript and a shell for the scripts in its folder and the command-line tools its instructions call (node). Our summary lists: Node.js; A Bash shell.

Does Record PR Demo access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Record PR Demo safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. The check reads SKILL.md only: the scripts in the folder are not scanned, so read them before running anything.

What licence does Record PR Demo use?

Record PR Demo is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Record PR Demo use?

About 1k tokens (SKILL.md is roughly 4.1k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 3.2k tokens, read only when the agent opens those files.

What are the alternatives to Record PR Demo?

Skills that share tags, products or a category with Record PR Demo: Finishing a Development Branch (obra/superpowers, 296k stars), PR Babysitter (openinterpreter/openinterpreter, 69k stars), Check PR (onyx-dot-app/onyx, 32k stars) and Understand Diff Analysis (Egonex-AI/Understand-Anything, 86k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Record PR Demo?

payloadcms (a GitHub organization) maintains it in payloadcms/payload, which has 45,140 GitHub stars. The repository holds 9 skills in this directory. The repository was last updated on October 8, 2026.

Source: payloadcms/payload on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.