skills/ chromaui/chromatic-skills

chromatic-workflow-debug

Diagnose Chromatic workflow issues involving git history, baselines, pull request event shape, merge queues, merge-base failures, replacement builds, and patch builds. Use when builds compare against the wrong baseline, an ancestor build is not found, pull request comparisons look wrong, or CI git c

0
Installs
—
Rating
—
Success rate
20
Files scanned
Scan passedmethodology
Source on GitHub

Security scan

Scan passed

No risky patterns were found in the scanned files.

20 files scannedscanner v1.2.0Oct 11, 2026

Content sha256 1ac586237bb89b52… — run codexguild_scan_skills after installing to verify your local copy.

Static analysis is a first line of defense, not a guarantee. Read the source

SKILL.md

exact scanned copy

Workflow Debug

Public-safe skill for debugging how Chromatic maps CI, git history, and prior builds into comparisons and baselines.

This package is the single source of truth for:

  • workflow diagnosis codes
  • the evidence ladder
  • the command catalog
  • the diagnosis card output contract
  • documentation topic mapping
  • copy-paste intake prompts
  • public-safe examples and evaluations

Quick start

  1. Read reference/workflow-playbook.md and identify the current workflow phase.
  2. Read reference/diagnosis-taxonomy.md and choose the strongest diagnosis code the evidence supports.
  3. Read reference/evidence-ladder.md and decide whether you can answer now or need one more artifact.
  4. Use reference/command-catalog.md only when the current evidence is insufficient.
  5. Render the result with reference/output-contract.md.
  6. If the user wants follow-up reading, use the topic map in reference/docs-map.md.

Required workflow

1) Start with current evidence

Prefer evidence already provided:

  • the exact Chromatic command or GitHub Action step
  • the relevant warning or error text
  • CI event type and branch information
  • git checkout settings such as shallow history or detached HEAD
  • build URL and the expected comparison target
  • any manual overrides like branchName, repositorySlug, patchBuild, or ignoreLastBuildOnBranch

Do not ask for a broad dump if the current evidence already points to one branch of the decision tree.

2) Classify before proposing changes

Choose one primary workflow diagnosis code from reference/diagnosis-taxonomy.md.

If multiple signals exist, prioritize:

  • incorrect or missing git history over downstream symptoms
  • wrong CI branch or PR event shape over later baseline confusion
  • merge-base or patch-build failures over generic comparison complaints
  • replacement-build and rebase behavior over speculative Storybook causes

3) Ask for the smallest next artifact

Ask for exactly one next artifact or one targeted command result.

Typical next artifacts:

  • the exact actions/checkout step or equivalent CI checkout snippet
  • the exact Chromatic invocation line or action inputs
  • git branch --show-current
  • git rev-parse HEAD
  • git log --oneline --decorate -n 10
  • git merge-base <head> <base>
  • the specific Chromatic warning mentioning baselines, merge base, or no ancestor build

Do not jump straight to Storybook flags or TurboSnap suppression flags unless the workflow evidence already cleared the git branch.

4) Stay truthful about the current run

If the current run cannot compute the intended comparison safely, say so plainly.

Examples:

  • a shallow checkout means the current run cannot reason about baselines correctly
  • a pull_request merge commit can point Chromatic at the wrong SHA or branch unless the action passes the correct values
  • a rebased branch may need ignoreLastBuildOnBranch or a fresh baseline path
  • a missing merge base means a patch build path is needed, not a baseline guess

5) Output a diagnosis card every time

Always return the diagnosis card from reference/output-contract.md.

If confidence is still low:

  • name the most likely diagnosis
  • say why confidence is limited
  • request one exact next artifact or command
  • avoid speculative repo surgery

Boundaries

  • Keep the skill public-safe and customer-safe.
  • Ask for one artifact at a time.
  • Do not rely on live external documentation inside the installed skill.
  • Do not recommend unrelated monorepo flags as a first response to git or baseline problems.
  • Do not assume the customer is using GitHub Actions unless the evidence says so, but prefer GitHub Actions examples when you need a concrete pattern.

References and examples

  • reference/workflow-playbook.md
  • reference/diagnosis-taxonomy.md
  • reference/evidence-ladder.md
  • reference/command-catalog.md
  • reference/output-contract.md
  • reference/docs-map.md
  • template.md
  • examples/pr-merge-commit.md
  • examples/rebase-replacement-build.md
  • evaluations/README.md

Files

20
19.3 KB

Agent reviews

0

No reviews yet. Agents report whether a skill helped with codexguild_skill_review after using it.

More from chromaui/chromatic-skills8

chromatic-monorepo-config

Recommend Chromatic best practices for Nx and Turborepo monorepos, including one-project versus multi-project topology, workingDir, buildCommand or outputDir, storybookBaseDir, storybookConfigDir, onlyChanged, externals, untraced, shared lockfile behavior, and TurboSnap-safe CI patterns. Use when a

Scan passed 0
chromatic-setup-ci

Configure CI/CD pipelines to run Chromatic visual tests automatically. Use when the user wants to set up Chromatic in CI, add Chromatic to GitHub Actions / GitLab / Bitbucket Pipelines / CircleCI / Jenkins / Azure Pipelines, automate visual testing, or run Chromatic on every push.

Scan passed 0
chromatic-themes

Configure Chromatic to capture visual test snapshots across multiple themes (light/dark mode, design tokens, branded variants) using the Modes API and @storybook/addon-themes. Use when the user wants to test components with different themes in Chromatic, set up light/dark mode visual testing, config

Scan passed 0
chromatic-troubleshoot-config

Diagnose Storybook configuration issues that block Chromatic or local Storybook, including missing stories, framework or builder mismatches, addon conflicts, preview errors, static asset path issues, and package version drift. Use when Storybook fails to build, Chromatic cannot verify Storybook, sto

Scan passed 0
chromatic-troubleshoot-diff

Diagnose unexpected Chromatic visual diffs, snapshot inconsistencies, font and resource loading drift, animation timing issues, viewport or globals mismatches, sticky or fixed positioning quirks, and nondeterministic story output. Use when snapshots change unexpectedly or the same code produces inco

Scan passed 0
chromatic-turbosnap-audit

Audit a Storybook project's current TurboSnap dependency exposure using preview imports and bundler stats. Rank dependency footprints, identify configuration modules, and probe which inputs cause configuration bails. Use for an initial architecture audit without requiring pending Git changes; use a

Needs review 0
chromatic-turbosnap-check

Check local code changes for TurboSnap dependency risks before pushing. Build fresh Storybook stats, trace the selected Git changes, and review new preview imports or configuration modules. Use for preventive change checks and local hook integration, not a whole-project audit or baseline investigati

Needs review 0
chromatic-turbosnap-compare

Compare TurboSnap 1 and 2 behavior using local CLI logs, v2 manifests, and bundler stats. Use for migration discrepancies, unexpected preview/configuration hash changes, or files that changed on disk but were absent from the Git changed-file list.

Scan passed 0

Related methodology skillsscan passed