browser-tools

Automate browser interactions via Chrome DevTools Protocol on port 9222.

Updated Mar 14, 2026
One-click install
npx skills add https://github.com/pramudityad/pi-config --skill browser-tools-pramudityad
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: browser-tools
Source: https://github.com/pramudityad/pi-config/tree/main/skills/pi-skills/browser-tools
Command: npx skills add https://github.com/pramudityad/pi-config --skill browser-tools-pramudityad

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @mozilla/readability, cheerio, jsdom, puppeteer, puppeteer-core, puppeteer-extra, puppeteer-extra-plugin-stealth, turndown, turndown-plugin-gfm, and includes scripts (resource) components.

What problem does it solve?

This Skill allows for programmatic interaction with web pages, enabling automation of browser tasks, frontend testing, and data extraction from dynamic web content.

Core Features & Use Cases

  • Navigate and Interact: Open URLs, click elements, fill forms, and execute JavaScript.
  • Data Extraction: Scrape readable content, extract specific elements, and retrieve cookies.
  • Visual Debugging: Take screenshots for visual inspection and debugging.
  • Use Case: Automate the process of logging into a website, filling out a form, and submitting it, or scrape product details from an e-commerce site.

Quick Start

Use the browser-tools skill to navigate to https://example.com and then evaluate the document title.

Frequently Asked Questions about browser-tools

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

FAQPage Schema
How do I automate web page interaction and frontend testing using Chrome DevTools Protocol?

You can automate web page interaction using the Chrome DevTools Protocol by connecting to a running Chrome instance with remote debugging enabled on port 9222. This enables navigation, JavaScript evaluation, element picking, and screenshot capture for testing.

How do I scrape dynamic web content and extract readable text from web pages?

To scrape dynamic web content, you can automate browser navigation to load the page and then extract readable content. The Skill uses Readability and Cheerio to parse the rendered DOM and retrieve specific elements or article text.

Do I need a running Chrome instance to execute browser automation scripts?

Yes, browser automation requires a running Chrome instance. You must launch Chrome with remote debugging enabled on port 9222 before executing any navigation, JavaScript evaluation, or element interaction tasks.

Can I use Puppeteer to fill out forms and capture screenshots for visual debugging?

Yes, Puppeteer facilitates form filling and visual debugging. You can programmatically interact with web pages to input data, click elements, and capture screenshots directly through the Chrome DevTools Protocol connection.

What is the best way to extract cookies and evaluate JavaScript during web scraping?

The best way to extract cookies and evaluate JavaScript is by connecting to the Chrome DevTools Protocol. This allows direct execution of JavaScript within the page context and inspection of browser cookies during your scraping workflow.

How do I convert extracted HTML content to Markdown for web scraping workflows?

You can convert extracted HTML content to Markdown using the Turndown library. After scraping readable content from the web page via Puppeteer, Turndown with the GitHub Flavored Markdown plugin transforms the HTML output into structured Markdown.