sbuilder-vision-import

Documents browser screenshot, layout measurement, and page import behavior for the sbuilder-mcp server.

Updated Aug 28, 2026
One-click install
npx skills add https://github.com/vuluu2k/sbuilder-mcp --skill sbuilder-vision-import-vuluu2k
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: sbuilder-vision-import
Source: https://github.com/vuluu2k/sbuilder-mcp/tree/main/.claude/skills/sbuilder-vision-import
Command: npx skills add https://github.com/vuluu2k/sbuilder-mcp --skill sbuilder-vision-import-vuluu2k

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? When modifying the vision and import subsystems of the sbuilder-mcp server, developers repeatedly re-derive hard-won facts about browser screenshots, DOM capture, and page translation, or accidentally revert code that exists to handle measured edge cases. This Skill preserves those verified findings so changes to src/vision/**, importpage.ts, and the site import domains do not regress settled behavior. ## Core Features & Use Cases - Screenshot pipeline knowledge: Records how sb_look settles pages via MutationObserver instead of networkidle, handles hidden overlays, and avoids redundant saves that churn shared master revisions. - Import mapping rules: Captures how sb_import and sb_import_site reduce fetched pages to six element kinds, extract theme tokens from the target page, detect page chrome, map icons via the generated ICON_NAMES manifest, and relink internal URLs. - Fidelity and coverage harness: Documents how coverage is measured against the honest denominator (reader-visible content excluding nav, header, footer) and how the fidelity test suite is run with SB_BROWSER_TEST=1 from the repo root. - Use Case: An import returns duplicated sections or a screenshot shows a blank band; consult this Skill before editing capture.ts or shoot.ts to learn which behaviors are intentional and which fixes were already tried and rejected. ## Quick Start Ask the agent to review the sbuilder-vision-import guidance before modifying any file under src/vision or the site import domains.

Frequently Asked Questions about sbuilder-vision-import

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I run the browser test suite for sbuilder-mcp vision code?▼

Run SB_BROWSER_TEST=1 npm test from the repository root. The default gate skips the browser suite, and running from another directory fails several tests because they resolve paths through process.cwd().

Why does sb_import return duplicated sections from a web page?▼

Duplication happens when nested section elements are all captured, so inner content arrives twice. The capture keeps only innermost section candidates, and nested list items are walked by direct children to avoid the same stutter.

How does sb_look screenshot hidden overlays like cart drawers?▼

sb_look adds the platform's own is-open class to the overlay and scrim before measuring, because a closed drawer is visibility:hidden and translated off-screen, which makes clipped screenshots fail.

Why does an imported page lose text that readers can see?▼

Early coverage loss came from capturing only paragraph elements while most web prose sits in divs, table cells, or spans. Text is now taken from any block holding it, and coverage is measured excluding nav, header, and footer chrome.

Can sb_import rebuild forms and embedded videos from a source site?▼

Forms are recorded with field counts and labels but rebuilt via sb_store's form action, which owns the 17 templates. Iframes map to video, youtube, vimeo, soundcloud, and google-map elements using IDs or embed URLs.

What are the limitations of icon detection during page import?▼

Icons are only created when a name resolves against the generated ICON_NAMES manifest of 3,227 RemixIcon ids, tried as itself, Line, and Fill variants. Anything unresolved is skipped deliberately, since a confident wrong icon is indistinguishable from a right one.