Dev & Engineering ✓ Microsoft · Official screenshot-testingvisual-regression-testingscreenshot-baselinesgithub-actionsgithub-clici

CI Component Screenshot Baseline Investigator

Investigate component screenshot differences from CI comments and captured artifacts.

FollowSkills review · FSRS-2.0
Not recommended
37/ 100 5-point scale 1.9 / 5
Trust14 / 25 · 2.8/5

The skill identifies an external Azure screenshot service and gives a CI-artifact download path, but it does not disclose data flow, access scope, sensitive-screenshot handling, user confirmation, rollback, or safe commit boundaries. Its description says to commit baselines while the body says no manual update is needed, so permissions and behavioral boundaries are unclear and points are deducted.

Reliability5 / 20 · 1.3/5

The procedure is concise and includes a concrete download command, but it assumes an authenticated, available gh CLI, GitHub permissions, and a valid run ID. It provides no diagnostic or recovery guidance for missing artifacts, authorization failures, network errors, or comparison failures. The description contradicts the body about committing baselines, and no skill-specific tests are supplied; the static cap therefore applies.

Adaptability6 / 15 · 2.0/5

The trigger and primary scenario are clear: investigate component screenshot differences reported by CI. However, inputs, outputs, non-fit cases, comparison tooling, and decision criteria are incomplete. The workflow depends on GitHub CI, GitHub CLI, and an overseas Azure service, which may reduce reachability for mainland-China users, so points are deducted.

Convention5 / 15 · 1.7/5

The name and scenario are broadly aligned, the document is concise, and it explains the baseline-storage and Git LFS changes. It lacks installation notes, CLI version requirements, parameter constraints, example outputs, FAQs, limitation disclosure, version/change history, and explicit maintenance ownership. Repository context supplies MIT licensing and Microsoft provenance, but that does not fill the skill's governance gaps.

Effectiveness3 / 15 · 1.0/5

It can help a user obtain raw CI screenshots for manual investigation, but it does not accomplish the described task of updating and committing baselines. It gives no local comparison method, acceptance criteria, or remediation workflow, leaving substantial manual work and limiting marginal value.

Verifiability4 / 10 · 2.0/5

The skill supplies an auditable command and describes the external service, while repository context indicates CI-based screenshot management. However, there is no skill-specific workflow, test suite, fixed service response, or reproducible output covering the key path, and no execution was performed during this static review, so evidence is limited.

Evidence confidence:Low Reviewed Jul 20, 2026 Reviewed revision 5b3e1be7be9e
Before you use it
  • The metadata and body directly conflict on whether baselines should be committed; confirm whether the actual goal is artifact investigation or repository modification.
  • The command depends on gh authentication, a valid run ID, GitHub artifact permissions, and Azure reachability; no failure diagnostics or mainland-China alternative are provided.
  • Downloaded screenshots may contain project code or UI data, but the document gives no storage, cleanup, or sensitive-data handling guidance.
See the full review method →

What it does & when to use it

This skill is for investigating visual differences reported by component screenshot tests and examining screenshots from a CI run. Screenshot baselines are no longer stored in the repository; an external service at hediet-screenshots.azurewebsites.net manages them. After a merge to the `main` branch, screenshots from the merge commit become the new baselines automatically, so manual baseline updates or commits are normally unnecessary. It fits development workflows that need to review PR comparisons, download raw screenshots, and compare them locally.

When the Checking Component Screenshots GitHub Action detects changes, it directs the user to inspect the before/after comparison in the PR comment; it uses gh run download <run-id> --name screenshots --dir .tmp/screenshots to download the CI artifact named screenshots; and it explains that the complete set of captured screenshots can be compared locally. It does not instruct users to write baselines back to test/componentFixtures/.screenshots/baseline/, and it does not use Git LFS for screenshot storage.

  1. A developer reviews a PR comment when the `Checking Component Screenshots` Action reports a component visual difference.
  2. A developer downloads the `screenshots` artifact to inspect raw captured images outside the PR comparison.
  3. A maintainer compares the complete CI screenshot set locally before deciding whether a component visual change is expected.
  4. A team maintains screenshot tests while keeping baseline images out of the Git repository and managed by an external service.

Pros & cons

Pros
  • Defines a focused investigation flow based on PR before/after comparisons and CI screenshot artifacts.
  • Uses an external service keyed by commit SHA instead of storing baseline images in the repository.
  • Removes Git LFS from screenshot storage.
  • Provides a directly executable GitHub CLI command for downloading the artifact.
Limitations
  • The documented scope is investigation; it does not provide a dedicated fix or local comparison command.
  • It requires network access to CI resources, PR comments, and the external screenshot service.
  • It requires GitHub CLI, while authentication, permissions, and retry behavior are not documented.
  • The source does not state the external screenshot service's pricing, availability guarantees, or retention policy.

How to install

The skill is located at .github/skills/update-screenshots/SKILL.md in the VS Code repository. You can clone the repository with git clone https://github.com/microsoft/vscode.git and keep the skill at .github/skills/update-screenshots/. The source does not document client-specific registration, installation, or configuration steps, and it lists no additional package-installation command.

How to use

Run it as a subagent when the component screenshot Action reports differences, for example: Investigate the CI component screenshot differences and download the screenshot artifact for local comparison. First inspect the PR comment from CI; when raw images are needed, run gh run download <run-id> --name screenshots --dir .tmp/screenshots. Do not manually commit screenshot baselines: the source says that the merge commit becomes the new baseline after merging to main.

Compared to similar skills

Compared with the former flow described in the source, screenshots are no longer stored in test/componentFixtures/.screenshots/baseline/ or through Git LFS; an external screenshot service manages them by commit SHA instead. The skill retains CI artifact download and local investigation steps, but no longer requires a manual baseline commit.

FAQ

Does this skill commit new screenshot baselines to Git?
No. The current instructions say that baselines are no longer stored in the repository and that the merge commit becomes the new baseline after merging to `main`.
When should I use it?
Use it when the `Checking Component Screenshots` GitHub Action detects changes and posts before/after comparisons in a PR, especially when you need to inspect or download the captured screenshots.
What does it require?
It requires access to the CI run, network connectivity, a writable local filesystem, and GitHub CLI capable of running `gh run download`. The source does not document the required authentication setup.
Can it automatically fix or approve screenshot differences?
The source only documents reviewing PR comparisons and downloading screenshot artifacts. It provides no dedicated command for fixing differences, approving them, or performing the local comparison.

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