DO NOT MERGE - Full Context Only - feat(skills): Add page-structure skill with eval-driven development

[yan-xie-webflow]

Summary

• New plugin: webflow-designer-tools with page-structure skill for building and managing page elements, components, and layouts in Webflow Designer
• New eval framework: pytest-based test suite using Claude CLI stream-json output to validate skill trigger accuracy and execution quality
• Registered the new plugin in both Claude and Cursor marketplace configs

Methodology: Eval-Driven Skill Development

This PR follows an eval-first approach — all tests were written and validated before the skill implementation, similar to TDD but for LLM skill behavior:

1. Define eval framework — Built shared fixtures (run_claude, extract_tool_calls, extract_skill_invocations) that spawn claude -p with --output-format stream-json and parse events to verify tool calls and skill invocations
2. Write trigger tests first — 29 tests (14 positive, 15 negative) validating that natural language prompts route to the correct skill based on the skill description alone
3. Write execution tests first — 15 tests verifying correct MCP tool usage, ordering (guide_tool → data_sites_tool → de_page_tool → element_tool), confirmation before mutations, and no hallucinated tools
4. Implement the skill — Wrote SKILL.md following existing patterns (phased workflow, tool declarations, examples)
5. Iterate on failures — Used test diagnostics to refine the skill description (trigger accuracy), add missing site discovery step, and adjust test assertions for non-interactive mode behavior

Key design decisions driven by evals

Finding	Fix
Skill description too vague → low trigger accuracy	Added specific verbs: "inspecting components", "viewing what's inside a component", "previewing page structure"
Missing data_sites_tool → model asks for site ID and stops	Added site discovery to Phase 1 (matching all other skills)
50+ sites in workspace → model can't pick one	Test prompts specify site name; skill instructions say "if only one site, use it automatically"
Mutating ops correctly ask for confirmation in -p mode	Tests accept confirmation-and-stop as valid safety behavior
Claude uses short skill names (page-structure) vs full (webflow-designer-tools:page-structure)	extract_skill_invocations normalizes both forms using init event's skills list

Test Results

Suite	Pass	Total
Smoke (fixtures work)	5	5
Trigger accuracy	29	29
Direct execution	15	15
Total	49	49

Files

Eval framework (evals/):

• pytest.ini — config with custom markers (designer, data_api, trigger, direct, negative)
• constants.py — central config (MCP tools, plugin dirs, model, max turns)
• conftest.py — run_claude(), extract_tool_calls(), extract_skill_invocations(), get_result()
• test_conftest_smoke.py — 5 smoke tests
• test_page_structure_trigger.py — 29 trigger accuracy tests
• test_page_structure_direct.py — 15 execution quality tests

Skill (plugins/webflow-designer-tools/):

• .claude-plugin/plugin.json — plugin config
• skills/page-structure/SKILL.md — 5-phase workflow (Discovery → Inspection → Planning → Execution → Verification)

Config:

• .claude-plugin/marketplace.json — added webflow-designer-tools entry
• .cursor-plugin/plugin.json — added skills path
• .cursor-plugin/marketplace.json — updated description

Test plan

• All 49 eval tests pass (pytest evals/ -v)
• Smoke test with Designer open: /page-structure List all elements on the current page
• Verify trigger routing: "Add a hero section to my Webflow page" → triggers page-structure
• Verify negative routing: "Publish my Webflow site" → does NOT trigger page-structure

🤖 Generated with Claude Code