{
  "skill_name": "responsive-screenshots",
  "evals": [
    {
      "id": 1,
      "prompt": "Capture responsive screenshots at mobile, tablet, and desktop to verify the new hero section",
      "expected_output": "Triggers responsive-screenshots skill to capture at 375px, 768px, and 1440px viewports via Sweetlink",
      "expectations": [
        "Should trigger responsive-screenshots skill",
        "Should capture at all three standard breakpoints (375, 768, 1440)",
        "Should save to .tmp/screenshots/ and review for responsive issues"
      ],
      "assertions": [
        {
          "type": "skill_used",
          "name": "responsive-screenshots",
          "description": "Routes breakpoint verification to responsive-screenshots."
        },
        {
          "type": "command_matches",
          "pattern": "sweetlink screenshot.*(--responsive|--viewport)",
          "description": "Uses Sweetlink screenshot capture with responsive viewport controls."
        },
        {
          "type": "output_contains",
          "value": "375",
          "description": "Includes the mobile breakpoint in the result."
        }
      ]
    },
    {
      "id": 2,
      "prompt": "Test the breakpoints on the pricing page -- I want to see how it looks on mobile vs desktop",
      "expected_output": "Triggers responsive-screenshots skill to capture the pricing page across viewports",
      "expectations": [
        "Should trigger responsive-screenshots skill",
        "Should use pnpm sweetlink screenshot with --viewport flags",
        "Should analyze screenshots against the quality checklist"
      ],
      "assertions": [
        {
          "type": "skill_used",
          "name": "responsive-screenshots",
          "description": "Routes pricing-page breakpoint checks to responsive-screenshots."
        },
        {
          "type": "command_matches",
          "pattern": "sweetlink screenshot.*--viewport",
          "description": "Captures viewport-specific screenshots."
        },
        {
          "type": "output_contains",
          "value": "desktop",
          "description": "Reports at least the desktop breakpoint in the review."
        }
      ]
    },
    {
      "id": 3,
      "prompt": "Take a quick screenshot of the current page to verify my CSS change",
      "expected_output": "Should NOT trigger responsive-screenshots - this is a single screenshot, not multi-viewport testing",
      "expectations": [
        "Should NOT trigger responsive-screenshots - use screenshot skill for single screenshots"
      ],
      "assertions": [
        {
          "type": "skill_not_used",
          "name": "responsive-screenshots",
          "description": "Single screenshots are outside responsive-screenshots."
        },
        {
          "type": "skill_used",
          "name": "screenshot",
          "description": "Routes single-page capture to screenshot."
        },
        {
          "type": "command_matches",
          "pattern": "sweetlink screenshot",
          "description": "Uses the single screenshot command path."
        }
      ]
    }
  ]
}