A specialized technical framework for mastering Chrome DevTools Protocol automation and Manifest V3 extension development.
Install & Download
1. ClawHub CLI
The fastest way to install a skill directly from the registry.
npx clawhub@latest install chrome
2. Manual Installation
Copy the skill folder to one of these locations
~/.openclaw/skills/ <project>/skills/ Priority: Workspace > Local > Bundled
3. Prompt Installation
Copy this prompt to OpenClaw to install it automatically.
Help me install chrome using Clawhub. If Clawhub is not installed, install it first (npm i -g clawhub).
Prefer to download?
Get the raw skill files in a ZIP archive.
What is Chrome DevTools & Extension Power-Suite?
This skill provides a comprehensive set of patterns and best practices for interacting with the Google Chrome environment at a deep level. It covers the intricacies of the Chrome DevTools Protocol (CDP), ensuring reliable browser automation by handling asynchronous commands and WebSocket connections correctly. Additionally, it serves as a definitive resource for Manifest V3 extension development, addressing the shift to service workers and asynchronous storage. By integrating these patterns into Openclaw Skills, developers can build more robust web tools and automated workflows that are resilient to common automation failures.
Chrome DevTools & Extension Power-Suite Use Cases
- Automating browser interactions using the Chrome DevTools Protocol (CDP).
- Building and debugging Chrome extensions using the Manifest V3 standard.
- Detecting specific browser contexts to differentiate between Google Chrome, Edge, and Brave.
- Monitoring and optimizing web performance through layout thrash detection and memory API usage.
- Implementing advanced network debugging and request interception for security testing.
How Chrome DevTools & Extension Power-Suite Works
- Fetch the active tab WebSocket URL from the local debugger list rather than connecting to the browser root directly.
- Enable required CDP domains such as Runtime and Page before executing evaluation or navigation commands to ensure proper event emission.
- Use Promise-based wrappers with response ID tracking to manage the asynchronous lifecycle of browser commands.
- Implement Manifest V3 patterns by utilizing service workers for background logic and chrome.storage.local for persistent state management.
- Verify execution environments using runtime context detection to apply the correct API sets for extensions versus regular web pages.
Chrome DevTools & Extension Power-Suite Setup
To begin using this skill within your Openclaw Skills environment, ensure Chrome is running with remote debugging enabled:
google-chrome --remote-debugging-port=9222
Confirm your extension manifest is configured for V3 and that permissions are split correctly between host and API access. Ensure your automation scripts target the specific tab URL found at http://localhost:9222/json/list to establish a stable CDP connection.
Chrome DevTools & Extension Power-Suite Data Schema & Taxonomy
The skill organizes technical data and configurations according to the following schema:
| Component | Format | Description |
|---|---|---|
| CDP Communication | JSON-RPC | Methods and parameters for WebSocket commands like Page.navigate. |
| Extension Manifest | Manifest V3 JSON | Structure for permissions, service workers, and content scripts. |
| Context Fingerprint | JavaScript Object | Detection logic for vendor strings and runtime IDs. |
| Network Interception | Interception Stage | Rules for blocking or modifying requests before navigation. |
| Performance Data | PerformanceEntry Array | Metrics for paint timing, layout shifts, and memory heap size. |
Chrome DevTools & Extension Power-Suite Advanced Features
- High-DPI screenshot capture using surface scaling and scale parameters for Retina displays.
- Granular network request interception with custom error reasons like BlockedByClient.
- Advanced layout thrash detection via PerformanceObserver to flag entries exceeding 16.67ms.
- Secure context validation to ensure compatibility with File System and Clipboard APIs.
- Cross-context communication patterns using window.postMessage for content script and page isolation.
SKILL.md
Loading
Related Openclaw Skills
CHRO / Chief Human Resources Officer
An AI-powered HR leadership skill for managing hiring pipelines, legal compliance, compensation strategies, and workforce analytics.
China Travel Expert
A comprehensive travel intelligence skill providing deep regional coverage, logistical planning, and local expertise for navigating China.
Chemistry
An adaptive AI skill designed to assist with chemistry learning, lab safety, and molecular research for all expertise levels.
Chef
A professional-grade culinary assistant skill for managing recipes, techniques, and dietary adaptations with technical precision.
CI-CD Automation Skill
A comprehensive automation skill for managing continuous integration and continuous deployment pipelines across web, mobile, and backend stacks.
Chief Information Officer (CIO)
A comprehensive strategic framework for AI agents to drive digital transformation, manage vendor relations, and govern enterprise technology architecture.
Featured*
