migration-conformance

Verifies migrated web components conform to project style guides and pass all linters.

1.5k|261|Updated Nov 19, 2018
One-click install
npx skills add https://github.com/adobe/spectrum-web-components --skill migration-conformance
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: migration-conformance
Source: https://github.com/adobe/spectrum-web-components/tree/main/.ai/skills/migration-conformance
Command: npx skills add https://github.com/adobe/spectrum-web-components --skill migration-conformance

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

After migrating a component from 1st-gen to 2nd-gen in the Spectrum Web Components monorepo, teams need a structured way to confirm the migrated files follow project style guides and pass all automated linters before documentation work begins. This Skill provides that conformance pass with a defined scope, sequence, and quality gate.

Core Features & Use Cases

  • Automated lint orchestration: Runs ESLint, Stylelint, and Prettier scoped to the migrated component and requires all errors to be resolved before manual review.
  • Domain-by-domain manual review: Delegates per-file-type criteria (TypeScript, CSS, tests, stories) to the authoritative code-conformance skill and its referenced style guides.
  • Guideline gap reporting: Surfaces cases where correct code is not covered by existing guidelines as proposed PR comments, without blocking the conformance pass.
  • Use Case: After Phase 6 testing of a migrated button component passes, ask for a conformance check to run linters, review each file against the style guides, and produce a checklist confirming the migration is style-compliant.

Quick Start

Ask the assistant to run conformance checks for the migrated component, for example by saying "Check code conformance for the button component migration."

Frequently Asked Questions about migration-conformance

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I check code conformance for a migrated Spectrum Web Component?

Ask to run conformance checks for the component after Phase 6 testing passes. The workflow runs ESLint, Stylelint, and Prettier scoped to the component, then reviews each file against the TypeScript, CSS, testing, and Storybook style guides.

What linters run during a migration conformance check?

The check runs yarn lint for ESLint, yarn lint:css for Stylelint, and Prettier in check and write modes scoped to the migrated component's directory. All errors must be resolved before the manual style guide review begins.

When should I run the migration conformance sub-task?

Run it after Phase 6 migration testing is complete and all tests pass, but before Phase 7 documentation. Running it earlier risks style issues masking test failures.

Can I just run yarn lint instead of the full conformance review?

Yes, if you only need automated linting as a quick fix, run yarn lint directly. The full conformance skill adds manual style guide review per file domain and guideline gap reporting, which linters alone cannot cover.

What happens when code is correct but the style guide does not cover it?

The gap is surfaced to the user as a proposed PR comment including the file, line, pattern, and rationale. It does not block the conformance pass, and the guideline itself is not changed silently.