browser-cdp 0.6.1 → 0.6.3

package/README.md

@@ -37,6 +37,14 @@ browser-cdp pick '<message>'
 # Stream browser console output (network errors, exceptions, logs)
 browser-cdp console [--duration=SECONDS]
 
+# Stream network requests/responses
+browser-cdp network [--filter=PATTERN] [--json] [--errors] [--duration=SECONDS]
+
+# Manage cookies (export/import/clear)
+browser-cdp cookies export [--path=FILE]
+browser-cdp cookies import <file>
+browser-cdp cookies clear
+
 # Show page performance metrics
 browser-cdp insights [--json]
 
@@ -89,6 +97,32 @@ browser-cdp console
 # Stream console for 10 seconds
 browser-cdp console --duration=10
 
+# Stream network traffic
+browser-cdp network
+# Then navigate to see requests
+
+# Filter to API calls only
+browser-cdp network --filter=api
+
+# Only show failed requests (4xx/5xx)
+browser-cdp network --errors
+
+# JSON output for parsing
+browser-cdp network --json --duration=5 | jq '.url'
+
+# Export cookies to JSON file
+browser-cdp cookies export
+# Returns: cookies.json with all cookies
+
+# Export to custom file
+browser-cdp cookies export --path session.json
+
+# Import cookies from file
+browser-cdp cookies import session.json
+
+# Clear all cookies
+browser-cdp cookies clear
+
 # Get page performance insights
 browser-cdp insights
 # Returns: TTFB, First Paint, FCP, DOM loaded, resources, memory
@@ -103,6 +137,56 @@ browser-cdp lighthouse
 browser-cdp close
 ```
 
+## Cookies Command
+
+The `cookies` command provides session persistence for authenticated workflows:
+
+### Export Cookies
+
+Save your browser cookies to a JSON file for later use:
+
+```bash
+browser-cdp cookies export                    # Saves to cookies.json
+browser-cdp cookies export --path auth.json   # Save to specific file
+```
+
+Output format:
+```json
+[
+  {
+    "name": "session_id",
+    "value": "abc123...",
+    "domain": "example.com",
+    "path": "/",
+    "httpOnly": true,
+    "secure": true,
+    "sameSite": "Strict",
+    "expires": 1735689600
+  }
+]
+```
+
+### Import Cookies
+
+Load previously exported cookies into the browser:
+
+```bash
+browser-cdp cookies import auth.json
+```
+
+Useful for:
+- Resuming authenticated sessions across browser restarts
+- Sharing sessions across team members
+- Preserving login state for automation workflows
+
+### Clear Cookies
+
+Delete all cookies from the browser:
+
+```bash
+browser-cdp cookies clear
+```
+
 ## Pre-started Browser
 
 If you already have a browser running with CDP enabled, the CLI will connect to it:

package/cli.js

@@ -20,6 +20,8 @@ const commands = {
   pdf: "./src/pdf.js",
   pick: "./src/pick.js",
   console: "./src/console.js",
+  network: "./src/network.js",
+  cookies: "./src/cookies.js",
   insights: "./src/insights.js",
   lighthouse: "./src/lighthouse.js",
 };
@@ -39,6 +41,8 @@ function printUsage() {
   console.log("  pdf                 Export current page as PDF");
   console.log("  pick '<message>'    Interactive element picker");
   console.log("  console             Stream browser console output");
+  console.log("  network             Stream network requests/responses");
+  console.log("  cookies             Export/import/clear browser cookies");
   console.log("  insights            Show page performance metrics");
   console.log("  lighthouse          Run Lighthouse audit");
   console.log("");
@@ -53,6 +57,8 @@ function printUsage() {
   console.log("  browser-cdp eval 'document.title'");
   console.log("  browser-cdp dom > page.html");
   console.log("  browser-cdp console --duration=10");
+  console.log("  browser-cdp network --filter=api");
+  console.log("  browser-cdp cookies export --path session.json");
   console.log("  browser-cdp insights --json");
   process.exit(0);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "browser-cdp",
-  "version": "0.6.1",
+  "version": "0.6.3",
   "description": "Browser automation via Chrome DevTools Protocol - control Chrome, Brave, Edge with real browser profiles",
   "type": "module",
   "bin": {

package/src/cookies.js

@@ -0,0 +1,88 @@
+#!/usr/bin/env node
+
+import { readFileSync, writeFileSync } from "node:fs";
+import { chromium } from "playwright";
+import { DEFAULT_PORT, getActivePage } from "./utils.js";
+
+const args = process.argv.slice(2);
+const subcommand = args[0];
+const showHelp = args.includes("--help") || args.includes("-h");
+
+function printUsage() {
+  console.log("Usage: cookies <subcommand> [options]");
+  console.log("");
+  console.log("Subcommands:");
+  console.log("  export                Export cookies to JSON file");
+  console.log("  import <file>         Import cookies from JSON file");
+  console.log("  clear                 Clear all cookies from browser");
+  console.log("");
+  console.log("Options:");
+  console.log("  --path <file>         Output file path for export (default: cookies.json)");
+  console.log("");
+  console.log("Examples:");
+  console.log("  cookies export");
+  console.log("  cookies export --path session.json");
+  console.log("  cookies import session.json");
+  console.log("  cookies clear");
+  process.exit(0);
+}
+
+if (!subcommand || showHelp) {
+  printUsage();
+}
+
+if (!["export", "import", "clear"].includes(subcommand)) {
+  console.error(`Unknown subcommand: ${subcommand}`);
+  console.log("Available: export, import, clear");
+  process.exit(1);
+}
+
+const browser = await chromium.connectOverCDP(`http://localhost:${DEFAULT_PORT}`);
+const contexts = browser.contexts();
+const context = contexts[0];
+
+if (!context) {
+  console.error("No browser context found");
+  process.exit(1);
+}
+
+const pages = context.pages();
+const page = getActivePage(pages);
+
+if (!page) {
+  console.error("No active tab found");
+  process.exit(1);
+}
+
+const cdp = await page.context().newCDPSession(page);
+
+if (subcommand === "export") {
+  const pathIdx = args.findIndex((a) => a === "--path");
+  const outputFile = pathIdx !== -1 ? args[pathIdx + 1] : "cookies.json";
+
+  const { cookies } = await cdp.send("Network.getCookies");
+  writeFileSync(outputFile, JSON.stringify(cookies, null, 2));
+  console.log(`Exported ${cookies.length} cookie(s) to ${outputFile}`);
+} else if (subcommand === "import") {
+  const importFile = args[1];
+
+  if (!importFile) {
+    console.error("Error: import requires a file path");
+    process.exit(1);
+  }
+
+  const cookies = JSON.parse(readFileSync(importFile, "utf8"));
+
+  if (!Array.isArray(cookies)) {
+    console.error("Error: Cookie file must contain a JSON array");
+    process.exit(1);
+  }
+
+  await cdp.send("Network.setCookies", { cookies });
+  console.log(`Imported ${cookies.length} cookie(s) from ${importFile}`);
+} else if (subcommand === "clear") {
+  await cdp.send("Network.clearBrowserCookies");
+  console.log("Cleared all cookies");
+}
+
+await browser.close();

package/src/network.js

@@ -0,0 +1,171 @@
+#!/usr/bin/env node
+
+import { chromium } from "playwright";
+import { DEFAULT_PORT, getActivePage, formatTime, resetColor } from "./utils.js";
+
+const args = process.argv.slice(2);
+const filterPattern = args.find((a) => a.startsWith("--filter="))?.split("=")[1];
+const jsonOutput = args.includes("--json");
+const errorsOnly = args.includes("--errors");
+const duration = args.find((a) => a.startsWith("--duration="));
+const durationMs = duration ? parseInt(duration.split("=")[1]) * 1000 : null;
+const showHelp = args.includes("--help") || args.includes("-h");
+
+if (showHelp) {
+  console.log("Usage: network.js [options]");
+  console.log("\nStream network requests and responses in real-time.");
+  console.log("\nOptions:");
+  console.log("  --filter=PATTERN  Filter URLs by regex pattern");
+  console.log("  --json            Output as JSON for piping");
+  console.log("  --errors          Only show failed requests (4xx/5xx)");
+  console.log("  --duration=N      Stop after N seconds (default: run until Ctrl+C)");
+  console.log("\nExamples:");
+  console.log("  network.js                      # Stream all network traffic");
+  console.log("  network.js --filter=api         # Only show URLs containing 'api'");
+  console.log("  network.js --errors             # Only show failed requests");
+  console.log("  network.js --json               # JSON output for jq/parsing");
+  console.log("  network.js --duration=10        # Capture for 10 seconds");
+  process.exit(0);
+}
+
+const browser = await chromium.connectOverCDP(`http://localhost:${DEFAULT_PORT}`);
+const contexts = browser.contexts();
+const context = contexts[0];
+
+if (!context) {
+  console.error("No browser context found");
+  process.exit(1);
+}
+
+const pages = context.pages();
+const page = getActivePage(pages);
+
+if (!page) {
+  console.error("No active tab found");
+  process.exit(1);
+}
+
+console.error(`Connected to: ${page.url()}`);
+
+const cdp = await page.context().newCDPSession(page);
+await cdp.send("Network.enable");
+
+const requests = new Map();
+
+const statusColors = {
+  success: "\x1b[32m", // green for 2xx
+  redirect: "\x1b[33m", // yellow for 3xx
+  error: "\x1b[31m", // red for 4xx/5xx
+  request: "\x1b[36m", // cyan for requests
+};
+
+function matchesFilter(url) {
+  if (!filterPattern) return true;
+  try {
+    return new RegExp(filterPattern).test(url);
+  } catch {
+    return url.includes(filterPattern);
+  }
+}
+
+cdp.on("Network.requestWillBeSent", ({ requestId, request, timestamp }) => {
+  requests.set(requestId, { method: request.method, url: request.url, timestamp });
+
+  if (!matchesFilter(request.url)) return;
+  if (errorsOnly) return;
+
+  if (jsonOutput) {
+    console.log(
+      JSON.stringify({
+        type: "request",
+        timestamp: new Date(timestamp * 1000).toISOString(),
+        method: request.method,
+        url: request.url,
+        requestId,
+      })
+    );
+  } else {
+    console.log(`${statusColors.request}[${formatTime()}] → ${request.method} ${request.url}${resetColor}`);
+  }
+});
+
+cdp.on("Network.responseReceived", ({ requestId, response, timestamp, type }) => {
+  const req = requests.get(requestId);
+
+  if (!matchesFilter(response.url)) return;
+  if (errorsOnly && response.status < 400) return;
+
+  if (jsonOutput) {
+    console.log(
+      JSON.stringify({
+        type: "response",
+        timestamp: new Date(timestamp * 1000).toISOString(),
+        status: response.status,
+        statusText: response.statusText,
+        url: response.url,
+        mimeType: response.mimeType,
+        resourceType: type,
+        requestId,
+        method: req?.method,
+      })
+    );
+  } else {
+    let color = statusColors.success;
+    if (response.status >= 400) {
+      color = statusColors.error;
+    } else if (response.status >= 300) {
+      color = statusColors.redirect;
+    }
+
+    const method = req ? `${req.method} ` : "";
+    console.log(`${color}[${formatTime()}] ← ${response.status} ${method}${response.url}${resetColor}`);
+  }
+});
+
+cdp.on("Network.loadingFailed", ({ requestId, errorText, blockedReason, canceled }) => {
+  const req = requests.get(requestId);
+
+  if (req && !matchesFilter(req.url)) return;
+
+  if (jsonOutput) {
+    console.log(
+      JSON.stringify({
+        type: "failed",
+        timestamp: new Date().toISOString(),
+        url: req?.url,
+        method: req?.method,
+        error: errorText,
+        blockedReason,
+        canceled,
+        requestId,
+      })
+    );
+  } else {
+    const reason = blockedReason ? ` (${blockedReason})` : "";
+    const canceledStr = canceled ? " [CANCELED]" : "";
+    console.log(
+      `${statusColors.error}[${formatTime()}] ✗ ${errorText}${reason}${canceledStr} - ${req?.url || "unknown"}${resetColor}`
+    );
+  }
+
+  if (requestId) {
+    requests.delete(requestId);
+  }
+});
+
+console.error(`Listening for network activity... (Ctrl+C to stop)`);
+
+if (durationMs) {
+  await new Promise((r) => setTimeout(r, durationMs));
+  await browser.close();
+} else {
+  // Keep running until interrupted
+  process.on("SIGINT", async () => {
+    console.error("\nStopping...");
+    await browser.close();
+    process.exit(0);
+  });
+
+  // Keep the process alive
+  await new Promise(() => {});
+}