Dev & Engineering ✓ Microsoft · Official vscode-insidersplaywrightchrome-devtools-protocolcopilot-chatui-automationmonaco-editorscreenshot-testing

VS Code Insiders UI Automation

Automate VS Code Insiders and Copilot Chat through Playwright and CDP.

FollowSkills review · FSRS-2.0
Not recommended
46/ 100 5-point scale 2.3 / 5
Trust12 / 25 · 2.4/5

The document constrains the declared tool pattern to Playwright CLI Bash usage and explains local CDP, an isolated user-data directory, and screenshot evidence. However, it persists authentication state, controls a chat UI, and may capture sensitive content without explicit per-action confirmation, data-flow disclosure, permission boundaries, sensitive-data guidance, or dependable rollback, so points are deducted.

Reliability8 / 20 · 2.0/5

The workflow documents prerequisites, dependencies, ports, retries, re-snapshotting, and common failures. Static material does not establish executable success on key paths; internal selectors, authentication, platform differences, and failure diagnostics remain limited, so the score is kept below the static ceiling.

Adaptability9 / 15 · 3.0/5

Triggers, target scenarios, and main capabilities are fairly clear for UI interaction, chat automation, extension testing, debugging, and screenshots. Non-fit boundaries are incomplete, Chinese-language support is not addressed, and core Copilot use depends on GitHub authentication and services whose mainland-China reachability may vary, so points are deducted.

Convention8 / 15 · 2.7/5

The document is organized progressively across prerequisites, workflow, attachment, interaction details, troubleshooting, and cleanup, with concrete commands and dependency/version hints. It lacks a clear versioning policy, changelog, maintenance owner, and update path, while some installation and environment assumptions remain implicit, so points are deducted.

Effectiveness6 / 15 · 2.0/5

For a developer with VS Code Insiders, a working build environment, and Copilot authentication, the workflow plausibly covers launch, attachment, snapshots, interaction, screenshots, and cleanup. Static review cannot verify result completeness or success rate, and authentication, compilation, and manual recovery add cost, so the score remains limited.

Verifiability3 / 10 · 1.5/5

The skill provides concrete commands, ports, selectors, and failure conditions, and the repository contains related chat-library and performance CI. Those workflows do not directly cover this skill's Playwright/CDP paths, and no independent reproduction or third-party execution evidence is supplied, so only limited credit is justified.

Evidence confidence:Low Reviewed Jul 20, 2026 Reviewed revision 5b3e1be7be9e
Before you use it
  • The persistent debug directory can retain Copilot/GitHub authentication state; verify its permissions and avoid screenshots containing tokens, source code, prompts, or personal data.
  • The CDP port and internal CSS selectors introduce local exposure and version fragility; restrict the listener, verify the target window, and clean up processes and sensitive state afterward.
  • Copilot authentication and model services may be affected by mainland-China network access, account policy, or regional restrictions; no offline or substitute path is documented.
  • The cleanup example uses command-line matching to kill a process and could match the wrong VS Code instance; manually verify the process before terminating it.
See the full review method →

What it does & when to use it

This skill connects to VS Code Insiders through the Chrome DevTools Protocol and uses @playwright/cli to operate the Copilot Chat extension and VS Code UI. It covers extension compilation, launch configuration, CDP attachment, snapshots, element interaction, and screenshot evidence. It also documents Monaco editor input handling, multiple webview targets, and restarting after extension code changes. It fits developers and QA engineers testing real VS Code interfaces, provided they use VS Code Insiders, compile the extension first, and maintain an authenticated GitHub session.

Runs npm install, npm run compile, or npm run watch; launches VS Code with code-insiders in extension-development mode, a CDP port, and a persistent user-data directory; attaches with npx @playwright/cli; lists or selects tabs, takes snapshots, fills inputs, sends key presses, and evaluates Monaco content; saves timestamped screenshots; and recompiles, terminates, and relaunches VS Code after source changes.

  1. An extension developer needs to load and verify an extension UI in VS Code Insiders.
  2. A Copilot Chat tester needs to fill the chat input and wait for generation to finish.
  3. A developer needs to discover VS Code UI elements through accessibility snapshots and interact with them.
  4. A QA engineer needs screenshots before and after UI actions as a visual test record.
  5. A tester must enter text into a Monaco editor when ordinary click-based input is blocked.

Pros & cons

Pros
  • Provides an end-to-end compile, launch, CDP attachment, snapshot, and interaction workflow.
  • Documents reliable Monaco input methods using fill, type, press, and JavaScript focus events.
  • Includes tab management, screenshot evidence, troubleshooting, and restart procedures.
  • Uses a persistent profile so authentication, settings, and extension state can survive sessions.
Limitations
  • Requires VS Code Insiders; VS Code Stable will not activate the extension.
  • Requires a compiled extension and an authenticated GitHub session for Copilot Chat to function.
  • Relies on internal VS Code CSS selectors that may change after updates.
  • The source does not provide a standalone package, test suite, or cross-platform validation results.

How to install

From the root of the microsoft/vscode repository, run npm install so @playwright/cli is available through devDependencies; the source also allows npm install -g @playwright/cli. The skill is located at extensions/copilot/.agents/skills/launch/SKILL.md. The supplied material does not document a separate installation or copy step.

How to use

Run npm run compile, then launch with code-insiders --extensionDevelopmentPath="$PWD" --remote-debugging-port=9223 --user-data-dir="$PWD/.vscode-ext-debug". Attach with npx @playwright/cli attach --cdp=http://127.0.0.1:9223, then use npx @playwright/cli tab-list and npx @playwright/cli snapshot. Example trigger prompts include “automate VS Code,” “interact with chat,” “test the UI,” “take a screenshot,” and “launch with debugging.”

Compared to similar skills

Compared with VS Code Stable, this skill requires VS Code Insiders because the target extension uses 58 proposed VS Code APIs and targets a specified version range.

FAQ

Does it work with VS Code Stable?
No. The source explicitly requires VS Code Insiders, and Stable will not activate the extension.
Is sign-in required?
Yes. Copilot Chat requires an authenticated GitHub session; a temporary user-data directory can produce a sign-in wall and unavailable models.
Why can ordinary click fail in the chat input?
The input uses Monaco Editor, where a transparent overlay can block click. The documented preference is fill with a fresh snapshot reference, followed by type or press when focused.
What should be cleaned up afterward?
Close the @playwright/cli connection and kill the VS Code instance using the debug user-data directory to release resources and the CDP port.

More skills from this repository

All from microsoft/vscode

Dev & Engineering ✓ Microsoft · Official

Tool Rename Compatibility Check

Protect existing prompts and tool configurations when built-in tools are renamed.

Dev & Engineering ✓ Microsoft · Official

Copilot Chat OpenTelemetry Instrumentation

A repository-specific guide for consistent OpenTelemetry instrumentation in Copilot Chat.

Dev & Engineering ✓ Microsoft · Official

VS Code Configuration Policy Maintainer

Standardize VS Code policy registration, export, and validation.

Design & Frontend ✓ Microsoft · Official

VS Code Design Philosophy

Turn vague UI discomfort into concrete fixes using shared values, principles, and design moves.

Dev & Engineering ✓ Microsoft · Official

Agent Host E2E Test Assistant

Maintain VS Code Agent Host end-to-end tests with strict replay fixtures.

Dev & Engineering ✓ Microsoft · Official

VS Code Integrated Browser Architecture

A practical architecture guide for safely changing VS Code's cross-process integrated browser.

Dev & Engineering ✓ Microsoft · Official

VS Code Agents Window Sessions

Safely implement and repair VS Code Agents window features.

Dev & Engineering ✓ Microsoft · Official

Commit Assistant

Creates repository-style commit messages and safely commits code changes.

Dev & Engineering ✓ Microsoft · Official

Agent Host Log Investigator

Trace session, transport, and host failures in Agent Host debug exports.

Dev & Engineering ✓ Microsoft · Official

VS Code Unit Test Runner

Run VS Code repository unit tests by file, test name, or compiled-output glob.

Dev & Engineering ✓ Microsoft · Official

VS Code Agent Customization Assistant

Create, repair, and troubleshoot VS Code Agent customization files and their loading behavior.

Dev & Engineering ✓ Microsoft · Official

Code OSS Launch & Debug

Launch a built-from-source VS Code with isolated profiles, Playwright control, and multi-process debugging ports.

Dev & Engineering ✓ Microsoft · Official

VS Code Accessibility Development Guide

A practical specification for accessible interactive features in VS Code.

Design & Frontend ✓ Microsoft · Official

VS Code CSS Layout Standards

Build reliable VS Code-style CSS layouts and text truncation behavior

Dev & Engineering ✓ Microsoft · Official

VS Code Chat Performance Lab

Benchmark chat rendering and detect memory growth across VS Code builds.

Dev & Engineering ✓ Microsoft · Official

Component Fixtures for Screenshot Testing

Create stable, theme-aware VS Code component fixtures for isolated screenshot testing.

Dev & Engineering ✓ Microsoft · Official

VS Code Smoke Test Assistant

Run, filter, and debug VS Code end-to-end smoke tests.

Dev & Engineering ✓ Microsoft · Official

VS Code Crash Dump Symbolicator

Turn native VS Code crash dumps into readable backtraces with method names.

Dev & Engineering ✓ Microsoft · Official

Local VS Code Web Workbench

Validate VS Code workbench and Agents window changes in a local vscode.dev instance.

Dev & Engineering ✓ Microsoft · Official

Feedback Action

Reads current-session feedback and applies the requested code changes.

Related skills