cbrowser 7.9.0 → 7.10.0

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.
package/README.md CHANGED
@@ -1,171 +1,23 @@
1
1
  # CBrowser (Cognitive Browser)
2
2
 
3
- **The browser automation built for AI agents, not human developers.**
4
-
5
- *CBrowser = Cognitive Browser — browser automation that thinks.*
6
-
7
- Most browser automation tools are built for humans writing scripts. CBrowser is built from the ground up as an MCP server for AI agents—natural language is the primary interface, not an afterthought.
3
+ AI-powered browser automation designed for MCP-based AI agents. Built on Playwright with session persistence, self-healing selectors, constitutional safety boundaries, and natural language as the primary interface.
8
4
 
9
5
  [![npm version](https://badge.fury.io/js/cbrowser.svg)](https://www.npmjs.com/package/cbrowser)
10
6
  [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
11
7
  [![MCP Ready](https://img.shields.io/badge/MCP-Remote%20%2B%20Local-blue)](https://modelcontextprotocol.io)
12
8
 
13
- ## The AI-Native Difference
9
+ ## Why CBrowser?
14
10
 
15
- Traditional automation tools were built for developers writing scripts. CBrowser was built for **AI agents operating autonomously**. This fundamental difference shapes everything:
11
+ Most browser automation libraries assume a human developer is writing and maintaining test scripts. When an AI agent needs to operate a browser autonomously across multiple calls, several problems arise:
16
12
 
17
- | Traditional Tools | CBrowser (AI-Native) |
18
- |-------------------|----------------------|
19
- | Scripts written by humans | Natural language as primary interface |
20
- | Stateless between calls | **Session persistence across calls** |
21
- | Manual test maintenance | **Self-healing selectors + AI test repair** |
22
- | Only does what you script | **Autonomous discovery (hunt_bugs)** |
23
- | Breaks when sites change | **Multi-dimensional baselines track drift** |
24
- | Single execution path | **Persona-based testing for real users** |
25
- | Fails silently | **Built-in chaos engineering for resilience** |
26
- | Developer perspective | **Constitutional safety for AI autonomy** |
13
+ - **State is lost between calls.** Standard Playwright/Puppeteer sessions are ephemeral. An agent that logs in during one call loses that session on the next call. CBrowser persists cookies, localStorage, and session state across invocations.
14
+ - **Selectors break silently.** When a site updates its DOM, CSS selectors stop working. CBrowser maintains a self-healing selector cache and generates alternative selectors automatically, so agents don't stall on stale selectors.
15
+ - **There's no safety boundary.** An autonomous agent with unrestricted browser access can submit forms, make purchases, or delete data. CBrowser classifies actions by risk level and enforces verification requirements for destructive operations.
16
+ - **Test maintenance is manual.** When tests break, someone has to figure out what changed and fix them. CBrowser can analyze failures, suggest repairs, and apply fixes automatically.
17
+ - **Natural language is bolted on.** Most tools accept CSS selectors natively and treat natural language as a convenience layer. CBrowser treats natural language as the primary input, which is what AI agents actually produce.
27
18
 
28
19
  ---
29
20
 
30
- ## 8 Things Only CBrowser Does
31
-
32
- ### 1. 🤖 AI-Native Architecture
33
-
34
- Built from the ground up as an MCP server for AI agents. Every tool is designed to be called by Claude, not scripted by developers. Natural language is the primary interface—not a wrapper around CSS selectors.
35
-
36
- ```bash
37
- # Remote MCP for Claude.ai
38
- https://cbrowser-mcp.wyldfyre.ai/mcp
39
-
40
- # Local MCP for Claude Desktop
41
- npx cbrowser mcp-server
42
- ```
43
-
44
- ### 2. 💬 Natural Language as First-Class Input
45
-
46
- Not just "convenience" natural language on top of selectors. The entire API is natural language native:
47
-
48
- ```bash
49
- npx cbrowser smart-click "the blue submit button in the checkout form"
50
- npx cbrowser fill "email field" "user@example.com"
51
- npx cbrowser assert "page shows order confirmation with total over $50"
52
- ```
53
-
54
- ### 3. 🔍 Autonomous Discovery (hunt_bugs)
55
-
56
- Most tools wait for you to tell them what to test. CBrowser proactively hunts for bugs:
57
-
58
- ```bash
59
- npx cbrowser hunt-bugs "https://your-site.com" --depth 3
60
- ```
61
-
62
- It explores your site autonomously, finding broken links, console errors, accessibility violations, and UX issues you didn't know to look for.
63
-
64
- ### 4. 💥 Built-in Chaos Engineering
65
-
66
- Inject failures to see how your site handles them:
67
-
68
- ```bash
69
- npx cbrowser chaos-test "https://your-site.com" \
70
- --inject network-slowdown,random-timeouts,failed-assets
71
- ```
72
-
73
- ### 5. 🔄 Self-Healing Selectors + AI Test Repair
74
-
75
- When elements change, CBrowser adapts automatically. When tests break, it repairs them:
76
-
77
- ```bash
78
- # Auto-repair broken tests
79
- npx cbrowser repair-tests broken-test.txt --auto-apply --verify
80
- ```
81
-
82
- ### 6. 📊 Multi-Dimensional Baselines
83
-
84
- Not just visual diffs—CBrowser tracks visual appearance AND performance metrics together:
85
-
86
- ```bash
87
- npx cbrowser visual-baseline "https://your-site.com" --with-performance
88
- npx cbrowser visual-compare --check-perf-regression
89
- ```
90
-
91
- ### 7. 👥 Persona-Based Testing
92
-
93
- Test as different user types with realistic human behavior:
94
-
95
- ```bash
96
- npx cbrowser compare-personas \
97
- --start "https://your-site.com" \
98
- --goal "Complete checkout" \
99
- --personas power-user,elderly-user,mobile-user,first-timer
100
- ```
101
-
102
- Each persona has realistic timing, error rates, and attention patterns.
103
-
104
- ### 8. 🗂️ Session Persistence Across Calls
105
-
106
- The killer feature for AI agents: state persists between invocations. Your AI agent can log in, do work across multiple calls, and maintain context—solving the statelessness problem that makes other tools impractical for agents.
107
-
108
- ```bash
109
- npx cbrowser session save "logged-in"
110
- # ... later, in a new session ...
111
- npx cbrowser session load "logged-in"
112
- ```
113
-
114
- ---
115
-
116
- ## Constitutional AI Safety
117
-
118
- CBrowser is the only browser automation with built-in ethical boundaries—critical when AI agents operate autonomously:
119
-
120
- | Zone | Actions | Behavior |
121
- |------|---------|----------|
122
- | 🟢 **Green** | Navigate, read, screenshot | Auto-execute |
123
- | 🟡 **Yellow** | Click buttons, fill forms | Log and proceed |
124
- | 🔴 **Red** | Submit, delete, purchase | **Requires verification** |
125
- | ⬛ **Black** | Bypass auth, inject scripts | **Never executes** |
126
-
127
- This isn't optional safety theater—it's how you give AI agents browser access without risking catastrophic actions.
128
-
129
- ---
130
-
131
- ## Feature Comparison
132
-
133
- ### AI-Native Capabilities (Only CBrowser)
134
-
135
- | Capability | CBrowser | Skyvern | Browser-Use | Playwright |
136
- |------------|:--------:|:-------:|:-----------:|:----------:|
137
- | **Built as MCP Server** | ✅ Native | ❌ | ❌ | ❌ |
138
- | **Remote MCP (claude.ai)** | ✅ | ❌ | ❌ | ❌ |
139
- | **Session persistence** | ✅ | ❌ | ❌ | Manual |
140
- | **Autonomous bug hunting** | ✅ | ❌ | ❌ | ❌ |
141
- | **Chaos engineering** | ✅ | ❌ | ❌ | ❌ |
142
- | **Constitutional safety** | ✅ | ❌ | ❌ | ❌ |
143
- | **Multi-persona testing** | ✅ | ❌ | ❌ | ❌ |
144
- | **AI test repair** | ✅ | ❌ | ❌ | ❌ |
145
- | **Visual + perf baselines** | ✅ | ❌ | ❌ | ❌ |
146
-
147
- ### Table Stakes (Everyone Has)
148
-
149
- | Feature | CBrowser | Others |
150
- |---------|:--------:|:------:|
151
- | Natural language selectors | ✅ | ✅ |
152
- | Self-healing selectors | ✅ | ✅ |
153
- | Screenshot capture | ✅ | ✅ |
154
- | Form filling | ✅ | ✅ |
155
-
156
- ---
157
-
158
- ## Also Included
159
-
160
- | Traditional Automation | CBrowser |
161
- |------------------------|----------|
162
- | Brittle CSS selectors | AI vision: "click the blue login button" |
163
- | Breaks when DOM changes | **Self-healing selectors** adapt automatically |
164
- | Crashes on element not found | **Smart retry** finds alternatives |
165
- | Manual test assertions | **Natural language assertions** |
166
- | Scripted tests only | **AI test generation** from page analysis |
167
- | Stateless between runs | **Persistent sessions, cookies, localStorage** |
168
-
169
21
  ## Quick Start
170
22
 
171
23
  ### Option 1: PAI Skill Installation (Claude Code Users)
@@ -240,128 +92,264 @@ npx cbrowser assert "page contains 'Welcome'"
240
92
  npx cbrowser generate-tests "https://example.com"
241
93
  ```
242
94
 
243
- ## v7.x Features
95
+ ---
96
+
97
+ ## Core Capabilities
244
98
 
245
- ### AI Visual Regression (v7.0)
99
+ ### Natural Language Interface
246
100
 
247
- Semantic screenshot comparison using AI—not just pixel diffs:
101
+ CBrowser accepts natural language descriptions for element selection, assertions, and test definitions. This is useful when AI agents need to interact with pages they haven't seen before, since they can describe what they want rather than knowing exact selectors.
248
102
 
249
103
  ```bash
250
- # Capture a baseline
251
- npx cbrowser ai-visual capture "https://example.com" --name homepage
104
+ npx cbrowser smart-click "the blue submit button in the checkout form"
105
+ npx cbrowser fill "email field" "user@example.com"
106
+ npx cbrowser assert "page shows order confirmation with total over $50"
107
+ ```
252
108
 
253
- # Compare against baseline
254
- npx cbrowser ai-visual test "https://staging.example.com" homepage --html
109
+ Element selection supports multiple strategies, tried in priority order:
255
110
 
256
- # List baselines
257
- npx cbrowser ai-visual list
111
+ ```bash
112
+ # Natural language (default)
113
+ cbrowser click "the main navigation menu"
114
+
115
+ # Accessibility-based (ARIA selectors)
116
+ cbrowser click "aria:button/Submit"
117
+
118
+ # Visual description
119
+ cbrowser click "visual:red button in header"
120
+
121
+ # Semantic type
122
+ cbrowser fill "semantic:email" "user@example.com"
123
+
124
+ # Fallback to CSS when needed
125
+ cbrowser click "css:#login-btn"
126
+ ```
127
+
128
+ ### Session Persistence
129
+
130
+ AI agents typically need multiple calls to complete a task (log in, navigate, fill a form, submit). CBrowser saves and restores browser state so agents can pick up where they left off.
131
+
132
+ ```bash
133
+ # Save session (cookies, localStorage, sessionStorage)
134
+ cbrowser session save "logged-in" --url "https://example.com"
135
+
136
+ # Load session in a later invocation
137
+ cbrowser session load "logged-in"
138
+
139
+ # List saved sessions with metadata
140
+ cbrowser session list
141
+
142
+ # Show detailed session info
143
+ cbrowser session show "logged-in"
144
+
145
+ # Manage sessions
146
+ cbrowser session cleanup --older-than 30
147
+ cbrowser session export "logged-in" --output session.json
148
+ cbrowser session import session.json --name "restored"
258
149
  ```
259
150
 
260
- The AI understands what changed semantically (button moved, text changed, new section added) rather than flagging every pixel difference.
151
+ ### Self-Healing Selectors
261
152
 
262
- ### Cross-Browser Visual Testing (v7.1)
153
+ When an element isn't found, CBrowser automatically:
154
+ 1. Checks its selector cache for known alternatives on that domain
155
+ 2. Generates alternative selectors (text variants, ARIA roles, attributes)
156
+ 3. Tries each alternative with configurable retry logic
157
+ 4. Caches working selectors for future use
263
158
 
264
- Compare rendering across Chrome, Firefox, and Safari:
159
+ This is particularly useful in CI/CD pipelines where site updates would otherwise break every test run.
265
160
 
266
161
  ```bash
267
- npx cbrowser cross-browser "https://example.com" --html
268
- npx cbrowser cross-browser "https://example.com" --browsers chromium,firefox,webkit
162
+ # Smart click with retry
163
+ npx cbrowser smart-click "Submit" --max-retries 5
164
+
165
+ # Navigate then click
166
+ npx cbrowser smart-click "Login" --url "https://example.com"
269
167
  ```
270
168
 
271
- ### Responsive Visual Testing (v7.2)
169
+ ```typescript
170
+ import { CBrowser } from 'cbrowser';
272
171
 
273
- Test across viewport sizes (mobile, tablet, desktop):
172
+ const browser = new CBrowser();
173
+ const result = await browser.smartClick("Submit Button", { maxRetries: 3 });
174
+
175
+ console.log(result.success); // true/false
176
+ console.log(result.finalSelector); // The selector that worked
177
+ console.log(result.attempts); // Array of all attempts
178
+ console.log(result.aiSuggestion); // AI suggestion if failed
179
+ ```
274
180
 
275
181
  ```bash
276
- npx cbrowser responsive "https://example.com" --html
277
- npx cbrowser responsive "https://example.com" --viewports mobile,tablet,desktop-lg
278
- npx cbrowser responsive viewports # list available presets
182
+ # View cache statistics
183
+ npx cbrowser heal-stats
184
+
185
+ # Clear the cache
186
+ npx cbrowser heal-clear
279
187
  ```
280
188
 
281
- ### A/B Visual Comparison (v7.3)
189
+ ### Constitutional Safety
190
+
191
+ When AI agents operate browsers autonomously, they need guardrails to prevent destructive actions. CBrowser classifies every action by risk level:
192
+
193
+ | Zone | Actions | Behavior |
194
+ |------|---------|----------|
195
+ | **Green** | Navigate, read, screenshot | Auto-execute |
196
+ | **Yellow** | Click buttons, fill forms | Log and proceed |
197
+ | **Red** | Submit, delete, purchase | Requires verification |
198
+ | **Black** | Bypass auth, inject scripts | Never executes |
282
199
 
283
- Compare two different URLs (staging vs production, old vs new design):
200
+ This means an AI agent can freely browse and gather information, but cannot accidentally submit a form or delete data without explicit verification. For testing scenarios where you need to override this:
284
201
 
285
202
  ```bash
286
- npx cbrowser ab "https://staging.example.com" "https://example.com" --html
287
- npx cbrowser ab "https://old.site.com" "https://new.site.com" --label-a "Old" --label-b "New"
203
+ cbrowser click "Delete Account" --force
288
204
  ```
289
205
 
290
- ### Modular Architecture (v7.4.1)
206
+ ---
291
207
 
292
- Tree-shakeable imports for smaller bundles:
208
+ ## Testing
293
209
 
294
- ```typescript
295
- // Import everything (unchanged)
296
- import { CBrowser, runVisualRegression, detectFlakyTests } from 'cbrowser';
210
+ ### Natural Language Test Suites
297
211
 
298
- // Import only what you need (modular)
299
- import { runVisualRegression, runCrossBrowserTest } from 'cbrowser/visual';
300
- import { runNLTestSuite, detectFlakyTests, repairTest } from 'cbrowser/testing';
301
- import { huntBugs, runChaosTest, findElementByIntent } from 'cbrowser/analysis';
302
- import { capturePerformanceBaseline, detectPerformanceRegression } from 'cbrowser/performance';
212
+ Write tests in plain English instead of code. Useful for QA teams or AI agents that need to define and run tests without writing Playwright scripts.
213
+
214
+ ```bash
215
+ # Run tests from a file
216
+ npx cbrowser test-suite login-test.txt --html
217
+
218
+ # Run inline tests
219
+ npx cbrowser test-suite --inline "go to https://example.com ; click login ; verify url contains /dashboard"
220
+
221
+ # Dry run (parse without executing)
222
+ npx cbrowser test-suite tests.txt --dry-run
223
+
224
+ # Fuzzy matching for assertions
225
+ npx cbrowser test-suite tests.txt --fuzzy-match
303
226
  ```
304
227
 
305
- | Module | Purpose |
306
- |--------|---------|
307
- | `cbrowser/visual` | Visual testing (regression, cross-browser, responsive, A/B) |
308
- | `cbrowser/testing` | Test automation (NL suites, repair, flaky detection, coverage) |
309
- | `cbrowser/analysis` | AI analysis (bug hunting, chaos testing, persona comparison) |
310
- | `cbrowser/performance` | Performance (baselines, regression detection) |
228
+ **Test file format:**
311
229
 
312
- ---
230
+ ```txt
231
+ # Test: Login Flow
232
+ go to https://example.com
233
+ click the login button
234
+ type "user@example.com" in email field
235
+ type "password123" in password field
236
+ click submit
237
+ verify url contains "/dashboard"
313
238
 
314
- ## v6.0.0 Features
239
+ # Test: Search Functionality
240
+ go to https://example.com/search
241
+ type "test query" in search box
242
+ click search button
243
+ verify page contains "results"
244
+ take screenshot
245
+ ```
246
+
247
+ **Supported instructions:**
315
248
 
316
- ### Multi-Persona Comparison
249
+ | Instruction | Examples |
250
+ |-------------|----------|
251
+ | **Navigate** | `go to https://...`, `navigate to https://...`, `open https://...` |
252
+ | **Click** | `click the login button`, `click submit`, `press Enter` |
253
+ | **Fill** | `type "value" in email field`, `fill username with "john"` |
254
+ | **Select** | `select "Option A" from dropdown` |
255
+ | **Scroll** | `scroll down`, `scroll up 5 times` |
256
+ | **Wait** | `wait 2 seconds`, `wait for "Loading" appears` |
257
+ | **Assert** | `verify page contains "Welcome"`, `verify url contains "/home"`, `verify title is "Dashboard"` |
258
+ | **Screenshot** | `take screenshot` |
317
259
 
318
- Run the same journey with multiple personas in parallel and compare results:
260
+ **Output options:**
319
261
 
320
262
  ```bash
321
- # Compare how different user types experience your site
322
- npx cbrowser compare-personas \
323
- --start "https://example.com" \
324
- --goal "Complete checkout" \
325
- --personas power-user,first-timer,elderly-user,mobile-user
263
+ # Continue after failures
264
+ npx cbrowser test-suite tests.txt --continue-on-failure
265
+
266
+ # Save JSON report
267
+ npx cbrowser test-suite tests.txt --output results.json
268
+
269
+ # Generate HTML report
270
+ npx cbrowser test-suite tests.txt --html
271
+ ```
272
+
273
+ **API usage:**
274
+
275
+ ```typescript
276
+ import { parseNLTestSuite, runNLTestSuite, formatNLTestReport } from 'cbrowser';
326
277
 
327
- # Output:
328
- # ┌─────────────────┬──────────┬──────────┬──────────┬─────────────────┐
329
- # │ Persona │ Success Time │ Friction │ Key Issues │
330
- # ├─────────────────┼──────────┼──────────┼──────────┼─────────────────┤
331
- # power-user │ ✓ │ 12.5s │ 0 │ - │
332
- # first-timer │ ✓ │ 45.2s │ 2 │ Confusing CTA │
333
- # elderly-user │ ✗ │ 120.3s │ 5 │ Small buttons │
334
- # │ mobile-user │ ✓ │ 28.1s │ 1 │ Scroll issue │
335
- # └─────────────────┴──────────┴──────────┴──────────┴─────────────────┘
278
+ const suite = parseNLTestSuite(`
279
+ # Test: Homepage
280
+ go to https://example.com
281
+ verify title contains "Example"
282
+ click the about link
283
+ verify url contains "/about"
284
+ `, "My Test Suite");
285
+
286
+ const result = await runNLTestSuite(suite, {
287
+ continueOnFailure: true,
288
+ screenshotOnFailure: true,
289
+ });
290
+
291
+ console.log(formatNLTestReport(result));
336
292
  ```
337
293
 
338
- **Generate reports:**
294
+ ### Natural Language Assertions
295
+
296
+ Write assertions in plain English for use in scripts or standalone:
339
297
 
340
298
  ```bash
341
- # JSON report
342
- npx cbrowser compare-personas --start "..." --goal "..." --output report.json
299
+ # Title assertions
300
+ npx cbrowser assert "title contains 'Dashboard'"
301
+ npx cbrowser assert "title is 'Home Page'"
343
302
 
344
- # HTML report (visual dashboard)
345
- npx cbrowser compare-personas --start "..." --goal "..." --html
303
+ # URL assertions
304
+ npx cbrowser assert "url contains '/login'"
305
+
306
+ # Content assertions
307
+ npx cbrowser assert "page contains 'Welcome back'"
308
+
309
+ # Element assertions
310
+ npx cbrowser assert "'#submit-btn' exists"
311
+
312
+ # Count assertions
313
+ npx cbrowser assert "5 buttons"
314
+ npx cbrowser assert "3 links"
346
315
  ```
347
316
 
348
- **What you learn:**
349
- - Which personas struggle most (friction points)
350
- - Time differences between expert and beginner users
351
- - Mobile vs desktop experience gaps
352
- - Accessibility issues affecting specific user types
353
- - Actionable recommendations for improvement
317
+ ```typescript
318
+ const result = await browser.assert("page contains 'Success'");
319
+ console.log(result.passed); // true/false
320
+ console.log(result.message); // Human-readable result
321
+ console.log(result.actual); // What was found
322
+ console.log(result.expected); // What was expected
323
+ ```
324
+
325
+ ### AI Test Generation
354
326
 
355
- **Automatic recommendations:**
356
- - "Beginners take 3.5x longer than experts - consider adding more guidance"
357
- - "Mobile users experience 2x more friction - review mobile UX"
358
- - "Common friction: 'Button too small for touch', 'Form validation unclear'"
327
+ Analyze any page and generate test scenarios automatically. Useful for bootstrapping test coverage on existing sites.
359
328
 
360
- ## v6.2.0 Features
329
+ ```bash
330
+ # Generate tests for a page
331
+ npx cbrowser generate-tests "https://example.com"
332
+
333
+ # Output specific format
334
+ npx cbrowser generate-tests "https://example.com" --format playwright
335
+ npx cbrowser generate-tests "https://example.com" --format cbrowser
336
+
337
+ # Save to file
338
+ npx cbrowser generate-tests "https://example.com" --output tests.ts
339
+ ```
340
+
341
+ ```typescript
342
+ const result = await browser.generateTests("https://example.com");
343
+
344
+ console.log(result.analysis); // Page structure analysis
345
+ console.log(result.tests); // Generated test scenarios
346
+ console.log(result.playwrightCode); // Playwright test code
347
+ console.log(result.cbrowserScript); // CBrowser CLI script
348
+ ```
361
349
 
362
350
  ### AI Test Repair
363
351
 
364
- Automatically analyze failing tests and suggest or apply repairs:
352
+ When tests break due to site changes, CBrowser can analyze the failures and suggest or apply repairs automatically. This reduces the maintenance burden of large test suites.
365
353
 
366
354
  ```bash
367
355
  # Analyze a broken test and see repair suggestions
@@ -377,7 +365,7 @@ npx cbrowser repair-tests tests.txt --auto-apply --verify
377
365
  npx cbrowser repair-tests tests.txt --auto-apply --output fixed-tests.txt
378
366
  ```
379
367
 
380
- **What it analyzes:**
368
+ **Failure types and repair strategies:**
381
369
 
382
370
  | Failure Type | Detection | Repair Strategy |
383
371
  |--------------|-----------|-----------------|
@@ -386,24 +374,6 @@ npx cbrowser repair-tests tests.txt --auto-apply --output fixed-tests.txt
386
374
  | `timeout` | Step took too long | Add wait statements |
387
375
  | `element_not_interactable` | Element hidden/disabled | Add scroll/wait before interaction |
388
376
 
389
- **Example output:**
390
-
391
- ```
392
- 🔧 Analyzing test: Login Flow
393
-
394
- → click the signin button
395
- ✗ Failed: Failed to click: signin button
396
- 💡 Suggestions:
397
- - Update selector to "Login" (70%)
398
- → click "Login"
399
- - Add wait before this step (50%)
400
- → wait 2 seconds
401
-
402
- 📊 SUMMARY
403
- Total Failed Steps: 1
404
- Repair Success Rate: 100%
405
- ```
406
-
407
377
  **API usage:**
408
378
 
409
379
  ```typescript
@@ -416,17 +386,14 @@ const result = await repairTestSuite(suite, {
416
386
 
417
387
  console.log(formatRepairReport(result));
418
388
 
419
- // Export repaired test to file format
420
389
  for (const testResult of result.testResults) {
421
390
  console.log(exportRepairedTest(testResult));
422
391
  }
423
392
  ```
424
393
 
425
- ## v6.3.0 Features
426
-
427
394
  ### Flaky Test Detection
428
395
 
429
- Identify unreliable tests by running them multiple times and analyzing consistency:
396
+ Identify unreliable tests by running them multiple times and analyzing consistency. Useful for catching timing-sensitive tests before they cause CI failures.
430
397
 
431
398
  ```bash
432
399
  # Run tests 5 times (default) and detect flakiness
@@ -451,46 +418,6 @@ npx cbrowser flaky-check tests.txt --output flaky-report.json
451
418
  | **Per-Step Analysis** | Identifies which specific steps are unreliable |
452
419
  | **Duration Variance** | Detects timing-sensitive tests |
453
420
 
454
- **Example output:**
455
-
456
- ```
457
- 🔍 FLAKY TEST DETECTION REPORT
458
- ══════════════════════════════════════════════════════════════
459
-
460
- 📋 Suite: Login Tests
461
- Runs per test: 5
462
- Total duration: 45.2s
463
-
464
- ──────────────────────────────────────────────────────────────
465
- TEST RESULTS
466
- ──────────────────────────────────────────────────────────────
467
-
468
- ✅ STABLE_PASS (5/5 passed, flakiness: 0%)
469
- Login Flow
470
- └─ Avg duration: 2.1s (±0.1s)
471
-
472
- ⚠️ FLAKY (3/5 passed, flakiness: 80%)
473
- Search Functionality
474
- └─ Avg duration: 3.5s (±1.2s)
475
- └─ Flaky steps:
476
- • wait for "Loading" appears (60% flaky)
477
- • verify page contains "results" (40% flaky)
478
-
479
- ══════════════════════════════════════════════════════════════
480
- 📊 SUMMARY
481
- ══════════════════════════════════════════════════════════════
482
-
483
- ✅ Overall Flakiness: 40%
484
- Stable tests: 1 | Flaky tests: 1
485
-
486
- ⚠️ Most flaky test: Search Functionality (80%)
487
- ⚠️ Most flaky step: wait for "Loading" appears (60%)
488
-
489
- 💡 RECOMMENDATIONS
490
- • Search Functionality: Add explicit waits, increase timeout
491
- • wait for "Loading" appears: Use more specific selector
492
- ```
493
-
494
421
  **API usage:**
495
422
 
496
423
  ```typescript
@@ -506,220 +433,88 @@ const result = await detectFlakyTests(suite, {
506
433
 
507
434
  console.log(formatFlakyTestReport(result));
508
435
 
509
- // Access detailed analysis
510
436
  for (const test of result.testAnalyses) {
511
437
  if (test.isFlaky) {
512
438
  console.log(`${test.testName}: ${test.flakinessScore}% flaky`);
513
439
  for (const step of test.stepAnalysis) {
514
440
  if (step.isFlaky) {
515
- console.log(` └─ ${step.instruction}: ${step.flakinessScore}% flaky`);
441
+ console.log(` - ${step.instruction}: ${step.flakinessScore}% flaky`);
516
442
  }
517
443
  }
518
444
  }
519
445
  }
520
446
  ```
521
447
 
522
- ## v6.1.0 Features
523
-
524
- ### Natural Language Test Suites
525
-
526
- Write tests in plain English - CBrowser parses and executes them:
527
-
528
- ```bash
529
- # Run tests from a file
530
- npx cbrowser test-suite login-test.txt --html
531
-
532
- # Run inline tests (steps separated by semicolons)
533
- npx cbrowser test-suite --inline "go to https://example.com ; click login ; verify url contains /dashboard"
534
- ```
535
-
536
- **Test file format:**
537
-
538
- ```txt
539
- # Test: Login Flow
540
- go to https://example.com
541
- click the login button
542
- type "user@example.com" in email field
543
- type "password123" in password field
544
- click submit
545
- verify url contains "/dashboard"
546
-
547
- # Test: Search Functionality
548
- go to https://example.com/search
549
- type "test query" in search box
550
- click search button
551
- verify page contains "results"
552
- take screenshot
553
- ```
448
+ ---
554
449
 
555
- **Supported instructions:**
450
+ ## Visual Testing
556
451
 
557
- | Instruction | Examples |
558
- |-------------|----------|
559
- | **Navigate** | `go to https://...`, `navigate to https://...`, `open https://...` |
560
- | **Click** | `click the login button`, `click submit`, `press Enter` |
561
- | **Fill** | `type "value" in email field`, `fill username with "john"` |
562
- | **Select** | `select "Option A" from dropdown` |
563
- | **Scroll** | `scroll down`, `scroll up 5 times` |
564
- | **Wait** | `wait 2 seconds`, `wait for "Loading" appears` |
565
- | **Assert** | `verify page contains "Welcome"`, `verify url contains "/home"`, `verify title is "Dashboard"` |
566
- | **Screenshot** | `take screenshot` |
452
+ ### AI Visual Regression
567
453
 
568
- **Output options:**
454
+ Compare screenshots semantically rather than pixel-by-pixel. Traditional pixel diffing flags every minor rendering difference (anti-aliasing, font hinting). AI-based comparison understands what actually changed: a button moved, text was updated, a new section was added.
569
455
 
570
456
  ```bash
571
- # Continue after failures
572
- npx cbrowser test-suite tests.txt --continue-on-failure
573
-
574
- # Save JSON report
575
- npx cbrowser test-suite tests.txt --output results.json
576
-
577
- # Generate HTML report
578
- npx cbrowser test-suite tests.txt --html
579
-
580
- # Combined
581
- npx cbrowser test-suite tests.txt --output results.json --html
582
- ```
583
-
584
- **API usage:**
585
-
586
- ```typescript
587
- import { parseNLTestSuite, runNLTestSuite, formatNLTestReport } from 'cbrowser';
588
-
589
- const suite = parseNLTestSuite(`
590
- # Test: Homepage
591
- go to https://example.com
592
- verify title contains "Example"
593
- click the about link
594
- verify url contains "/about"
595
- `, "My Test Suite");
457
+ # Capture a baseline
458
+ npx cbrowser ai-visual capture "https://example.com" --name homepage
596
459
 
597
- const result = await runNLTestSuite(suite, {
598
- continueOnFailure: true,
599
- screenshotOnFailure: true,
600
- });
460
+ # Compare against baseline
461
+ npx cbrowser ai-visual test "https://staging.example.com" homepage --html
601
462
 
602
- console.log(formatNLTestReport(result));
603
- // Pass rate: 100%
604
- // Tests: 1 passed, 0 failed
463
+ # List baselines
464
+ npx cbrowser ai-visual list
605
465
  ```
606
466
 
607
- ## v5.0.0 Features
608
-
609
- ### Smart Click with Auto-Retry
467
+ ### Cross-Browser Visual Testing
610
468
 
611
- When an element isn't found, CBrowser automatically:
612
- 1. Checks the self-healing cache for known alternatives
613
- 2. Generates alternative selectors (text variants, ARIA roles, attributes)
614
- 3. Tries each alternative with configurable retry logic
615
- 4. Caches working selectors for future use
469
+ Compare how a page renders across Chrome, Firefox, and Safari to catch browser-specific layout issues:
616
470
 
617
471
  ```bash
618
- # Smart click with retry
619
- npx cbrowser smart-click "Submit" --max-retries 5
620
-
621
- # Navigate then click
622
- npx cbrowser smart-click "Login" --url "https://example.com"
472
+ npx cbrowser cross-browser "https://example.com" --html
473
+ npx cbrowser cross-browser "https://example.com" --browsers chromium,firefox,webkit
623
474
  ```
624
475
 
625
- ```typescript
626
- import { CBrowser } from 'cbrowser';
476
+ ### Responsive Visual Testing
627
477
 
628
- const browser = new CBrowser();
629
- const result = await browser.smartClick("Submit Button", { maxRetries: 3 });
630
-
631
- console.log(result.success); // true/false
632
- console.log(result.finalSelector); // The selector that worked
633
- console.log(result.attempts); // Array of all attempts
634
- console.log(result.aiSuggestion); // AI suggestion if failed
635
- ```
636
-
637
- ### Natural Language Assertions
638
-
639
- Write assertions in plain English:
478
+ Test across viewport sizes (mobile, tablet, desktop) to verify responsive layouts:
640
479
 
641
480
  ```bash
642
- # Title assertions
643
- npx cbrowser assert "title contains 'Dashboard'"
644
- npx cbrowser assert "title is 'Home Page'"
645
-
646
- # URL assertions
647
- npx cbrowser assert "url contains '/login'"
648
-
649
- # Content assertions
650
- npx cbrowser assert "page contains 'Welcome back'"
651
-
652
- # Element assertions
653
- npx cbrowser assert "'#submit-btn' exists"
654
-
655
- # Count assertions
656
- npx cbrowser assert "5 buttons"
657
- npx cbrowser assert "3 links"
658
- ```
659
-
660
- ```typescript
661
- const result = await browser.assert("page contains 'Success'");
662
- console.log(result.passed); // true/false
663
- console.log(result.message); // Human-readable result
664
- console.log(result.actual); // What was found
665
- console.log(result.expected); // What was expected
481
+ npx cbrowser responsive "https://example.com" --html
482
+ npx cbrowser responsive "https://example.com" --viewports mobile,tablet,desktop-lg
483
+ npx cbrowser responsive viewports # list available presets
666
484
  ```
667
485
 
668
- ### Self-Healing Selector Cache
486
+ ### A/B Visual Comparison
669
487
 
670
- CBrowser remembers which selectors work on each domain:
488
+ Compare two different URLs side by side (e.g., staging vs production, old design vs new):
671
489
 
672
490
  ```bash
673
- # View cache statistics
674
- npx cbrowser heal-stats
675
-
676
- # Clear the cache
677
- npx cbrowser heal-clear
678
- ```
679
-
680
- ```typescript
681
- const stats = browser.getSelectorCacheStats();
682
- console.log(stats.totalEntries); // 42
683
- console.log(stats.totalSuccesses); // 156
684
- console.log(stats.topDomains); // [{ domain: 'example.com', count: 15 }, ...]
491
+ npx cbrowser ab "https://staging.example.com" "https://example.com" --html
492
+ npx cbrowser ab "https://old.site.com" "https://new.site.com" --label-a "Old" --label-b "New"
685
493
  ```
686
494
 
687
- ### AI Test Generation
495
+ ---
688
496
 
689
- Analyze any page and generate test scenarios automatically:
497
+ ## Analysis
690
498
 
691
- ```bash
692
- # Generate tests for a page
693
- npx cbrowser generate-tests "https://example.com"
499
+ ### Autonomous Bug Hunting
694
500
 
695
- # Output specific format
696
- npx cbrowser generate-tests "https://example.com" --format playwright
697
- npx cbrowser generate-tests "https://example.com" --format cbrowser
501
+ Rather than waiting for you to specify what to test, `hunt_bugs` explores a site autonomously and reports issues it finds: broken links, console errors, accessibility violations, and UX problems.
698
502
 
699
- # Save to file
700
- npx cbrowser generate-tests "https://example.com" --output tests.ts
503
+ ```bash
504
+ npx cbrowser hunt-bugs "https://your-site.com" --depth 3
701
505
  ```
702
506
 
703
- ```typescript
704
- const result = await browser.generateTests("https://example.com");
507
+ ### Chaos Engineering
705
508
 
706
- console.log(result.analysis); // Page structure analysis
707
- console.log(result.tests); // Generated test scenarios
708
- console.log(result.playwrightCode); // Playwright test code
709
- console.log(result.cbrowserScript); // CBrowser CLI script
710
- ```
509
+ Inject controlled failures to verify how your site handles degraded conditions:
711
510
 
712
- **Example generated test:**
713
- ```typescript
714
- test('Login - Valid Credentials', async ({ page }) => {
715
- await page.goto('https://example.com');
716
- await page.locator('[name="email"]').fill('test@example.com');
717
- await page.locator('[name="password"]').fill('password123');
718
- await page.locator('button[type="submit"]').click();
719
- await expect(page).toHaveURL(/dashboard/);
720
- });
511
+ ```bash
512
+ npx cbrowser chaos-test "https://your-site.com" \
513
+ --inject network-slowdown,random-timeouts,failed-assets
721
514
  ```
722
515
 
516
+ This is useful for verifying error states, loading indicators, and graceful degradation before they happen in production.
517
+
723
518
  ### Page Analysis
724
519
 
725
520
  Understand any page's structure:
@@ -730,206 +525,202 @@ npx cbrowser analyze "https://example.com"
730
525
 
731
526
  Output:
732
527
  ```
733
- 📊 Page Analysis:
528
+ Page Analysis:
734
529
  Title: Example Domain
735
530
  Forms: 1
736
531
  - form#login (3 fields)
737
- 🔐 Login form detected
532
+ Login form detected
738
533
  Buttons: 5
739
534
  Links: 12
740
- Has Login:
741
- Has Search:
742
- Has Navigation:
535
+ Has Login: yes
536
+ Has Search: no
537
+ Has Navigation: yes
743
538
  ```
744
539
 
745
- ### MCP Server Integration
746
-
747
- CBrowser can run as an MCP server for both Claude Desktop (local) and claude.ai (remote).
540
+ ---
748
541
 
749
- #### Option 1: Remote MCP (claude.ai)
542
+ ## Persona-Based Testing
750
543
 
751
- Connect claude.ai directly to a remote CBrowser server:
544
+ Test your site from different user perspectives. Each persona has realistic timing, error rates, and attention patterns that simulate how different types of users actually interact with interfaces.
752
545
 
753
- 1. Deploy CBrowser on your server ([full guide](docs/REMOTE-MCP-SERVER.md))
754
- 2. In claude.ai: Settings Connectors Add Custom Connector
755
- 3. Add URL: `https://your-cbrowser-domain.com/mcp`
756
- 4. Configure OAuth with Auth0 ([setup guide](docs/AUTH0-SETUP.md))
546
+ ```bash
547
+ # Run an autonomous journey as a persona
548
+ cbrowser journey "first-timer" \
549
+ --start "https://mysite.com" \
550
+ --goal "Complete signup"
757
551
 
758
- **Public Demo (rate-limited):** `https://cbrowser-mcp-demo.wyldfyre.ai/mcp`
759
- - No authentication required
760
- - Rate limit: 5 requests/minute, burst of 10
761
- - For evaluation purposes only
552
+ # Compare how different user types experience the same flow
553
+ npx cbrowser compare-personas \
554
+ --start "https://example.com" \
555
+ --goal "Complete checkout" \
556
+ --personas power-user,first-timer,elderly-user,mobile-user
557
+ ```
762
558
 
763
- **Authenticated Server:** `https://cbrowser-mcp.wyldfyre.ai/mcp`
764
- - **OAuth 2.1 via Auth0** - For claude.ai web interface ([setup guide](docs/AUTH0-SETUP.md))
765
- - **API Key** - For Claude Code CLI and programmatic access
766
- - No rate limits for authenticated users
559
+ **Built-in Personas:**
767
560
 
768
- #### Option 2: Local MCP (Claude Desktop)
561
+ | Persona | Description |
562
+ |---------|-------------|
563
+ | `power-user` | Fast, efficient, uses keyboard shortcuts |
564
+ | `first-timer` | Slow, exploratory, reads everything |
565
+ | `mobile-user` | Touch interface, small screen |
566
+ | `elderly-user` | Larger text needs, slower interactions |
567
+ | `impatient-user` | Quick to abandon on friction |
769
568
 
770
- Run CBrowser locally for Claude Desktop:
569
+ **Example comparison output:**
771
570
 
772
- ```bash
773
- npx cbrowser mcp-server
571
+ ```
572
+ Persona | Success | Time | Friction | Key Issues
573
+ -----------------+---------+---------+----------+------------------
574
+ power-user | pass | 12.5s | 0 | -
575
+ first-timer | pass | 45.2s | 2 | Confusing CTA
576
+ elderly-user | fail | 120.3s | 5 | Small buttons
577
+ mobile-user | pass | 28.1s | 1 | Scroll issue
774
578
  ```
775
579
 
776
- Add to Claude Desktop config (`~/.config/claude-desktop/config.json`):
580
+ This helps identify which user groups struggle with your interface and where the friction points are, so you can prioritize UX improvements based on data rather than assumptions.
777
581
 
778
- ```json
779
- {
780
- "mcpServers": {
781
- "cbrowser": {
782
- "command": "npx",
783
- "args": ["cbrowser", "mcp-server"]
784
- }
785
- }
786
- }
787
- ```
582
+ **Custom persona creation:**
788
583
 
789
- #### Available MCP Tools (31 total)
584
+ ```bash
585
+ # Describe the user - AI generates appropriate parameters
586
+ npx cbrowser persona create "impatient developer who hates slow UIs" --name speed-demon
587
+ npx cbrowser persona create "elderly grandmother new to computers" --name grandma
790
588
 
791
- | Category | Tools |
792
- |----------|-------|
793
- | **Navigation** | `navigate`, `screenshot`, `extract` |
794
- | **Interaction** | `click`, `smart_click`, `fill`, `scroll`, `press_key` |
795
- | **Assertions** | `assert`, `analyze_page` |
796
- | **Testing** | `generate_tests`, `test_suite`, `repair_tests`, `flaky_check` |
797
- | **Visual** | `visual_baseline`, `visual_compare`, `responsive_test`, `cross_browser_test`, `ab_compare` |
798
- | **Personas** | `journey`, `compare_personas`, `create_persona`, `list_personas` |
799
- | **Sessions** | `save_session`, `load_session`, `list_sessions` |
800
- | **Analysis** | `hunt_bugs`, `chaos_test`, `performance_audit` |
801
- | **Utilities** | `heal_stats`, `list_baselines` |
589
+ # List all personas (built-in + custom)
590
+ npx cbrowser persona list
802
591
 
803
- See [Remote MCP Server Guide](docs/REMOTE-MCP-SERVER.md) for full deployment instructions.
592
+ # View, export, import, delete
593
+ npx cbrowser persona show speed-demon
594
+ npx cbrowser persona export speed-demon
595
+ npx cbrowser persona import custom-persona.json
596
+ npx cbrowser persona delete speed-demon
597
+ ```
804
598
 
805
- ## Core Features
599
+ The AI generates appropriate timing, error rates, mouse behavior, attention patterns, and viewport based on your description.
806
600
 
807
- ### AI-Powered Element Selection
601
+ **Generate reports:**
808
602
 
809
603
  ```bash
810
- # Natural language
811
- cbrowser click "the main navigation menu"
812
- cbrowser fill "password field" "secret123"
813
-
814
- # Accessibility-based
815
- cbrowser click "aria:button/Submit"
604
+ # JSON report
605
+ npx cbrowser compare-personas --start "..." --goal "..." --output report.json
816
606
 
817
- # Visual description
818
- cbrowser click "visual:red button in header"
607
+ # HTML report
608
+ npx cbrowser compare-personas --start "..." --goal "..." --html
609
+ ```
819
610
 
820
- # Semantic type
821
- cbrowser fill "semantic:email" "user@example.com"
611
+ ---
822
612
 
823
- # Fallback to CSS
824
- cbrowser click "css:#login-btn"
825
- ```
613
+ ## Performance
826
614
 
827
- ### Session Persistence
615
+ ### Performance Metrics
828
616
 
829
617
  ```bash
830
- # Save session (cookies, localStorage, sessionStorage)
831
- cbrowser session save "logged-in" --url "https://example.com"
832
-
833
- # Load session
834
- cbrowser session load "logged-in"
618
+ # Core Web Vitals
619
+ npx cbrowser perf "https://example.com"
835
620
 
836
- # List sessions
837
- cbrowser session list
621
+ # With budget
622
+ npx cbrowser perf audit "https://example.com" --budget-lcp 2500
838
623
  ```
839
624
 
840
- ### Persistent Browser Context
625
+ ### Performance Regression Detection
841
626
 
842
- Enable persistent mode to keep cookies and localStorage between CLI calls:
627
+ Track performance baselines and detect regressions with configurable sensitivity to avoid false positives:
843
628
 
844
629
  ```bash
845
- npx cbrowser navigate "https://example.com" --persistent
846
- ```
630
+ npx cbrowser visual-baseline "https://your-site.com" --with-performance
631
+ npx cbrowser visual-compare --check-perf-regression
847
632
 
848
- ### Persona-Driven Testing
633
+ # Sensitivity profiles: strict (CI/CD), normal (default), lenient (development)
634
+ npx cbrowser perf-regression "https://example.com" baseline.json --sensitivity strict
635
+ ```
849
636
 
850
- ```bash
851
- # Run autonomous journey as a persona
852
- cbrowser journey "first-timer" \
853
- --start "https://mysite.com" \
854
- --goal "Complete signup"
637
+ ---
855
638
 
856
- # List personas
857
- cbrowser persona list
858
- ```
639
+ ## Modular Architecture
859
640
 
860
- **Built-in Personas:**
641
+ CBrowser is split into tree-shakeable modules so you can import only what you need:
861
642
 
862
- | Persona | Description |
863
- |---------|-------------|
864
- | `power-user` | Tech-savvy, expects efficiency |
865
- | `first-timer` | New user, slow and exploratory |
866
- | `mobile-user` | Touch interface, small screen |
867
- | `elderly-user` | Vision/motor limitations |
868
- | `impatient-user` | Quick to abandon |
643
+ ```typescript
644
+ // Import everything
645
+ import { CBrowser, runVisualRegression, detectFlakyTests } from 'cbrowser';
869
646
 
870
- **AI Persona Creation (v5.3.0):**
647
+ // Import specific modules
648
+ import { runVisualRegression, runCrossBrowserTest } from 'cbrowser/visual';
649
+ import { runNLTestSuite, detectFlakyTests, repairTest } from 'cbrowser/testing';
650
+ import { huntBugs, runChaosTest, findElementByIntent } from 'cbrowser/analysis';
651
+ import { capturePerformanceBaseline, detectPerformanceRegression } from 'cbrowser/performance';
652
+ ```
871
653
 
872
- Create custom personas from natural language descriptions:
654
+ | Module | Purpose |
655
+ |--------|---------|
656
+ | `cbrowser/visual` | Visual testing (regression, cross-browser, responsive, A/B) |
657
+ | `cbrowser/testing` | Test automation (NL suites, repair, flaky detection, coverage) |
658
+ | `cbrowser/analysis` | AI analysis (bug hunting, chaos testing, persona comparison) |
659
+ | `cbrowser/performance` | Performance (baselines, regression detection) |
873
660
 
874
- ```bash
875
- # Describe the user - AI generates all parameters
876
- npx cbrowser persona create "impatient developer who hates slow UIs" --name speed-demon
877
- npx cbrowser persona create "elderly grandmother new to computers with tremors" --name grandma
878
- npx cbrowser persona create "distracted teenager on their phone"
661
+ ---
879
662
 
880
- # List all personas (built-in + custom)
881
- npx cbrowser persona list
663
+ ## MCP Server Integration
882
664
 
883
- # View full persona config
884
- npx cbrowser persona show speed-demon
665
+ CBrowser runs as an MCP server for both Claude Desktop (local) and claude.ai (remote).
885
666
 
886
- # Export/import for sharing
887
- npx cbrowser persona export speed-demon
888
- npx cbrowser persona import custom-persona.json
667
+ ### Remote MCP (claude.ai)
889
668
 
890
- # Delete custom persona
891
- npx cbrowser persona delete speed-demon
892
- ```
669
+ Connect claude.ai directly to a remote CBrowser server:
893
670
 
894
- The AI analyzes your description and generates appropriate:
895
- - **Timing**: reaction times, click delays, typing speed
896
- - **Error rates**: misclicks, typos, accidental double-clicks
897
- - **Mouse behavior**: movement speed, jitter, overshoot
898
- - **Attention patterns**: reading style, scroll behavior, focus areas
899
- - **Viewport**: device-appropriate screen size
671
+ 1. Deploy CBrowser on your server ([full guide](docs/REMOTE-MCP-SERVER.md))
672
+ 2. In claude.ai: Settings > Connectors > Add Custom Connector
673
+ 3. Add URL: `https://your-cbrowser-domain.com/mcp`
674
+ 4. Configure OAuth with Auth0 ([setup guide](docs/AUTH0-SETUP.md))
900
675
 
901
- ### Multi-Browser Support
676
+ **Public Demo (rate-limited):** `https://cbrowser-mcp-demo.wyldfyre.ai/mcp`
677
+ - No authentication required
678
+ - Rate limit: 5 requests/minute, burst of 10
679
+ - For evaluation purposes only
902
680
 
903
- ```bash
904
- # Firefox
905
- npx cbrowser navigate "https://example.com" --browser firefox
681
+ **Authenticated Server:** `https://cbrowser-mcp.wyldfyre.ai/mcp`
682
+ - **OAuth 2.1 via Auth0** - For claude.ai web interface ([setup guide](docs/AUTH0-SETUP.md))
683
+ - **API Key** - For Claude Code CLI and programmatic access
684
+ - No rate limits for authenticated users
906
685
 
907
- # WebKit (Safari)
908
- npx cbrowser navigate "https://example.com" --browser webkit
909
- ```
686
+ ### Local MCP (Claude Desktop)
910
687
 
911
- ### Device Emulation
688
+ Run CBrowser locally for Claude Desktop:
912
689
 
913
690
  ```bash
914
- # Mobile
915
- npx cbrowser navigate "https://example.com" --device iphone-15
691
+ npx cbrowser mcp-server
692
+ ```
916
693
 
917
- # Tablet
918
- npx cbrowser navigate "https://example.com" --device ipad-pro-12
694
+ Add to Claude Desktop config (`~/.config/claude-desktop/config.json`):
919
695
 
920
- # List devices
921
- npx cbrowser device list
696
+ ```json
697
+ {
698
+ "mcpServers": {
699
+ "cbrowser": {
700
+ "command": "npx",
701
+ "args": ["cbrowser", "mcp-server"]
702
+ }
703
+ }
704
+ }
922
705
  ```
923
706
 
924
- ### Performance Metrics
707
+ ### Available MCP Tools (33 total)
925
708
 
926
- ```bash
927
- # Core Web Vitals
928
- npx cbrowser perf "https://example.com"
709
+ | Category | Tools |
710
+ |----------|-------|
711
+ | **Navigation** | `navigate`, `screenshot`, `extract` |
712
+ | **Interaction** | `click`, `smart_click`, `fill`, `scroll`, `press_key` |
713
+ | **Assertions** | `assert`, `analyze_page` |
714
+ | **Testing** | `generate_tests`, `test_suite`, `repair_tests`, `flaky_check` |
715
+ | **Visual** | `visual_baseline`, `visual_compare`, `responsive_test`, `cross_browser_test`, `ab_compare` |
716
+ | **Personas** | `journey`, `compare_personas`, `create_persona`, `list_personas` |
717
+ | **Sessions** | `save_session`, `load_session`, `list_sessions`, `delete_session` |
718
+ | **Analysis** | `hunt_bugs`, `chaos_test`, `performance_audit`, `dismiss_overlay` |
719
+ | **Utilities** | `heal_stats`, `list_baselines`, `status` |
929
720
 
930
- # With budget
931
- npx cbrowser perf audit "https://example.com" --budget-lcp 2500
932
- ```
721
+ See [Remote MCP Server Guide](docs/REMOTE-MCP-SERVER.md) for full deployment instructions.
722
+
723
+ ---
933
724
 
934
725
  ## API Usage
935
726
 
@@ -964,6 +755,8 @@ console.log(tests.playwrightCode);
964
755
  await browser.close();
965
756
  ```
966
757
 
758
+ ---
759
+
967
760
  ## Configuration
968
761
 
969
762
  ### Environment Variables
@@ -991,29 +784,50 @@ Create `.cbrowserrc.json`:
991
784
  }
992
785
  ```
993
786
 
994
- ## Constitutional Safety
787
+ ---
995
788
 
996
- CBrowser classifies actions by risk level:
789
+ ## Multi-Browser Support
997
790
 
998
- | Zone | Actions | Behavior |
999
- |------|---------|----------|
1000
- | **Green** | Navigate, read, screenshot | Auto-execute |
1001
- | **Yellow** | Click, fill forms | Log and proceed |
1002
- | **Red** | Submit, delete, purchase | Requires `--force` |
1003
- | **Black** | Bypass auth, inject scripts | Never execute |
791
+ ```bash
792
+ # Firefox
793
+ npx cbrowser navigate "https://example.com" --browser firefox
794
+
795
+ # WebKit (Safari)
796
+ npx cbrowser navigate "https://example.com" --browser webkit
797
+ ```
798
+
799
+ ### Device Emulation
1004
800
 
1005
801
  ```bash
1006
- # Bypass safety for testing
1007
- cbrowser click "Delete Account" --force
802
+ # Mobile
803
+ npx cbrowser navigate "https://example.com" --device iphone-15
804
+
805
+ # Tablet
806
+ npx cbrowser navigate "https://example.com" --device ipad-pro-12
807
+
808
+ # List devices
809
+ npx cbrowser device list
810
+ ```
811
+
812
+ ### Persistent Browser Context
813
+
814
+ Enable persistent mode to keep cookies and localStorage between CLI calls:
815
+
816
+ ```bash
817
+ npx cbrowser navigate "https://example.com" --persistent
1008
818
  ```
1009
819
 
820
+ ---
821
+
1010
822
  ## Performance
1011
823
 
1012
824
  CBrowser uses optimized Chromium launch flags for fast startup:
1013
825
 
1014
- - **~1 second** browser cold start (vs 3-5s default)
1015
- - **Persistent context** keeps cookies between calls
1016
- - **Self-healing cache** reduces retry overhead
826
+ - ~1 second browser cold start (vs 3-5s default)
827
+ - Persistent context keeps cookies between calls
828
+ - Self-healing cache reduces retry overhead
829
+
830
+ ---
1017
831
 
1018
832
  ## Examples
1019
833