Loading ToolBench
Reference MCP server for frontend workflows — real axe-core audits, Playwright screenshots, bundle-budget checks, design-token diffs, Storybook story runs.
Strong tool definitions with complete schemas and descriptions. All 6 tools have clear names starting with action verbs (axe_audit, page_screenshot, bundle_budget_check, design_token_diff, storybook_story_run, scaffold_react_component). Descriptions are detailed (100-250 chars) and explain WHAT, WHEN, and prerequisites. Input schemas use Zod with proper types and descriptions for all parameters. However, output schemas are not explicitly documented in the source code, only inferred from implementation. Error handling is present but recovery guidance is minimal. No tool annotations (readOnlyHint/destructiveHint) despite clear risk profiles (READ_ONLY vs WRITE).
Run the axe-core accessibility ruleset against an HTML string (jsdom) or a live URL (Playwright). Returns violations grouped by impact with fix guidance and helpUrl links.
Walk a build directory, measure raw + gzip (+ optional brotli) sizes per file, and flag files that exceed a global or per-entry KB budget. CI-friendly JSON output.
Diff two design-token JSON files (W3C DTCG / Style Dictionary style). Reports added, removed, and changed tokens with $type-aware classification. Useful for PR review of design-system changes.
Launch headless Chromium, navigate to a URL, and save a PNG screenshot. Supports element selectors, full-page capture, dark mode, and custom viewports. Requires the optional `playwright` peer dependency.
Write a TypeScript React component, optional test, and optional Storybook story into outDir. Supports functional, forwardRef, and polymorphic (`as` prop) variants.
Load a single Storybook story in headless Chromium via iframe.html, optionally screenshot it, and run an axe-core audit against the rendered output. Requires `playwright`.
Output schemas not documented. Tool descriptions explain inputs but do not specify return types, field names, or structure. LLMs cannot plan downstream tool calls or extract required data without knowing what fields to expect.
Tool annotations missing. axe_audit and design_token_diff are READ_ONLY; page_screenshot and scaffold_react_component are WRITE (destructive). No readOnlyHint or destructiveHint in tool definitions. Agents cannot distinguish safe from risky operations.
Error recovery guidance minimal. Tools call external services (Playwright, jsdom, file I/O) but error messages do not guide LLM recovery. E.g., 'playwright not installed' should suggest 'Install playwright peer dependency' or 'Use HTML mode instead of URL mode'.
| Scored | Grade | Overall | Spec posture | Rubric |
|---|---|---|---|---|
| 2026-09-23 | D | 56 | 2026-07-28+ | v2 |
Parameter constraints not fully enforced in descriptions. bundle_budget_check accepts perEntryBudgetKb as object but does not document the expected key format (glob patterns, substring matches). scaffold_react_component props array structure is complex but lacks examples.
Pagination and result limits not documented. axe_audit returns violations grouped by impact but does not cap results or explain truncation behavior. storybook_story_run runs a single story but does not clarify if multiple stories require sequential calls.