Skip to content

Extract verify-layout as a harness-agnostic skill (atomic init for portable skills) - #3689

Draft
lezama wants to merge 5 commits into
improve-agent-visual-verificationfrom
portable-skill-overlays
Draft

Extract verify-layout as a harness-agnostic skill (atomic init for portable skills)#3689
lezama wants to merge 5 commits into
improve-agent-visual-verificationfrom
portable-skill-overlays

Conversation

@lezama

@lezama lezama commented Jun 3, 2026

Copy link
Copy Markdown
Contributor

Related issues

  • Related to #

How AI was used in this PR

Code and this description were drafted with Claude Code and reviewed by me.

Proposed Changes

A deliberately tiny slice: extract the layout-verification guidance into its own verify-layout skill whose body is harness-agnostic — it describes the capability (capture a viewport-height slice; measure the rendered DOM) and names no Studio tool. The single Studio-specific line lives in a separate "In Studio" section at the end, kept clearly separable.

The point is the shape, not the size: a skill body written this way can later be lifted verbatim into a shared, cross-harness skill library that Studio and Telex both consume, while each keeps its own tool names. This is the smallest version of that idea — a real, mergeable skill, no new machinery.

Intentionally not here (YAGNI): a loader/overlay mechanism that injects the Studio section from a separate file, and the shared package itself. Those are clean follow-ups once there's a second consumer to justify them.

Stacked on #3647 (the body's capability maps to take_screenshot fullPage / measure_elements, which land there). Base retargets to trunk once #3647 merges.

Testing Instructions

  1. In a studio code session, load the verify-layout skill — confirm the body reads capability-first and the "In Studio" section names the tools.
  2. npm test -- apps/cli/ai/tests/system-prompt.test.ts — the "references only bundled skills" check covers the new verify-layout pointer from visual-design.

Pre-merge Checklist

  • Have you checked for TypeScript, React or other console errors?
lezama and others added 3 commits June 3, 2026 11:12
Separate a skill's portable capability knowledge from the Studio-specific tool
binding. Skill bodies under skills/<name>/SKILL.md name no tools; the mapping
to concrete tools lives in skill-overlays/<name>.md and loadSkills() appends it
under an "In Studio" heading. Skills with no overlay load unchanged.

This keeps skill bodies liftable into a shared cross-harness skill library
(Studio Code/CLI/App/Web, and other agent surfaces) without rewriting, while
Studio's tool names stay in Studio. Extracts the layout-verification guidance
into a verify-layout skill as the first example, backed by take_screenshot /
measure_elements via its overlay.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
lezama and others added 2 commits June 3, 2026 11:53
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
… loader

YAGNI — the loader-based overlay mechanism (and its build wiring) isn't needed
to ship a harness-agnostic skill. Keep verify-layout's body tool-free and put
the one Studio-specific line in an inline 'In Studio' section, kept separable
so the body can move to a shared cross-harness skill later. The mechanical
loader/overlay can land then, when there's a second consumer to justify it.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@lezama lezama changed the title Author skills harness-agnostically with per-harness tool overlays Jun 3, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

1 participant