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

Terminal Screenshot Capture

by QwenLM in QwenLM/qwen-code

Drives a CLI through a TypeScript scenario and saves terminal screenshots at each step, so pull requests that change command output can be checked visually.

Apache-2.0Auto-check passedTesting & QA

Install Terminal Screenshot Capture

skills CLI
$ npx skills add QwenLM/qwen-code --skill terminal-capture -a claude-code

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

GitHub CLI
$ gh skill install QwenLM/qwen-code terminal-capture --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/QwenLM/qwen-code.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.qwen/skills/terminal-capture .claude/skills/terminal-capture && 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
terminal-capture
GitHub stars
28k
Token cost
~2k tokens
SKILL.md length
470 words
Files
1
Skills in repo
41
Repo updated
First seen
Licence
Apache-2.0

At a glance

Drives a CLI through a TypeScript scenario and saves terminal screenshots at each step, so pull requests that change command output can be checked visually.

  • Works in 3 steps: Write Scenario Configuration → Run → Output
  • Checking a pull request that changes CLI output or slash command rendering
  • SKILL.md covers Prerequisites, Architecture, Quick Start and FlowStep API, plus 4 more sections
  • Calls npx, npm and brew

What it does

Scenarios are TypeScript files placed under `integration-tests/terminal-capture/scenarios/`. Under the hood the CLI runs in a pseudo-terminal through node-pty, its ANSI output is rendered by xterm.js inside headless Playwright, and screenshots are taken from that page. The core files are `terminal-capture.ts` for the low-level engine, `scenario-runner.ts` for executing a scenario and `run.ts`, the entry point launched with `npx tsx`.

Each flow step can type text, which captures the input state, presses Enter, waits for the output to settle and captures the result. Images land in a per-scenario `screenshots` folder as numbered files such as `01-01.png` and `01-02.png`, plus a `full-flow.png` of the final state. Setup needs `npm install` and `npx playwright install chromium`; when `QWEN_VERIFY_CHROMIUM=1` is set in CI the browser is already present and the install is skipped.

When your agent uses it

  • Checking a pull request that changes CLI output or slash command rendering
  • Capturing screenshots of commands such as /about or /context for documentation
  • Adding a visual check for a multi-step terminal UI flow

Example prompts

  • “Write a terminal-capture scenario for the /about command and run it.”
  • “Take before and after screenshots of the /context output for this PR.”
  • “Generate screenshots of the /auth flow for the docs.”

Requirements

  • Project dependencies installed with `npm install`
  • Playwright Chromium from `npx playwright install chromium`

Workflow steps

3 steps, taken from the step headings in SKILL.md.

  1. Write Scenario Configuration
  2. Run
  3. Output

What it can do on your machine

Read from SKILL.md and the folder at commit d9c6f8c. 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

    Shell commands in SKILL.md call:

    • npx
    • npm
    • brew
    • playwright

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

  • Network

    No URLs in SKILL.md. Its commands use npx and npm, which can reach the network depending on how they are called.

    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

Terminal Screenshot Capture loads about 2k tokens when it runs. Until then it costs about 78 tokens; SKILL.md has 470 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~78
When it runs · the whole SKILL.md, loaded when a task matches
~2k

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); files beside SKILL.md are not scanned.

SKILL.md

The full file from QwenLM/qwen-code at commit d9c6f8c, republished under its Apache-2.0 licence (© QwenLM). 470 words, ~2,019 tokens.

Download SKILL.mdSave it as .claude/skills/terminal-capture/SKILL.md (or your agent's skills folder).
name
terminal-capture
description
Automates terminal UI screenshot testing for CLI commands. Applies when reviewing PRs that affect CLI output, testing slash commands (/about, /context, /auth, /export), generating visual documentation, or when 'terminal screenshot', 'CLI test', 'visual test', or 'terminal-capture' is mentioned.

Terminal Capture — CLI Terminal Screenshot Automation

Drive terminal interactions and screenshots via TypeScript configuration, used for visual verification during PR reviews.

Prerequisites

Ensure the following dependencies are installed before running:

bash
npm install       # Install project dependencies.
npx playwright install chromium   # Install Playwright browser (skip in CI: see note below)

CI / verify context: when QWEN_VERIFY_CHROMIUM=1 is set, the browser is already installed and PLAYWRIGHT_BROWSERS_PATH points at it. Do not run playwright install — it downloads ~170 MB and fails on system deps the agent user cannot install.

Architecture

node-pty (pseudo-terminal)
  → ANSI byte stream
  → xterm.js (Playwright headless)
  → Screenshot

Core files:

  • integration-tests/terminal-capture/terminal-capture.ts Low-level PTY, xterm.js, and Playwright engine.
  • integration-tests/terminal-capture/scenario-runner.ts Scenario executor for config, interactions, and screenshots.
  • integration-tests/terminal-capture/run.ts CLI entry point for batch scenario runs.
  • integration-tests/terminal-capture/scenarios/*.ts Scenario configuration files.

Quick Start

1. Write Scenario Configuration

Create a .ts file under integration-tests/terminal-capture/scenarios/:

typescript
import type { ScenarioConfig } from '../scenario-runner.js';

export default {
  name: '/about',
  spawn: ['node', 'dist/cli.js', '--yolo'],
  // cwd is relative to this config file's location.
  terminal: { title: 'qwen-code', cwd: '../../..' },
  flow: [
    { type: 'Hi, can you help me understand this codebase?' },
    { type: '/about' },
  ],
} satisfies ScenarioConfig;
2. Run
bash
# Single scenario
npx tsx integration-tests/terminal-capture/run.ts \
  integration-tests/terminal-capture/scenarios/about.ts

# Batch (entire directory)
npx tsx integration-tests/terminal-capture/run.ts \
  integration-tests/terminal-capture/scenarios/
3. Output

Screenshots are saved to integration-tests/terminal-capture/scenarios/screenshots/{name}/:

FileDescription
01-01.pngStep 1 input state
01-02.pngStep 1 execution result
02-01.pngStep 2 input state
02-02.pngStep 2 execution result
full-flow.pngFinal state full-length screenshot

FlowStep API

Each flow step can contain the following fields:

type: string — Input Text

Automatic behavior: Input text → Screenshot (01) → Enter → stable output → Screenshot (02).

typescript
{
  type: 'Hello';
} // Plain text
{
  type: '/about';
} // Slash command (auto-completion handled automatically)

Special rule: If the next step is key, do not auto-press Enter (hand over control to the key sequence).

key: string | string[] — Send Key Press

Used for menu selection, Tab completion, and other interactions. Does not auto-press Enter or auto-screenshot.

Supported key names: ArrowUp, ArrowDown, ArrowLeft, ArrowRight, Enter, Tab, Escape, Backspace, Space, Home, End, PageUp, PageDown, Delete

typescript
{
  key: 'ArrowDown';
} // Single key
{
  key: ['ArrowDown', 'ArrowDown', 'Enter'];
} // Multiple keys

Auto-screenshot is triggered after the key sequence ends (when the next step is not a key).

Show full SKILL.md (228 more words)Show less
streaming — Capture During Execution

Capture multiple screenshots at intervals during long-running output (e.g., progress bars). Optionally generates an animated GIF.

typescript
{
  type: 'Run this command: bash progress.sh',
  streaming: {
    delayMs: 7000,    // Wait before first capture (skip initial waiting phase)
    intervalMs: 500,  // Interval between captures
    count: 20,        // Maximum number of captures
    gif: true,        // Generate animated GIF (default: true, requires ffmpeg)
  },
}
  • delayMs (optional): Milliseconds to wait after pressing Enter before starting captures. Useful for skipping model thinking/approval time.
  • Captures stop early if terminal output is unchanged for 3 consecutive intervals.
  • Duplicate frames (no output change) are automatically skipped.

GIF prerequisite: If the scenario uses streaming with GIF enabled (default), check if ffmpeg is installed before running. If not, ask the user whether they'd like to install it:

bash
# Check
which ffmpeg

# Install (macOS)
brew install ffmpeg

If the user declines, the scenario still runs. GIF generation is skipped with a warning.

capture / captureFull — Explicit Screenshot

Use as a standalone step, or override automatic naming:

typescript
{
  capture: 'initial.png';
} // Screenshot current viewport only
{
  captureFull: 'all-output.png';
} // Screenshot full scrollback buffer

Scenario Examples

Basic: Input + Command
typescript
flow: [{ type: 'explain this project' }, { type: '/about' }];
Secondary Menu Selection (/auth)
typescript
flow: [
  { type: '/auth' },
  { key: 'ArrowDown' }, // Select API Key option
  { key: 'Enter' }, // Confirm
  { type: 'sk-xxx' }, // Input API key
];
Tab Completion Selection (/export)
typescript
flow: [
  { type: 'Tell me about yourself' },
  { type: '/export' }, // No auto-Enter (next step is key)
  { key: 'Tab' }, // Pop format selection
  { key: 'ArrowDown' }, // Select format
  { key: 'Enter' }, // Confirm → auto-screenshot
];
Array Batch (Multiple Scenarios in One File)
typescript
export default [
  { name: '/about', spawn: [...], flow: [...] },
  { name: '/context', spawn: [...], flow: [...] },
] satisfies ScenarioConfig[];

Integration with PR Review

This tool is commonly used for visual verification during PR reviews.

Troubleshooting

  • Playwright error browser not found Cause: browser not installed. Solution: npx playwright install chromium (local dev only — in CI verify runs, this means the pre-install step failed; report it, do not install).
  • Blank screenshot Cause: process starts slowly or build failed. Solution: check build success and the spawn command.
  • PTY-related errors Cause: node-pty native module not compiled. Solution: npm rebuild node-pty.
  • Unstable screenshot output Cause: terminal output not fully rendered. Solution: add scenario wait time.

Full ScenarioConfig Type

typescript
interface FlowStep {
  type?: string; // Input text
  key?: string | string[]; // Key press(es)
  capture?: string; // Viewport screenshot filename
  captureFull?: string; // Full scrollback screenshot filename
  streaming?: {
    delayMs?: number; // Delay before first capture (default: 0)
    intervalMs: number; // Interval between captures in ms
    count: number; // Maximum number of captures
    gif?: boolean; // Generate animated GIF (default: true)
  };
}

interface ScenarioConfig {
  name: string; // Scenario name (also used as screenshot subdirectory name)
  spawn: string[]; // Launch command ["node", "dist/cli.js", "--yolo"]
  flow: FlowStep[]; // Interaction steps
  terminal?: {
    cols?: number; // Number of columns, default 100
    rows?: number; // Number of rows, default 28
    theme?: string; // Theme: dracula|one-dark|github-dark|monokai|night-owl
    chrome?: boolean; // macOS window decorations, default true
    title?: string; // Window title, default "Terminal"
    fontSize?: number; // Font size
    cwd?: string; // Working directory (relative to config file)
  };
  outputDir?: string; // Screenshot output directory (relative to config file)
}

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

Files

Just SKILL.md in .qwen/skills/terminal-capture of QwenLM/qwen-code.

Open the folder on GitHubat commit d9c6f8c

Compare with similar skills

Terminal Screenshot Capture 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.

Terminal Screenshot Capture compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Terminal Screenshot Capture this skillQwenLM/qwen-code28k—~2kAutomated safety check: PassApache-2.0
Project Pull Requestswimmwatch/cloakbrowser-mcp164—~1kAutomated safety check: PassMIT
UI Visual DebuggingNangoHQ/nango13k—~1.3kAutomated safety check: PassCustom licence
Pre Commitwellwelwel/poku1.2k—~728Automated safety check: PassMIT
Trust Remote BuilderjohannesPettersson80/trust-platform222—~2kAutomated safety check: PassApache-2.0
Write SpecLiberatedPixelCup/Universal-LPC-Spritesheet-Character-Generator1.8k—~719Automated safety check: PassGPL-3.0

Similar skills

  • Project Pull Request

    swimmwatch/cloakbrowser-mcp

    Create, update, prepare, or review a cloakbrowser-mcp GitHub Pull Request only when the user explicitly requests PR work.

    164 GitHub stars~1k tokensUpdated 2 days ago
    DevelopmentAuto-check passed

  • UI Visual Debugging

    NangoHQ/nango

    A skill your agent uses when modifying or visually debugging Nango frontend UI, including packages/webapp, packages/connect-ui, browser interactions, screenshots, and visual regressions.

    13k GitHub stars~1.3k tokensUpdated yesterday
    Testing & QAAuto-check passed

  • Pre Commit

    wellwelwel/poku

    Run the mandatory pre-commit checks for the poku repository before staging a commit.

    1.2k GitHub stars~728 tokensUpdated 3 mo ago
    Testing & QAAuto-check passed

  • Trust Remote Builder

    johannesPettersson80/trust-platform

    Runs truST builds and tests on the shared trust-builder machine.

    222 GitHub stars~2k tokensUpdated today
    Testing & QAAuto-check passed

  • Write Spec

    LiberatedPixelCup/Universal-LPC-Spritesheet-Character-Generator

    Write a browser Mocha, Node, or Playwright visual spec for this repo.

    1.8k GitHub stars~719 tokensUpdated 3 days ago
    Testing & QAAuto-check passed

  • Handsontable Visual Testing

    handsontable/handsontable

    Guide to Playwright visual regression tests in Handsontable: when a screenshot is justified, the tablePage fixture, naming, reg-suit comparison and demo routes.

    22k GitHub stars~2.3k tokensUpdated yesterday
    Testing & QAAuto-check passed

More from QwenLM/qwen-code

All 41 skills in this repo

  • Agent Feature Reproduction

    QwenLM/qwen-code

    Reproduces a feature from Codex or Claude Code in Qwen Code by running the reference agent under capture, reading the traces, then implementing matching behavior.

    28k GitHub stars~1.5k tokensUpdated today
    Auto-check passed

  • Qwen Code E2E Testing

    QwenLM/qwen-code

    Guides end-to-end testing of the Qwen Code CLI in headless mode with real model calls, MCP test servers and inspection of raw API traffic.

    28k GitHub stars~2.1k tokensUpdated today
    Auto-check passed

  • Repo Hygiene Scan and Fix

    QwenLM/qwen-code

    Scheduled CI skill that scans a repository for small, certain docs, test and code hygiene issues and fixes them on one branch with a commit per finding.

    28k GitHub stars~1.7k tokensUpdated today
    Auto-check passed

  • Qwen Code Desktop Brand Builder

    QwenLM/qwen-code

    Builds a rebranded Qwen Code desktop package from the Tauri shell using only a brand id and a logo, with sensible derived defaults.

    28k GitHub stars~2.1k tokensUpdated today
    Auto-check passed

  • Qwen Code Memory Leak Debugger

    QwenLM/qwen-code

    Walks through capturing and comparing V8 heap snapshots to find memory leaks in the Qwen Code Node.js CLI, using tmux and the chrome-devtools CLI.

    28k GitHub stars~1.3k tokensUpdated today
    Auto-check passed

  • tmux Real User Testing

    QwenLM/qwen-code

    Drives Qwen Code in a real tmux session the way a user would and saves a readable step-by-step transcript of each screen for maintainers to review.

    28k GitHub stars~2.3k tokensUpdated today
    Auto-check passed

Works with

Categories

Questions about Terminal Screenshot Capture

What does Terminal Screenshot Capture do?

Drives a CLI through a TypeScript scenario and saves terminal screenshots at each step, so pull requests that change command output can be checked visually. Scenarios are TypeScript files placed under `integration-tests/terminal-capture/scenarios/`.js inside headless Playwright, and screenshots are taken from that page.

When should I use Terminal Screenshot Capture?

Terminal Screenshot Capture fits situations like: checking a pull request that changes CLI output or slash command rendering; capturing screenshots of commands such as /about or /context for documentation; adding a visual check for a multi-step terminal UI flow.

How do I install Terminal Screenshot Capture in Claude Code?

Run `npx skills add QwenLM/qwen-code --skill terminal-capture -a claude-code`. Or copy the skill folder (.qwen/skills/terminal-capture in QwenLM/qwen-code) into .claude/skills/terminal-capture in your project. Claude Code loads it when a task matches its description.

How do I install Terminal Screenshot Capture in Codex?

Run `npx skills add QwenLM/qwen-code --skill terminal-capture -a codex`. Or copy the skill folder (.qwen/skills/terminal-capture in QwenLM/qwen-code) into .agents/skills/terminal-capture in your project. Codex loads it when a task matches its description.

Can I use Terminal Screenshot Capture 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 QwenLM/qwen-code --skill terminal-capture -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/terminal-capture, .gemini/skills/terminal-capture, .github/skills/terminal-capture and .opencode/skills/terminal-capture in your project.

What does Terminal Screenshot Capture need to run?

Going by SKILL.md and its folder, Terminal Screenshot Capture needs the command-line tools its instructions call (npx, npm, brew and playwright). Our summary lists: Project dependencies installed with `npm install`; Playwright Chromium from `npx playwright install chromium`.

Does Terminal Screenshot Capture access the network?

SKILL.md contains no URLs. Its commands use npx and npm, which can reach the network depending on how they are called. This is read from the text; nothing was executed.

Is Terminal Screenshot Capture 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. Review the folder before installing.

What licence does Terminal Screenshot Capture use?

Terminal Screenshot Capture is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Terminal Screenshot Capture use?

About 2k tokens (SKILL.md is roughly 8.1k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Terminal Screenshot Capture?

Skills that share tags, products or a category with Terminal Screenshot Capture: Project Pull Request (swimmwatch/cloakbrowser-mcp, 164 stars), UI Visual Debugging (NangoHQ/nango, 13k stars), Pre Commit (wellwelwel/poku, 1.2k stars) and Trust Remote Builder (johannesPettersson80/trust-platform, 222 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Terminal Screenshot Capture?

QwenLM (a GitHub organization) maintains it in QwenLM/qwen-code, which has 28,410 GitHub stars. The repository holds 41 skills in this directory. The repository was last updated on October 11, 2026.

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