skills.rest
tmchow
tmchowCOMMUNITY
Explore all skills by this author →
Website𝕏@trevinGitHub

chrome-devtools-axi

Automates browser tasks via Chrome DevTools Protocol with accessibility snapshots and performance diagnostics.

60|4|Updated May 20, 2026
Search Tags:#accessibility#browser automation#screenshot#Chrome DevTools Protocol#performance tracing
One-click install
npx skills add https://github.com/tmchow/agent-skills --skill chrome-devtools-axi
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: chrome-devtools-axi
Source: https://github.com/tmchow/agent-skills/tree/main/chrome-devtools-axi
Command: npx skills add https://github.com/tmchow/agent-skills --skill chrome-devtools-axi

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

This Skill provides automation of complex browser tasks using Chrome DevTools Protocol, allowing for accessibility snapshots, interactive actions, and performance insights without manual intervention.

Core Features & Use Cases

  • Accessibility Snapshots: Generate compact accessibility snapshots with actionable element references.
  • Page Interaction: Automate clicks, form submissions, typing, and more.
  • Performance Insights: Capture screenshots, inspect console and network, and run performance traces.
  • Use Case: If you need to automatically verify a web application's accessibility and performance, this skill can automate the capture of snapshots, clicks, and performance data, saving time in manual testing.

Quick Start

Execute a task like taking a screenshot of a specific element using the command 'npx chrome-devtools-axi screenshot @<uid>'.

Frequently Asked Questions about chrome-devtools-axi

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

FAQPage Schema
How do I automate browser accessibility snapshots using Chrome DevTools Protocol?▼

Automating browser accessibility snapshots with Chrome DevTools Protocol generates compact trees with actionable element references. This enables automated accessibility checks without manual inspection, capturing interactive page elements for testing workflows.

Can I automate page interactions and clicks through Chrome DevTools Protocol?▼

Page interactions like clicks, form submissions, and typing can be fully automated through Chrome DevTools Protocol. This allows scripts to replicate user behavior for automated testing without manual browser intervention.

What is the best way to capture performance traces and screenshots during browser automation?▼

Capturing performance traces and screenshots during browser automation is best handled by executing Chrome DevTools Protocol commands. This simultaneously records console activity, network requests, and performance metrics for diagnostic insights.

Do I need a local Chrome instance to run Chrome DevTools Protocol automation scripts?▼

A local bridge to a running Chrome instance is required to execute Chrome DevTools Protocol automation scripts. This connection allows the framework to send commands and receive accessibility or performance data directly.

How do I take a screenshot of a specific element during automated web testing?▼

Taking a screenshot of a specific element during automated web testing uses a command targeting the element's unique identifier. This captures the visual state of individual page components for automated verification.

Related Skills

Explore More Software Engineering Skills→
mxyhimxyhi
467

chrome-cdp

Control local Chrome sessions via the Chrome DevTools Protocol.

Community
Intermediate
ajianazajianaz
4

flutter-ui-ux

Build responsive Flutter UI components with animations and theming.

Community
Advanced
apexradiusapexradius

browser-test

Automate visual testing of web applications using Chrome DevTools.

Official
Advanced
HsnSaboorHsnSaboor

chrome-devtools

Automate browser tasks with Puppeteer scripts for screenshots, PDFs, and scraping.

Community
Advanced