@zibby/mcp-browser 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Zibby
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,108 @@
+# @zibby/mcp-browser
+
+Wrapper for `@playwright/mcp` with stable ID support and event recording.
+
+## Features
+
+- ✅ Injects stable IDs via `--init-script` for reliable element targeting
+- ✅ Records browser events to `events.json` with stable IDs
+- ✅ Video recording with accurate timestamp synchronization
+- ✅ Passes through all official Playwright MCP functionality
+
+## Installation
+
+```bash
+npm install @zibby/mcp-browser
+```
+
+## Usage
+
+### As MCP Server
+
+Add to your MCP configuration:
+
+```json
+{
+  "mcpServers": {
+    "playwright": {
+      "command": "npx",
+      "args": ["@zibby/mcp-browser"]
+    }
+  }
+}
+```
+
+### Command Line
+
+```bash
+# Basic usage (same as @playwright/mcp)
+npx @zibby/mcp-browser
+
+# With headless mode
+npx @zibby/mcp-browser --headless
+
+# With custom output directory
+npx @zibby/mcp-browser --output-dir ./recordings
+```
+
+## How It Works
+
+This package wraps the official `@playwright/mcp` and adds:
+
+1. **Stable ID Injection**: Automatically injects stable element IDs into the page
+2. **Event Recording**: Records all browser interactions with stable IDs
+3. **Video Sync**: Synchronizes event timestamps with video recordings
+
+## Event Recording
+
+Events are recorded to `events.json` in the session directory:
+
+```json
+[
+  {
+    "id": 0,
+    "type": "navigate",
+    "timestamp": "2026-03-05T12:00:00.000Z",
+    "videoOffsetMs": 0,
+    "videoOffsetFormatted": "00:00:00.000",
+    "data": {
+      "url": "https://example.com"
+    }
+  },
+  {
+    "id": 1,
+    "type": "click",
+    "timestamp": "2026-03-05T12:00:02.500Z",
+    "videoOffsetMs": 2500,
+    "videoOffsetFormatted": "00:00:02.500",
+    "data": {
+      "element": "Login button",
+      "stableId": "zibby-login-btn-a1b2c3"
+    }
+  }
+]
+```
+
+## Configuration
+
+Set the session path via environment variable:
+
+```bash
+export ZIBBY_SESSION_INFO=/path/to/.session-info.json
+```
+
+## Compatibility
+
+- Node.js >= 18.0.0
+- Compatible with all `@playwright/mcp` features
+- Works with Playwright >= 1.49.0
+
+## License
+
+MIT
+
+## Related Packages
+
+- [@zibby/cli](https://www.npmjs.com/package/@zibby/cli) - Command-line interface
+- [@zibby/test-automation-core](https://www.npmjs.com/package/@zibby/test-automation-core) - Core automation engine
+- [@zibby/mcp-jira](https://www.npmjs.com/package/@zibby/mcp-jira) - Jira MCP server