web-browser

Automate Chrome/Chromium via CDP to navigate, click, fill forms, evaluate JavaScript, and capture screenshots.

66|2|Updated Feb 18, 2015
One-click install
npx skills add https://github.com/tkersey/dotfiles --skill web-browser-tkersey
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-browser
Source: https://github.com/tkersey/dotfiles/tree/main/codex/skills/web-browser
Command: npx skills add https://github.com/tkersey/dotfiles --skill web-browser-tkersey

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires puppeteer-core.

What problem does it solve?

Automating interactions with live web pages in a real browser can be flaky and brittle. This skill provides a reliable, programmable way to drive a Chrome/Chromium session via the Chrome DevTools Protocol, enabling deterministic navigation, clicking, form filling, evaluating JavaScript, and screenshot capture.

Core Features & Use Cases

  • Real-browser automation: Navigate pages, click elements, fill forms, and run JavaScript in a Chrome/Chromium context.
  • Testing and scraping: Validate UI behavior or extract data from live sites with visual verification via screenshots.
  • Deterministic targeting: Manage the active tab reliably; supports opening a new tab when needed to avoid session drift.

Quick Start

Start a Chrome instance with CDP, connect via puppeteer-core, and use the provided tools to drive interactions:

  • Start the CDP server: ./tools/start.js
  • Open a page in a deterministic tab: ./tools/nav.js https://example.com --new
  • Evaluate an expression in the page: ./tools/eval.js 'document.title'
  • Capture a screenshot: ./tools/screenshot.js

Frequently Asked Questions about web-browser

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

FAQPage Schema
How do I automate Chrome browser tasks like form filling and clicking?

Chrome browser automation is achieved by driving a Chrome/Chromium session via the Chrome DevTools Protocol to navigate pages, click elements, fill forms, and run JavaScript.

How do I capture a screenshot during web testing?

You capture a screenshot during web testing by connecting to a local Chrome instance via Chrome CDP, navigating to the target page in a deterministic tab, and executing a screenshot tool.

Do I need a local Chrome instance to use puppeteer-core for UI automation?

Yes, UI automation with puppeteer-core requires a local Chrome or Chromium instance running with a Chrome DevTools Protocol server to establish a reliable browser connection.

How do I prevent session drift when automating multiple browser tabs?

To prevent session drift during web browser automation, manage the active tab deterministically by explicitly opening a new tab when needed to avoid session drift.

What is the best way to validate UI behavior in a real browser context?

Validating UI behavior in a real browser context involves using puppeteer-core to programmatically drive Chrome, executing interactions, and capturing screenshots for visual verification.

Why does my web scraping script fail when evaluating JavaScript on live pages?

Web scraping scripts evaluating JavaScript on live pages can fail due to flaky connections; using the Chrome DevTools Protocol ensures deterministic execution within an active Chrome tab.