web-widgets: Skill for Claude Code

Verify that an implementation matches the change artifacts (specs, tasks, design).

Input: Optionally specify a change name. If omitted, check if it can be inferred from conversation context. If vague or ambiguous you MUST prompt for available changes.

Steps

1. If no change name provided, prompt for selection

   Run openspec list --json to get available changes. Use the AskUserQuestion tool to let the user select.

   Show changes that have implementation tasks (tasks artifact exists). Include the schema used for each change if available. Mark changes with incomplete tasks as "(In Progress)".

   IMPORTANT: Do NOT guess or auto-select a change. Always let the user choose.

2. Check status to understand the schema

   openspec status --change "<name>" --json
   

   Parse the JSON to understand:

   • schemaName: The workflow being used (e.g., "spec-driven")
   • Which artifacts exist for this change

3. Get the change directory and load artifacts

   openspec instructions apply --change "<name>" --json
   

   This returns the change directory and contextFiles (artifact ID -> array of concrete file paths). Read all available artifacts from contextFiles.

4. Initialize verification report structure

   Create a report structure with three dimensions:

   • Completeness: Track tasks and spec coverage
   • Correctness: Track requirement implementation and scenario coverage
   • Coherence: Track design adherence and pattern consistency

   Each dimension can have CRITICAL, WARNING, or SUGGESTION issues.

5. Verify Completeness

   Task Completion:

   • If contextFiles.tasks exists, read every file path in it
   • Parse checkboxes: - [ ] (incomplete) vs - [x] (complete)
   • Count complete vs total tasks
   • If incomplete tasks exist:
     • Add CRITICAL issue for each incomplete task
     • Recommendation: "Complete task: " or "Mark as done if already implemented"

   Spec Coverage:

   • If delta specs exist in openspec/changes/<name>/specs/:
     • Extract all requirements (marked with "### Requirement:")
     • For each requirement:
       • Search codebase for keywords related to the requirement
       • Assess if implementation likely exists
     • If requirements appear unimplemented:
       • Add CRITICAL issue: "Requirement not found: "
       • Recommendation: "Implement requirement X: "

6. Verify Correctness

   Requirement Implementation Mapping:

   • For each requirement from delta specs:
     • Search codebase for implementation evidence
     • If found, note file paths and line ranges
     • Assess if implementation matches requirement intent
     • If divergence detected:
       • Add WARNING: "Implementation may diverge from spec: "
       • Recommendation: "Review : against requirement X"

   Scenario Coverage:

   • For each scenario in delta specs (marked with "#### Scenario:"):
     • Check if conditions are handled in code
     • Check if tests exist covering the scenario
     • If scenario appears uncovered:
       • Add WARNING: "Scenario not covered: "
       • Recommendation: "Add test or implementation for scenario: "

7. Verify Coherence

   Design Adherence:

   • If contextFiles.design exists:
     • Extract key decisions (look for sections like "Decision:", "Approach:", "Architecture:")
     • Verify implementation follows those decisions
     • If contradiction detected:
       • Add WARNING: "Design decision not followed: "
       • Recommendation: "Update implementation or revise design.md to match reality"
   • If no design.md: Skip design adherence check, note "No design.md to verify against"

   Code Pattern Consistency:

   • Review new code for consistency with project patterns
   • Check file naming, directory structure, coding style
   • If significant deviations found:
     • Add SUGGESTION: "Code pattern deviation: "
     • Recommendation: "Consider following project pattern: "