Use the chrome-devtools MCP to run browser tests on local Storybook stories by navigating directly to `iframe.html` story URLs instead of the outer docs pages.
62
72%
Does it follow best practices?
Impact
—
No eval scenarios have been run
Passed
No known issues
Optimize this skill with Tessl
npx tessl skill review --optimize ./.cursor/skills/chrome-devtools-storybook/SKILL.mdQuality
Discovery
72%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
The description is technically specific and occupies a clear niche, making it distinctive and rich in natural trigger terms. However, it lacks an explicit 'Use when...' clause, which limits completeness, and it describes only a single technique rather than listing multiple concrete actions the skill enables.
Suggestions
Add an explicit 'Use when...' clause, e.g., 'Use when the user asks to test or debug Storybook components in a browser, run visual tests on stories, or interact with Storybook via chrome-devtools MCP.'
List additional concrete actions the skill covers beyond URL navigation, such as 'capture screenshots, inspect component state, validate rendering, or debug interactive stories.'
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | It names the domain (browser tests on Storybook stories) and a specific action (navigating to iframe.html story URLs), but doesn't list multiple concrete actions beyond that single technique. | 2 / 3 |
Completeness | It explains what (run browser tests on Storybook stories via chrome-devtools MCP using iframe.html URLs) but lacks an explicit 'Use when...' clause specifying when Claude should select this skill. | 2 / 3 |
Trigger Term Quality | Includes strong natural trigger terms: 'chrome-devtools', 'MCP', 'browser tests', 'Storybook', 'stories', 'iframe.html', 'story URLs'. A user working with Storybook testing would naturally use several of these terms. | 3 / 3 |
Distinctiveness Conflict Risk | Highly distinctive — the combination of chrome-devtools MCP, Storybook stories, and iframe.html navigation creates a very specific niche that is unlikely to conflict with other skills. | 3 / 3 |
Total | 10 / 12 Passed |
Implementation
72%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This is a well-structured, actionable skill that clearly teaches the critical pattern of converting Storybook URLs to iframe URLs for chrome-devtools MCP testing. Its main strengths are concrete URL conversion rules with examples and clear workflow sequencing. Its weaknesses are some content redundancy (examples repeat the conversion rules) and missing validation/error-handling steps in the workflow.
Suggestions
Add a validation checkpoint after navigation (e.g., 'Verify the page loaded by checking for the presence of the root component element before proceeding with interactions').
Remove the redundant Examples section or consolidate it into the URL conversion rules section to reduce token usage.
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The content is mostly efficient but has some redundancy. The examples section repeats the URL conversion rules that were already explained in detail above. The final paragraph restates the rationale already covered. Some trimming is possible, but it doesn't over-explain concepts Claude already knows. | 2 / 3 |
Actionability | The URL conversion rules are concrete and specific with exact patterns and examples. The step-by-step process for using the MCP is clear with specific instructions (navigate to iframe URL, find elements by role/text/data attributes, etc.). The conversion algorithm is copy-paste applicable. | 3 / 3 |
Workflow Clarity | The workflow has clear sequencing (convert URL → navigate → interact), but lacks validation checkpoints. There's no guidance on what to do if the story doesn't load, if the component ID is wrong, or how to verify the page loaded correctly before interacting. For browser testing operations, a validation step after navigation would be important. | 2 / 3 |
Progressive Disclosure | For a standalone skill with no bundle files, the content is well-organized with clear sections (When to Use, URL Rules, Converting URLs, Examples, Using the MCP). The structure is logical and easy to navigate. No external references are needed for this scope of content. | 3 / 3 |
Total | 10 / 12 Passed |
Validation
100%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 11 / 11 Passed
Validation for skill structure
No warnings or errors.
76a3678
Table of Contents
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.