chrome-devtools-axi 0.1.0 → 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +121 -0
  2. package/package.json +3 -3
package/README.md ADDED
@@ -0,0 +1,121 @@
1
+ # chrome-devtools-axi
2
+
3
+ [![CI](https://github.com/kunchenguid/chrome-devtools-axi/actions/workflows/ci.yml/badge.svg)](https://github.com/kunchenguid/chrome-devtools-axi/actions/workflows/ci.yml)
4
+ [![Release](https://github.com/kunchenguid/chrome-devtools-axi/actions/workflows/release-please.yml/badge.svg)](https://github.com/kunchenguid/chrome-devtools-axi/actions/workflows/release-please.yml)
5
+ ![Platform](https://img.shields.io/badge/platform-macOS%20%7C%20Linux%20%7C%20Windows-blue)
6
+ [![X](https://img.shields.io/badge/X-@kunchenguid-black?logo=x)](https://x.com/kunchenguid)
7
+
8
+ <h3 align="center">Highly agent-ergonomic browser automation</h3>
9
+
10
+ `chrome-devtools-axi` wraps [chrome-devtools-mcp](https://www.npmjs.com/package/chrome-devtools-mcp) with an [AXI](https://axi.md)-compliant CLI. Every command returns a compact accessibility snapshot with just enough context and a hint about what to do next.
11
+
12
+ - **Token-efficient** — TOON-encoded output cuts token usage ~40% vs raw JSON
13
+ - **Combined operations** — one command navigates, captures, and suggests next steps
14
+ - **Contextual suggestions** — every response includes actionable next-step hints
15
+
16
+ ## Quick Start
17
+
18
+ ```sh
19
+ $ chrome-devtools-axi open https://example.com
20
+ page: {title: "Example Domain", url: "https://example.com", refs: 1}
21
+ snapshot:
22
+ RootWebArea "Example Domain"
23
+ heading "Example Domain"
24
+ paragraph "This domain is for use in illustrative examples..."
25
+ uid=1 link "More information..."
26
+ help[1]:
27
+ Run `chrome-devtools-axi click @1` to click the "More information..." link
28
+
29
+ $ chrome-devtools-axi click @1
30
+ page: {title: "IANA — IANA-Managed Reserved Domains", refs: 12}
31
+ snapshot:
32
+ ...
33
+ ```
34
+
35
+ ## Install
36
+
37
+ **npm**
38
+
39
+ ```sh
40
+ npm install -g chrome-devtools-axi
41
+ ```
42
+
43
+ **From source**
44
+
45
+ ```sh
46
+ git clone https://github.com/kunchenguid/chrome-devtools-axi.git
47
+ cd chrome-devtools-axi
48
+ npm install && npm run build
49
+ npm link
50
+ ```
51
+
52
+ ## How It Works
53
+
54
+ ```
55
+ ┌───────────────────────┐
56
+ │ chrome-devtools-axi │ CLI — parse args, format output
57
+ └──────────┬────────────┘
58
+ │ HTTP (localhost:9224)
59
+
60
+ ┌───────────────────────┐
61
+ │ Bridge Server │ Persistent process, manages MCP session
62
+ └──────────┬────────────┘
63
+ │ stdio
64
+
65
+ ┌───────────────────────┐
66
+ │ chrome-devtools-mcp │ Headless Chrome via DevTools Protocol
67
+ └───────────────────────┘
68
+ ```
69
+
70
+ - **Persistent bridge** — a detached process keeps the MCP session alive across commands, so Chrome doesn't restart every invocation
71
+ - **Auto-lifecycle** — the bridge starts on first command and writes a PID file to `~/.chrome-devtools-axi/bridge.pid`
72
+ - **Snapshot parsing** — accessibility tree snapshots are extracted and analyzed for interactive elements (`uid=` refs)
73
+ - **TOON encoding** — structured metadata uses [TOON format](https://www.npmjs.com/package/@toon-format/toon) for compact, token-efficient output
74
+
75
+ ## CLI Reference
76
+
77
+ | Command | Description |
78
+ | -------------------- | ----------------------------------- |
79
+ | `open <url>` | Navigate to URL and snapshot |
80
+ | `snapshot` | Capture current page state |
81
+ | `click @<uid>` | Click an element by ref |
82
+ | `fill @<uid> <text>` | Fill a form field |
83
+ | `type <text>` | Type text at current focus |
84
+ | `press <key>` | Press a keyboard key |
85
+ | `scroll <dir>` | Scroll: up, down, top, bottom |
86
+ | `back` | Navigate back |
87
+ | `wait <ms\|text>` | Wait for time or text to appear |
88
+ | `eval <js>` | Evaluate JavaScript in page context |
89
+ | `start` | Start the bridge server |
90
+ | `stop` | Stop the bridge server |
91
+
92
+ Running with no command is equivalent to `snapshot`.
93
+
94
+ ### Flags
95
+
96
+ | Flag | Description |
97
+ | -------- | ---------------------- |
98
+ | `--help` | Show usage information |
99
+
100
+ ## Configuration
101
+
102
+ The bridge server port defaults to `9224`. Override it with an environment variable:
103
+
104
+ ```sh
105
+ export CHROME_DEVTOOLS_AXI_PORT=9225
106
+ ```
107
+
108
+ State is stored in `~/.chrome-devtools-axi/`:
109
+
110
+ | File | Purpose |
111
+ | ------------ | ---------------------------------- |
112
+ | `bridge.pid` | PID and port of the running bridge |
113
+
114
+ ## Development
115
+
116
+ ```sh
117
+ npm run build # Compile TypeScript to dist/
118
+ npm run dev # Run CLI directly with tsx
119
+ npm test # Run tests with vitest
120
+ npm run test:watch # Run tests in watch mode
121
+ ```
package/package.json CHANGED
@@ -1,11 +1,11 @@
1
1
  {
2
2
  "name": "chrome-devtools-axi",
3
- "version": "0.1.0",
3
+ "version": "0.1.1",
4
4
  "description": "AXI-compliant chrome-devtools-mcp wrapper — combined operations, TOON output, contextual suggestions",
5
5
  "type": "module",
6
6
  "repository": {
7
7
  "type": "git",
8
- "url": "https://github.com/kunchenguid/chrome-devtools-axi.git"
8
+ "url": "git+https://github.com/kunchenguid/chrome-devtools-axi.git"
9
9
  },
10
10
  "keywords": [
11
11
  "chrome",
@@ -18,7 +18,7 @@
18
18
  "mcp"
19
19
  ],
20
20
  "bin": {
21
- "chrome-devtools-axi": "./dist/bin/chrome-devtools-axi.js"
21
+ "chrome-devtools-axi": "dist/bin/chrome-devtools-axi.js"
22
22
  },
23
23
  "files": [
24
24
  "dist",