browser-exec-live-site-capture

Extract exact UI state from live web apps using browser automation.

Updated Aug 21, 2026
One-click install
npx skills add https://github.com/TylerSimons1127/vibe --skill browser-exec-live-site-capture-tylersimons1127
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: browser-exec-live-site-capture
Source: https://github.com/TylerSimons1127/vibe/tree/main/skills/browser-exec-live-site-capture
Command: npx skills add https://github.com/TylerSimons1127/vibe --skill browser-exec-live-site-capture-tylersimons1127

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Cloning, QA-ing, or reproducing a running web app requires the exact state users actually see — fixture data, conversation text, status pills, queue order, keyboard shortcuts — which curl and static HTML scraping miss when content is client-routed or rendered only after JavaScript runs. ## Core Features & Use Cases - Live Browser Capture: Drive a real browser session with goto_url, js evaluation, screenshots, and CDP calls to read rendered DOM state. - Reliable SPA Navigation Pattern: Click table rows by index and poll location.pathname instead of using fixed sleeps, avoiding stale reads after React router.push navigation. - State Pollution Prevention: Clear localStorage and cookies between captures so your own exploration does not alter what the site shows on later loads. - Use Case: When reverse-engineering a Next.js review queue, capture each lead's detail page by clicking rows in order, polling for navigation, and saving main.outerHTML per item to the workspace for a 1:1 clone. ## Quick Start Use browser_exec to open the live site, click through each table row while polling for navigation, and save the rendered HTML of every detail page to the workspace.

Frequently Asked Questions about browser-exec-live-site-capture

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

FAQPage Schema
How do I scrape data from a client-rendered React or Next.js app?▼

Use a browser automation harness like browser_exec with Playwright-style goto_url and js() evaluation to read the rendered DOM. Static curl requests miss client-routed content that only appears after JavaScript executes.

When should I use browser automation instead of curl for web scraping?▼

Use browser automation when data is interactive, client-routed, or only visible after a click or keypress. For static SSR HTML or marketing pages, curl plus tag-stripping is faster and sufficient.

Why does my scraper return stale or empty data after clicking a table row?▼

A fixed sleep after click() races the SPA navigation and reads the old page. Poll location.pathname until it changes, then read main.outerHTML, and re-navigate with goto_url each iteration instead of history.back().

Why does the live site show different content after I explore it?▼

Clicking through workflows that save to localStorage or cookies permanently changes what the site renders on later loads. Clear localStorage and delete cookies via CDP between captures, and always start from a clean load.

How do I test React keyboard shortcuts in browser automation?▼

Dispatch KeyboardEvent on window with bubbles set to true, since React keyboard handlers live on window. Dispatching on document alone misses the handler, and you should read state before dispatching again.