skills.rest
liuzhengdongfortest
liuzhengdongfortestCOMMUNITY
Explore all skills by this author →
GitHub

browser-bridge

Control a real Chrome browser to extract structured web data and rendered component evidence.

1|Updated May 7, 2026
Search Tags:#web automation#browser control#javascript execution#page scraping#component evidence#spa extraction#dom diff
One-click install
npx skills add https://github.com/liuzhengdongfortest/skills --skill browser-bridge
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: browser-bridge
Source: https://github.com/liuzhengdongfortest/skills/tree/main/browser-bridge
Command: npx skills add https://github.com/liuzhengdongfortest/skills --skill browser-bridge

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires bs4, simple-websocket-server, bottle, requests, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

Browser Bridge removes the guesswork and token waste of scraping by letting an agent operate a real Chrome browser, then returning structured results, DOM diffs, and rendered component evidence instead of full raw HTML dumps.

Core Features & Use Cases

  • Real browser automation (Chrome extension + JS execution): Navigate, click, fill forms, scroll, run arbitrary JavaScript, and interact with dynamic SPA content.
  • Structured extraction with change awareness: Capture JavaScript return values, transient toast/notification text, new tabs, and a DOM change summary to reduce re-scanning.
  • Token-efficient page scanning: Produce simplified HTML or text-only views, with options to wait for SPA selectors and to return size-only for quick render checks.
  • Rendered component evidence export: For UI components where screenshots are insufficient, export DOM structure plus computed styles and screenshots of both the full page and the selected component.

Quick Start

Tell your agent: Run browser-bridge navigate to open https://example.com, then scan the page with text-only output.

Frequently Asked Questions about browser-bridge

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

FAQPage Schema
How do I extract structured data from dynamic SPA web pages without scraping raw HTML?▼

Extracting structured data from dynamic SPA web pages involves controlling a real Chrome browser to execute in-page JavaScript. This returns structured results, DOM diffs, and component evidence instead of raw HTML dumps.

Can I capture UI component evidence like computed styles and screenshots during web automation?▼

Capturing UI component evidence during web automation is supported by exporting rendered outerHTML, computed styles, anatomy, and screenshots of both the full page and the selected component.

What is the best way to detect DOM changes and transient notifications in single page applications?▼

Detecting DOM changes and transient notifications in SPAs is achieved through DOM diff monitoring during JavaScript execution, which captures transient toast text, new tabs, and DOM change summaries.

Does this browser automation approach support token-efficient page scanning for large web applications?▼

Browser automation supports token-efficient page scanning by producing simplified HTML or text-only views, offering options to wait for SPA selectors and return size-only checks for quick renders.

How do I automate form filling and clicking across arbitrary websites and tabs?▼

Automating form filling and clicking across arbitrary websites and tabs requires controlling a real Chrome browser via a dedicated extension, enabling navigation, SPA-aware waiting, and structured extraction.

Related Skills

Explore More Software Engineering Skills→
matsuni-kkmatsuni-kk

browser-controller

Control web browsers via Chrome extension and WebSocket communication.

Community
Advanced
lucasmccomblucasmccomb

design-review

Capture multi-viewport screenshots and analyze DOM, CSS, and computed styles for design issues.

Community
Advanced
poz110poz110
4

monitor

Monitor workflow progress in real-time via HTTP and WebSocket.

Community
Intermediate
okwindsokwinds
50

headless-web-viewer

Render JavaScript-heavy webpages and extract visible text with Playwright.

Community
Intermediate