rechrome 1.4.0 → 1.6.0

package/README.md

@@ -49,24 +49,27 @@ This auto-generates a connection URL in `.env.local` (with an auth key).
 
 ### 2. Run commands from a client
 
-Copy the `REMOTE_CHROME_URL` from the server's `.env.local` to the client:
+Copy the `RECHROME_URL` from the server's `.env.local` to the client's project `.env.local`:
 
 ```bash
-export REMOTE_CHROME_URL=remote-chrome://YOUR_KEY@server-host:13775
+# .env.local in your project directory
+RECHROME_URL=http://YOUR_KEY@server-host:13775
 
 # Open a URL
-rechrome open https://example.com
+rech open https://example.com
 
 # Take a screenshot
-rechrome screenshot
+rech screenshot
 
 # List open tabs
-rechrome tab-list
+rech tab-list
 
 # Any playwright-cli command works
-rechrome --help
+rech --help
 ```
 
+rechrome walks up from the current working directory to find `.env.local`, so each project can have its own connection URL, Chrome profile, and extension token.
+
 ## Configuration
 
 Copy `.env.example` to `.env.local` and edit:
@@ -75,22 +78,24 @@ Copy `.env.example` to `.env.local` and edit:
 cp .env.example .env.local
 ```
 
-| Variable                         | Description                                                                                        | Default          |
-| -------------------------------- | -------------------------------------------------------------------------------------------------- | ---------------- |
-| `REMOTE_CHROME_URL`              | Connection URL (auto-generated by `rechrome serve`)                                                | —                |
-| `PLAYWRIGHT_CLI`                 | Path to playwright-cli binary (recommended: `playwright-cli-multi-tab` for full multi-tab support) | `playwright-cli` |
-| `RECH_HOST`                      | Server bind address                                                                                | `127.0.0.1`      |
-| `PLAYWRIGHT_MCP_EXTENSION_ID`       | Chrome extension ID (client overrides server)                                                                                   | —                |
-| `PLAYWRIGHT_MCP_EXTENSION_TOKEN`    | Chrome extension token (client overrides server)                                                                                | —                |
-| `PLAYWRIGHT_MCP_USER_DATA_DIR`      | Chrome user data directory — use to pin connections to a specific Chrome install (client overrides server)                      | —                |
-| `PLAYWRIGHT_MCP_PROFILE_DIRECTORY`  | Chrome profile sub-directory (e.g. `Profile 2`) — use when multiple profiles share the same user data dir (client overrides server) | —                |
-
-> **Multi-profile tip:** If you have multiple Chrome profiles open and only one has the Playwright MCP Bridge extension, set both vars so the extension connection always targets the correct profile:
+| Variable                            | Description                                                                                                                         | Default          |
+| ----------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------- | ---------------- |
+| `RECHROME_URL`                      | Connection URL (auto-generated by `rech serve`). Also accepts `?extension_id=`, `?token=`, `?profile=` query params                 | —                |
+| `PLAYWRIGHT_CLI`                    | Path to playwright-cli binary (recommended: `playwright-cli-multi-tab` for full multi-tab support)                                  | `playwright-cli` |
+| `RECH_HOST`                         | Server bind address                                                                                                                 | `127.0.0.1`      |
+| `PLAYWRIGHT_MCP_EXTENSION_ID`       | Chrome extension ID (client overrides server)                                                                                       | —                |
+| `PLAYWRIGHT_MCP_EXTENSION_TOKEN`    | Chrome extension token — profile-specific, get it from the extension's status page (client overrides server)                        | —                |
+| `PLAYWRIGHT_MCP_USER_DATA_DIR`      | Chrome user data directory — use to pin connections to a specific Chrome install (client overrides server)                          | —                |
+| `PLAYWRIGHT_MCP_PROFILE_DIRECTORY`  | Chrome profile — accepts directory name (`Profile 2`), display name (`Snowstar`), or **email** (`you@example.com`) (client overrides server) | —         |
+
+> **Multi-profile tip:** Each project's `.env.local` can specify a different Chrome profile via the `?profile=` query param in `RECHROME_URL`. The server resolves display names and email addresses to the actual Chrome profile directory automatically (reads `~/Library/Application Support/Google/Chrome/Local State`).
+>
 > ```
-> PLAYWRIGHT_MCP_USER_DATA_DIR=/Users/yourname/Library/Application Support/Google/Chrome
-> PLAYWRIGHT_MCP_PROFILE_DIRECTORY=Profile 2
+> # .env.local for a work project
+> RECHROME_URL="http://KEY@server:13775?token=TOKEN&extension_id=EXT_ID&profile=taku%40company.com"
 > ```
-> To find your profile directory name, open `chrome://version` in the target Chrome profile and look for **Profile Path**.
+>
+> Shell-set `PLAYWRIGHT_MCP_*` variables take priority over `.env.local`, so you can always override per-command without editing files.
 
 ### Remote access
 
@@ -115,9 +120,24 @@ bun install
 bun test
 ```
 
+## Why we fork playwright
+
+rechrome depends on [playwright-multi-tab](https://github.com/snomiao/playwright-multi-tab), which is a fork of [microsoft/playwright](https://github.com/microsoft/playwright). We maintain it because the upstream does not yet support several features required for rechrome's use case:
+
+| Feature | Our change | Status |
+|---------|-----------|--------|
+| Multi-tab control | `playwright-multi-tab` fork adds `tab-new`, `tab-list`, `tab-select`, `tab-close` commands and a persistent session daemon | Not in upstream |
+| `PLAYWRIGHT_MCP_EXTENSION_ID` | Lets you specify a custom extension ID instead of the hardcoded default | Not in upstream |
+| `PLAYWRIGHT_MCP_PROFILE_DIRECTORY` | Passes `--profile-directory` to Chrome so the correct system profile is used; auto-detects the Chrome user data dir by OS | Not in upstream |
+
+We also fork [playwright-mcp](https://github.com/snomiao/playwright-mcp) (inside `playwright-multi-tab/lib/playwright-mcp`) to support the custom extension ID and multi-tab session routing.
+
+PRs upstream are welcome. Once these features land in the official packages we will drop the forks.
+
 ## Related
 
 - [playwright-multi-tab](https://github.com/snomiao/playwright-multi-tab) — the underlying Playwright fork powering rechrome's multi-tab and multi-session browser control
+- [microsoft/playwright](https://github.com/microsoft/playwright) — upstream
 
 ## License
 

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "rechrome",
-  "version": "1.4.0",
+  "version": "1.6.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/snomiao/rechrome.git"
   },
   "bin": {
-    "rech": "./rech.js",
-    "rechrome": "./rech.js"
+    "rech": "./rech.ts",
+    "rechrome": "./rech.ts"
   },
   "files": [
     ".env.example",

package/rech.js

@@ -4,29 +4,49 @@ import { file } from "bun";
 import { randomBytes } from "crypto";
 import { mkdirSync, appendFileSync, existsSync } from "fs";
 import { hostname } from "os";
-import { join, basename } from "path";
+import { join, basename, dirname } from "path";
 
-export const ENV_KEY = "REMOTE_CHROME_URL";
+export const ENV_KEY = "RECHROME_URL";
 export const DEFAULT_PORT = 13775;
 export const RECH_DIR = join(import.meta.dir, ".rech");
 export const LOG_DIR = join(RECH_DIR, "logs");
 
-// Load .env.local from script's directory (works even when invoked from elsewhere)
 const envFile = join(import.meta.dir, ".env.local");
 
-/** Load .env.local into process.env. */
-async function loadEnv() {
-  const envRaw = await file(envFile)
-    .text()
-    .catch(() => "");
+async function loadEnvFile(path: string): Promise<boolean> {
+  const envRaw = await file(path).text().catch(() => "");
+  if (!envRaw) return false;
+  let hasKey = false;
   for (const line of envRaw.split("\n")) {
     const m = line.match(/^\s*([^#=]+?)\s*=\s*(.*?)\s*$/);
-    if (m) process.env[m[1]] = m[2].replace(/^["']|["']$/g, "");
+    if (m) {
+      process.env[m[1]] = m[2].replace(/^["']|["']$/g, "");
+      if (m[1] === ENV_KEY) hasKey = true;
+    }
+  }
+  return hasKey;
+}
+
+async function loadEnv() {
+  // Walk up from cwd first — project-local .env.local takes priority
+  let dir = process.cwd();
+  while (true) {
+    if (await loadEnvFile(join(dir, ".env.local"))) break;
+    const parent = join(dir, "..");
+    if (parent === dir) break;
+    dir = parent;
   }
+  // Fall back to script dir's .env.local
+  if (!process.env[ENV_KEY]) await loadEnvFile(envFile);
+}
+// Shell-set passthrough vars survive .env.local loading
+const _shellPassthrough: Record<string, string> = {};
+for (const k of ["PLAYWRIGHT_MCP_EXTENSION_ID","PLAYWRIGHT_MCP_EXTENSION_TOKEN","PLAYWRIGHT_MCP_PROFILE_DIRECTORY","PLAYWRIGHT_MCP_USER_DATA_DIR"] as const) {
+  if (process.env[k]) _shellPassthrough[k] = process.env[k]!;
 }
 await loadEnv();
+Object.assign(process.env, _shellPassthrough);
 
-// Watch .env.local for changes and hot-reload
 import { watch } from "node:fs";
 if (existsSync(envFile)) {
   watch(envFile, async () => {
@@ -39,8 +59,8 @@ if (existsSync(envFile)) {
 export const PASSTHROUGH_ENV_KEYS = [
   "PLAYWRIGHT_MCP_EXTENSION_ID",
   "PLAYWRIGHT_MCP_EXTENSION_TOKEN",
-  "PLAYWRIGHT_MCP_USER_DATA_DIR",
   "PLAYWRIGHT_MCP_PROFILE_DIRECTORY",
+  "PLAYWRIGHT_MCP_USER_DATA_DIR",
 ] as const;
 
 export function log(msg: string) {
@@ -54,13 +74,25 @@ export function log(msg: string) {
 
 export function parseUrl(raw: string) {
   const u = new URL(raw);
-  return { key: u.username, host: u.hostname, port: parseInt(u.port) || DEFAULT_PORT };
+  const scheme = u.protocol.replace(":", "");
+  const protocol = scheme === "https" ? "https" : "http";
+  const defaultPort = scheme === "https" ? 443 : scheme === "http" ? 80 : DEFAULT_PORT;
+  return {
+    key: u.username,
+    host: u.hostname,
+    port: parseInt(u.port) || defaultPort,
+    protocol,
+    extensionId: u.searchParams.get("extension_id") ?? undefined,
+    extensionToken: u.searchParams.get("token") ?? undefined,
+    profileDirectory: u.searchParams.get("profile") ?? undefined,
+    userDataDir: u.searchParams.get("user_data_dir") ?? undefined,
+  };
 }
 
 export async function getOrCreateUrl(): Promise<string> {
   if (process.env[ENV_KEY]) return process.env[ENV_KEY];
   const key = randomBytes(9).toString("base64url"); // 12 chars
-  const url = `remote-chrome://${key}@${hostname()}:${DEFAULT_PORT}`;
+  const url = `http://${key}@${hostname()}:${DEFAULT_PORT}`;
   const newLine = `${ENV_KEY}=${url}`;
   const envRaw = await file(envFile)
     .text()
@@ -121,49 +153,162 @@ async function getClientIdentity(): Promise<{ gitUrl?: string; hostname?: string
   return { hostname: hostname(), cwd };
 }
 
-function getClientEnv(): Record<string, string> {
+function getClientEnv(urlExtras?: { extensionId?: string; extensionToken?: string; profileDirectory?: string; userDataDir?: string }): Record<string, string> {
   const env: Record<string, string> = {};
   for (const key of PASSTHROUGH_ENV_KEYS) {
     if (process.env[key]) env[key] = process.env[key];
   }
+  if (urlExtras?.extensionId)
+    env["PLAYWRIGHT_MCP_EXTENSION_ID"] = urlExtras.extensionId;
+  if (urlExtras?.extensionToken)
+    env["PLAYWRIGHT_MCP_EXTENSION_TOKEN"] = urlExtras.extensionToken;
+  if (urlExtras?.profileDirectory)
+    env["PLAYWRIGHT_MCP_PROFILE_DIRECTORY"] = urlExtras.profileDirectory;
+  if (urlExtras?.userDataDir)
+    env["PLAYWRIGHT_MCP_USER_DATA_DIR"] = urlExtras.userDataDir;
   return env;
 }
 
-async function run(url: string, args: string[]) {
-  const { key, host, port } = parseUrl(url);
+const CHROME_LOCAL_STATE_PATHS = () => {
+  const home = process.env.HOME || "~";
+  return [
+    join(home, "Library/Application Support/Google/Chrome/Local State"),
+    join(home, ".config/google-chrome/Local State"),
+    join(home, "AppData/Local/Google/Chrome/User Data/Local State"),
+  ];
+};
+
+async function readChromeProfileCache(): Promise<Record<string, { user_name?: string; name?: string }> | null> {
+  for (const statePath of CHROME_LOCAL_STATE_PATHS()) {
+    const f = file(statePath);
+    if (!(await f.exists())) continue;
+    try {
+      const data = JSON.parse(await f.text());
+      return data?.profile?.info_cache ?? null;
+    } catch {}
+  }
+  return null;
+}
+
+async function findChromeUserDataDir(): Promise<string | null> {
+  for (const statePath of CHROME_LOCAL_STATE_PATHS()) {
+    if (!(await file(statePath).exists())) continue;
+    return dirname(statePath);
+  }
+  return null;
+}
+
+export const EXTENSION_DIST_DIR = join(
+  import.meta.dir,
+  "lib/playwright-multi-tab/lib/playwright-mcp/packages/extension/dist",
+);
+
+// Walk all Chrome profiles' Secure Preferences and find an extension
+// whose loaded `path` matches our dist directory. The extension ID Chrome
+// generates for an unpacked extension is path-dependent, so we cannot rely
+// on a hardcoded ID across machines.
+async function findInstalledExtension(
+  profileDir?: string,
+): Promise<{ id: string; profile: string } | null> {
+  const userDataDir = await findChromeUserDataDir();
+  if (!userDataDir) return null;
+  const cache = await readChromeProfileCache();
+  const profiles = profileDir ? [profileDir] : (cache ? Object.keys(cache) : []);
+  for (const prof of profiles) {
+    const prefsPath = join(userDataDir, prof, "Secure Preferences");
+    const f = file(prefsPath);
+    if (!(await f.exists())) continue;
+    try {
+      const data = JSON.parse(await f.text());
+      const settings = data?.extensions?.settings ?? {};
+      for (const [extId, info] of Object.entries(settings as Record<string, any>)) {
+        if (info?.path === EXTENSION_DIST_DIR) return { id: extId, profile: prof };
+      }
+    } catch {}
+  }
+  return null;
+}
+
+function printInstallInstructions(profileDisplay: string): void {
+  console.error("");
+  console.error("Multi-tab extension is not installed in this Chrome profile.");
+  console.error("");
+  console.error("To install:");
+  console.error("  1. Open chrome://extensions/ in the selected profile");
+  console.error(`     (profile: ${profileDisplay})`);
+  console.error("  2. Enable \"Developer mode\" (top-right toggle)");
+  console.error("  3. Click \"Load unpacked\"");
+  console.error("  4. Select this directory:");
+  console.error(`       ${EXTENSION_DIST_DIR}`);
+  console.error("  5. Re-run `rech setup`");
+  console.error("");
+}
+
+async function resolveProfileEmail(dir: string): Promise<string> {
+  const cache = await readChromeProfileCache();
+  if (cache?.[dir]?.user_name) return cache[dir].user_name;
+  return dir;
+}
+
+async function listProfiles(): Promise<void> {
+  const cache = await readChromeProfileCache();
+  if (!cache) { console.error("Chrome Local State not found"); process.exit(1); }
+
+  const current = process.env.PLAYWRIGHT_MCP_PROFILE_DIRECTORY;
+  // Resolve email/name → dir for current marker
+  let currentDir = current;
+  if (current && !/^(Default|Profile \d+)$/i.test(current)) {
+    for (const [dir, info] of Object.entries(cache)) {
+      if (info.user_name === current || info.name === current) { currentDir = dir; break; }
+    }
+  }
 
+  const rows = Object.entries(cache).map(([dir, info]) => [
+    dir,
+    info.user_name || "",
+    info.name || "",
+    dir === currentDir ? "← current" : "",
+  ]);
+  const widths = rows.reduce((w, r) => r.map((c, i) => Math.max(w[i] ?? 0, c.length)), [] as number[]);
+  for (const row of rows) {
+    console.log(row.map((c, i) => c.padEnd(widths[i])).join("  ").trimEnd());
+  }
+}
+
+async function callServe(
+  url: string,
+  args: string[],
+  overrideEnv?: Record<string, string>,
+): Promise<{ status: number; stdout: string; stderr: string; files?: string[]; existingSession?: boolean }> {
+  const { key, host, port, protocol, extensionId, extensionToken, profileDirectory, userDataDir } = parseUrl(url);
   const identity = await getClientIdentity();
-  console.error(
-    `[rech] connecting to ${host}:${port} (identity: ${identity.gitUrl || `${identity.hostname}:${identity.cwd}`})`,
-  );
-  const res = await fetch(`http://${host}:${port}/run`, {
+  const effectiveProfile = profileDirectory || process.env.PLAYWRIGHT_MCP_PROFILE_DIRECTORY;
+  if (effectiveProfile) (identity as any).profile = effectiveProfile;
+  const env = { ...getClientEnv({ extensionId, extensionToken, profileDirectory, userDataDir }), ...overrideEnv };
+  const res = await fetch(`${protocol}://${host}:${port}/run`, {
     method: "POST",
     headers: { "Content-Type": "application/json", Authorization: `Bearer ${key}` },
-    body: JSON.stringify({ args, identity, env: getClientEnv() }),
+    body: JSON.stringify({ args, identity, env }),
     signal: AbortSignal.timeout(70_000),
-  }).catch((e) => {
-    console.error(`[rech] ${e.message}`);
-    process.exit(1);
-  });
+  }).catch((e) => { console.error(`[rech] ${e.message}`); process.exit(1); });
+  if (res.status === 401) { console.error("Unauthorized: bad key"); process.exit(1); }
+  return res.json();
+}
 
-  if (res.status === 401) {
-    console.error("Unauthorized: bad key");
-    process.exit(1);
-  }
+async function run(url: string, args: string[]) {
+  const { host, port, protocol } = parseUrl(url);
+  const effectiveProfile = parseUrl(url).profileDirectory || process.env.PLAYWRIGHT_MCP_PROFILE_DIRECTORY;
+  const displayProfile = effectiveProfile ? await resolveProfileEmail(effectiveProfile) : undefined;
+  const identity = await getClientIdentity();
+  const profileSuffix = displayProfile ? ` profile:${displayProfile}` : "";
+  console.error(
+    `[rech] connecting to ${host}:${port} (identity: ${identity.gitUrl || `${identity.hostname}:${identity.cwd}`}${profileSuffix})`,
+  );
 
-  const { status, stdout, stderr, files, existingSession } = (await res.json()) as {
-    status: number;
-    stdout: string;
-    stderr: string;
-    files?: string[];
-    existingSession?: boolean;
-  };
+  const { status, stdout, stderr, files, existingSession } = await callServe(url, args);
 
-  if (existingSession) {
-    console.error(
-      `[rech] session already has open tabs — listing existing tabs instead of opening a new window`,
-    );
-  }
+  if (existingSession)
+    console.error(`[rech] session already has open tabs — listing existing tabs instead of opening a new window`);
   if (stderr) process.stderr.write(stderr);
   if (stdout) process.stdout.write(stdout);
 
@@ -173,8 +318,8 @@ async function run(url: string, args: string[]) {
     const gitignorePath = join(dlDir, ".gitignore");
     if (!existsSync(gitignorePath)) await Bun.write(gitignorePath, "*\n");
     for (const name of files) {
-      const fileRes = await fetch(`http://${host}:${port}/files/${name}`, {
-        headers: { Authorization: `Bearer ${key}` },
+      const fileRes = await fetch(`${protocol}://${host}:${port}/files/${name}`, {
+        headers: { Authorization: `Bearer ${parseUrl(url).key}` },
       });
       if (!fileRes.ok) continue;
       const dest = join(dlDir, basename(name));
@@ -186,17 +331,108 @@ async function run(url: string, args: string[]) {
   process.exit(status);
 }
 
+async function setup(): Promise<void> {
+  // 1. Require serve to be running
+  const url = process.env[ENV_KEY];
+  if (!url) {
+    console.error(`${ENV_KEY} not set — start the server first:\n  rech serve`);
+    process.exit(1);
+  }
+  const { host, port, protocol } = parseUrl(url);
+  const ping = await fetch(`${protocol}://${host}:${port}/`, { signal: AbortSignal.timeout(3000) }).catch(() => null);
+  if (!ping) {
+    console.error(`rech serve is not running at ${host}:${port}\nStart it with:\n  rech serve`);
+    process.exit(1);
+  }
+
+  // 2. Interactive profile selection
+  const cache = await readChromeProfileCache();
+  if (!cache) { console.error("Chrome profiles not found"); process.exit(1); }
+  const profiles = Object.entries(cache);
+  console.log("\nAvailable Chrome profiles:");
+  profiles.forEach(([dir, info], i) =>
+    console.log(`  ${String(i + 1).padStart(2)}.  ${(info.user_name || "(no email)").padEnd(32)}  ${(info.name || "").padEnd(20)}  [${dir}]`)
+  );
+  const { createInterface } = await import("readline");
+  const rl = createInterface({ input: process.stdin, output: process.stdout });
+  const answer = await new Promise<string>(r => rl.question("\nProfile number: ", r));
+  rl.close();
+  const idx = parseInt(answer.trim()) - 1;
+  if (isNaN(idx) || idx < 0 || idx >= profiles.length) { console.error("Invalid selection"); process.exit(1); }
+  const [profileDir, profileInfoSel] = profiles[idx];
+  const profileEnv = { PLAYWRIGHT_MCP_PROFILE_DIRECTORY: profileDir };
+  const profileDisplay = profileInfoSel.user_name || profileInfoSel.name || profileDir;
+
+  // 3. Discover the extension ID. Unpacked extension IDs are derived from the
+  //    load path, so look up the actual ID from Chrome's Secure Preferences.
+  //    Env override wins if set explicitly.
+  let extId = process.env.PLAYWRIGHT_MCP_EXTENSION_ID;
+  if (!extId) {
+    const found = await findInstalledExtension(profileDir);
+    if (found) extId = found.id;
+  }
+
+  if (!extId) {
+    printInstallInstructions(profileDisplay);
+    console.error("Opening chrome://extensions/ in the selected profile...");
+    await callServe(url, ["open", "chrome://extensions/"], profileEnv);
+    process.exit(1);
+  }
+
+  const statusUrl = `chrome-extension://${extId}/status.html`;
+  console.log(`\nOpening ${statusUrl}...`);
+  const openResult = await callServe(url, ["open", statusUrl], profileEnv);
+  if (openResult.status !== 0) { process.stderr.write(openResult.stderr); process.exit(openResult.status); }
+
+  // 4. Read token from extension page localStorage
+  const evalResult = await callServe(url, ["eval", `() => localStorage.getItem('auth-token')`], profileEnv);
+  const tokenMatch = evalResult.stdout.match(/"([A-Za-z0-9_-]{20,})"/);
+  const token = tokenMatch?.[1];
+  if (!token) {
+    printInstallInstructions(profileDisplay);
+    console.error("Tried to read the auth token from the extension's status page but failed.");
+    console.error("This usually means the extension is not loaded in this profile.");
+    process.exit(1);
+  }
+
+  // 5. Write single RECHROME_URL with all params to ~/.env.local
+  const home = process.env.HOME!;
+  const globalEnvPath = join(home, ".env.local");
+  const existing = await file(globalEnvPath).text().catch(() => "");
+  const rechUrl = new URL(url);
+  rechUrl.searchParams.set("extension_id", extId);
+  rechUrl.searchParams.set("token", token);
+  // Prefer email for readability, fall back to directory name
+  rechUrl.searchParams.set("profile", profileInfoSel.user_name || profileDir);
+  const userDataDir = await findChromeUserDataDir();
+  if (userDataDir) rechUrl.searchParams.set("user_data_dir", userDataDir);
+  const newLine = `RECHROME_URL=${rechUrl.toString()}`;
+  // Remove old separate vars and update RECHROME_URL
+  const keysToRemove = ["PLAYWRIGHT_MCP_USER_DATA_DIR", "PLAYWRIGHT_MCP_EXTENSION_ID", "PLAYWRIGHT_MCP_EXTENSION_TOKEN", "PLAYWRIGHT_MCP_PROFILE_DIRECTORY"];
+  let lines = existing.trimEnd().split("\n").filter(l => !keysToRemove.some(k => l.startsWith(`${k}=`)));
+  const rechIdx = lines.findIndex(l => l.startsWith("RECHROME_URL="));
+  if (rechIdx >= 0) lines[rechIdx] = newLine;
+  else lines.push(newLine);
+  await Bun.write(globalEnvPath, lines.join("\n").trim() + "\n");
+  console.log(`\nSaved to ${globalEnvPath}:\n  ${newLine}`);
+  console.log("\nDone!");
+}
+
 if (import.meta.main) {
   const args = process.argv.slice(2);
 
   if (args[0] === "serve") {
     const { serve } = await import("./serve.js");
     serve();
+  } else if (args[0] === "profiles") {
+    await listProfiles();
+  } else if (args[0] === "setup") {
+    await setup();
   } else {
     const url = process.env[ENV_KEY];
     if (!url) {
       console.error(
-        `Usage:\n  rech serve\n  ${ENV_KEY}=remote-chrome://key@host:${DEFAULT_PORT} rech <playwright-args...>`,
+        `Usage:\n  rech serve\n  ${ENV_KEY}=http://key@host:${DEFAULT_PORT}?extension_id=ID&token=TOKEN rech <playwright-args...>\n  ${ENV_KEY}=https://key@host/path?extension_id=ID&token=TOKEN rech <playwright-args...>`,
       );
       process.exit(1);
     }

package/rech.ts

@@ -4,29 +4,49 @@ import { file } from "bun";
 import { randomBytes } from "crypto";
 import { mkdirSync, appendFileSync, existsSync } from "fs";
 import { hostname } from "os";
-import { join, basename } from "path";
+import { join, basename, dirname } from "path";
 
-export const ENV_KEY = "REMOTE_CHROME_URL";
+export const ENV_KEY = "RECHROME_URL";
 export const DEFAULT_PORT = 13775;
 export const RECH_DIR = join(import.meta.dir, ".rech");
 export const LOG_DIR = join(RECH_DIR, "logs");
 
-// Load .env.local from script's directory (works even when invoked from elsewhere)
 const envFile = join(import.meta.dir, ".env.local");
 
-/** Load .env.local into process.env. */
-async function loadEnv() {
-  const envRaw = await file(envFile)
-    .text()
-    .catch(() => "");
+async function loadEnvFile(path: string): Promise<boolean> {
+  const envRaw = await file(path).text().catch(() => "");
+  if (!envRaw) return false;
+  let hasKey = false;
   for (const line of envRaw.split("\n")) {
     const m = line.match(/^\s*([^#=]+?)\s*=\s*(.*?)\s*$/);
-    if (m) process.env[m[1]] = m[2].replace(/^["']|["']$/g, "");
+    if (m) {
+      process.env[m[1]] = m[2].replace(/^["']|["']$/g, "");
+      if (m[1] === ENV_KEY) hasKey = true;
+    }
+  }
+  return hasKey;
+}
+
+async function loadEnv() {
+  // Walk up from cwd first — project-local .env.local takes priority
+  let dir = process.cwd();
+  while (true) {
+    if (await loadEnvFile(join(dir, ".env.local"))) break;
+    const parent = join(dir, "..");
+    if (parent === dir) break;
+    dir = parent;
   }
+  // Fall back to script dir's .env.local
+  if (!process.env[ENV_KEY]) await loadEnvFile(envFile);
+}
+// Shell-set passthrough vars survive .env.local loading
+const _shellPassthrough: Record<string, string> = {};
+for (const k of ["PLAYWRIGHT_MCP_EXTENSION_ID","PLAYWRIGHT_MCP_EXTENSION_TOKEN","PLAYWRIGHT_MCP_PROFILE_DIRECTORY","PLAYWRIGHT_MCP_USER_DATA_DIR"] as const) {
+  if (process.env[k]) _shellPassthrough[k] = process.env[k]!;
 }
 await loadEnv();
+Object.assign(process.env, _shellPassthrough);
 
-// Watch .env.local for changes and hot-reload
 import { watch } from "node:fs";
 if (existsSync(envFile)) {
   watch(envFile, async () => {
@@ -39,8 +59,8 @@ if (existsSync(envFile)) {
 export const PASSTHROUGH_ENV_KEYS = [
   "PLAYWRIGHT_MCP_EXTENSION_ID",
   "PLAYWRIGHT_MCP_EXTENSION_TOKEN",
-  "PLAYWRIGHT_MCP_USER_DATA_DIR",
   "PLAYWRIGHT_MCP_PROFILE_DIRECTORY",
+  "PLAYWRIGHT_MCP_USER_DATA_DIR",
 ] as const;
 
 export function log(msg: string) {
@@ -54,13 +74,25 @@ export function log(msg: string) {
 
 export function parseUrl(raw: string) {
   const u = new URL(raw);
-  return { key: u.username, host: u.hostname, port: parseInt(u.port) || DEFAULT_PORT };
+  const scheme = u.protocol.replace(":", "");
+  const protocol = scheme === "https" ? "https" : "http";
+  const defaultPort = scheme === "https" ? 443 : scheme === "http" ? 80 : DEFAULT_PORT;
+  return {
+    key: u.username,
+    host: u.hostname,
+    port: parseInt(u.port) || defaultPort,
+    protocol,
+    extensionId: u.searchParams.get("extension_id") ?? undefined,
+    extensionToken: u.searchParams.get("token") ?? undefined,
+    profileDirectory: u.searchParams.get("profile") ?? undefined,
+    userDataDir: u.searchParams.get("user_data_dir") ?? undefined,
+  };
 }
 
 export async function getOrCreateUrl(): Promise<string> {
   if (process.env[ENV_KEY]) return process.env[ENV_KEY];
   const key = randomBytes(9).toString("base64url"); // 12 chars
-  const url = `remote-chrome://${key}@${hostname()}:${DEFAULT_PORT}`;
+  const url = `http://${key}@${hostname()}:${DEFAULT_PORT}`;
   const newLine = `${ENV_KEY}=${url}`;
   const envRaw = await file(envFile)
     .text()
@@ -121,49 +153,162 @@ async function getClientIdentity(): Promise<{ gitUrl?: string; hostname?: string
   return { hostname: hostname(), cwd };
 }
 
-function getClientEnv(): Record<string, string> {
+function getClientEnv(urlExtras?: { extensionId?: string; extensionToken?: string; profileDirectory?: string; userDataDir?: string }): Record<string, string> {
   const env: Record<string, string> = {};
   for (const key of PASSTHROUGH_ENV_KEYS) {
     if (process.env[key]) env[key] = process.env[key];
   }
+  if (urlExtras?.extensionId)
+    env["PLAYWRIGHT_MCP_EXTENSION_ID"] = urlExtras.extensionId;
+  if (urlExtras?.extensionToken)
+    env["PLAYWRIGHT_MCP_EXTENSION_TOKEN"] = urlExtras.extensionToken;
+  if (urlExtras?.profileDirectory)
+    env["PLAYWRIGHT_MCP_PROFILE_DIRECTORY"] = urlExtras.profileDirectory;
+  if (urlExtras?.userDataDir)
+    env["PLAYWRIGHT_MCP_USER_DATA_DIR"] = urlExtras.userDataDir;
   return env;
 }
 
-async function run(url: string, args: string[]) {
-  const { key, host, port } = parseUrl(url);
+const CHROME_LOCAL_STATE_PATHS = () => {
+  const home = process.env.HOME || "~";
+  return [
+    join(home, "Library/Application Support/Google/Chrome/Local State"),
+    join(home, ".config/google-chrome/Local State"),
+    join(home, "AppData/Local/Google/Chrome/User Data/Local State"),
+  ];
+};
+
+async function readChromeProfileCache(): Promise<Record<string, { user_name?: string; name?: string }> | null> {
+  for (const statePath of CHROME_LOCAL_STATE_PATHS()) {
+    const f = file(statePath);
+    if (!(await f.exists())) continue;
+    try {
+      const data = JSON.parse(await f.text());
+      return data?.profile?.info_cache ?? null;
+    } catch {}
+  }
+  return null;
+}
+
+async function findChromeUserDataDir(): Promise<string | null> {
+  for (const statePath of CHROME_LOCAL_STATE_PATHS()) {
+    if (!(await file(statePath).exists())) continue;
+    return dirname(statePath);
+  }
+  return null;
+}
+
+export const EXTENSION_DIST_DIR = join(
+  import.meta.dir,
+  "lib/playwright-multi-tab/lib/playwright-mcp/packages/extension/dist",
+);
+
+// Walk all Chrome profiles' Secure Preferences and find an extension
+// whose loaded `path` matches our dist directory. The extension ID Chrome
+// generates for an unpacked extension is path-dependent, so we cannot rely
+// on a hardcoded ID across machines.
+async function findInstalledExtension(
+  profileDir?: string,
+): Promise<{ id: string; profile: string } | null> {
+  const userDataDir = await findChromeUserDataDir();
+  if (!userDataDir) return null;
+  const cache = await readChromeProfileCache();
+  const profiles = profileDir ? [profileDir] : (cache ? Object.keys(cache) : []);
+  for (const prof of profiles) {
+    const prefsPath = join(userDataDir, prof, "Secure Preferences");
+    const f = file(prefsPath);
+    if (!(await f.exists())) continue;
+    try {
+      const data = JSON.parse(await f.text());
+      const settings = data?.extensions?.settings ?? {};
+      for (const [extId, info] of Object.entries(settings as Record<string, any>)) {
+        if (info?.path === EXTENSION_DIST_DIR) return { id: extId, profile: prof };
+      }
+    } catch {}
+  }
+  return null;
+}
+
+function printInstallInstructions(profileDisplay: string): void {
+  console.error("");
+  console.error("Multi-tab extension is not installed in this Chrome profile.");
+  console.error("");
+  console.error("To install:");
+  console.error("  1. Open chrome://extensions/ in the selected profile");
+  console.error(`     (profile: ${profileDisplay})`);
+  console.error("  2. Enable \"Developer mode\" (top-right toggle)");
+  console.error("  3. Click \"Load unpacked\"");
+  console.error("  4. Select this directory:");
+  console.error(`       ${EXTENSION_DIST_DIR}`);
+  console.error("  5. Re-run `rech setup`");
+  console.error("");
+}
+
+async function resolveProfileEmail(dir: string): Promise<string> {
+  const cache = await readChromeProfileCache();
+  if (cache?.[dir]?.user_name) return cache[dir].user_name;
+  return dir;
+}
+
+async function listProfiles(): Promise<void> {
+  const cache = await readChromeProfileCache();
+  if (!cache) { console.error("Chrome Local State not found"); process.exit(1); }
+
+  const current = process.env.PLAYWRIGHT_MCP_PROFILE_DIRECTORY;
+  // Resolve email/name → dir for current marker
+  let currentDir = current;
+  if (current && !/^(Default|Profile \d+)$/i.test(current)) {
+    for (const [dir, info] of Object.entries(cache)) {
+      if (info.user_name === current || info.name === current) { currentDir = dir; break; }
+    }
+  }
 
+  const rows = Object.entries(cache).map(([dir, info]) => [
+    dir,
+    info.user_name || "",
+    info.name || "",
+    dir === currentDir ? "← current" : "",
+  ]);
+  const widths = rows.reduce((w, r) => r.map((c, i) => Math.max(w[i] ?? 0, c.length)), [] as number[]);
+  for (const row of rows) {
+    console.log(row.map((c, i) => c.padEnd(widths[i])).join("  ").trimEnd());
+  }
+}
+
+async function callServe(
+  url: string,
+  args: string[],
+  overrideEnv?: Record<string, string>,
+): Promise<{ status: number; stdout: string; stderr: string; files?: string[]; existingSession?: boolean }> {
+  const { key, host, port, protocol, extensionId, extensionToken, profileDirectory, userDataDir } = parseUrl(url);
   const identity = await getClientIdentity();
-  console.error(
-    `[rech] connecting to ${host}:${port} (identity: ${identity.gitUrl || `${identity.hostname}:${identity.cwd}`})`,
-  );
-  const res = await fetch(`http://${host}:${port}/run`, {
+  const effectiveProfile = profileDirectory || process.env.PLAYWRIGHT_MCP_PROFILE_DIRECTORY;
+  if (effectiveProfile) (identity as any).profile = effectiveProfile;
+  const env = { ...getClientEnv({ extensionId, extensionToken, profileDirectory, userDataDir }), ...overrideEnv };
+  const res = await fetch(`${protocol}://${host}:${port}/run`, {
     method: "POST",
     headers: { "Content-Type": "application/json", Authorization: `Bearer ${key}` },
-    body: JSON.stringify({ args, identity, env: getClientEnv() }),
+    body: JSON.stringify({ args, identity, env }),
     signal: AbortSignal.timeout(70_000),
-  }).catch((e) => {
-    console.error(`[rech] ${e.message}`);
-    process.exit(1);
-  });
+  }).catch((e) => { console.error(`[rech] ${e.message}`); process.exit(1); });
+  if (res.status === 401) { console.error("Unauthorized: bad key"); process.exit(1); }
+  return res.json();
+}
 
-  if (res.status === 401) {
-    console.error("Unauthorized: bad key");
-    process.exit(1);
-  }
+async function run(url: string, args: string[]) {
+  const { host, port, protocol } = parseUrl(url);
+  const effectiveProfile = parseUrl(url).profileDirectory || process.env.PLAYWRIGHT_MCP_PROFILE_DIRECTORY;
+  const displayProfile = effectiveProfile ? await resolveProfileEmail(effectiveProfile) : undefined;
+  const identity = await getClientIdentity();
+  const profileSuffix = displayProfile ? ` profile:${displayProfile}` : "";
+  console.error(
+    `[rech] connecting to ${host}:${port} (identity: ${identity.gitUrl || `${identity.hostname}:${identity.cwd}`}${profileSuffix})`,
+  );
 
-  const { status, stdout, stderr, files, existingSession } = (await res.json()) as {
-    status: number;
-    stdout: string;
-    stderr: string;
-    files?: string[];
-    existingSession?: boolean;
-  };
+  const { status, stdout, stderr, files, existingSession } = await callServe(url, args);
 
-  if (existingSession) {
-    console.error(
-      `[rech] session already has open tabs — listing existing tabs instead of opening a new window`,
-    );
-  }
+  if (existingSession)
+    console.error(`[rech] session already has open tabs — listing existing tabs instead of opening a new window`);
   if (stderr) process.stderr.write(stderr);
   if (stdout) process.stdout.write(stdout);
 
@@ -173,8 +318,8 @@ async function run(url: string, args: string[]) {
     const gitignorePath = join(dlDir, ".gitignore");
     if (!existsSync(gitignorePath)) await Bun.write(gitignorePath, "*\n");
     for (const name of files) {
-      const fileRes = await fetch(`http://${host}:${port}/files/${name}`, {
-        headers: { Authorization: `Bearer ${key}` },
+      const fileRes = await fetch(`${protocol}://${host}:${port}/files/${name}`, {
+        headers: { Authorization: `Bearer ${parseUrl(url).key}` },
       });
       if (!fileRes.ok) continue;
       const dest = join(dlDir, basename(name));
@@ -186,17 +331,108 @@ async function run(url: string, args: string[]) {
   process.exit(status);
 }
 
+async function setup(): Promise<void> {
+  // 1. Require serve to be running
+  const url = process.env[ENV_KEY];
+  if (!url) {
+    console.error(`${ENV_KEY} not set — start the server first:\n  rech serve`);
+    process.exit(1);
+  }
+  const { host, port, protocol } = parseUrl(url);
+  const ping = await fetch(`${protocol}://${host}:${port}/`, { signal: AbortSignal.timeout(3000) }).catch(() => null);
+  if (!ping) {
+    console.error(`rech serve is not running at ${host}:${port}\nStart it with:\n  rech serve`);
+    process.exit(1);
+  }
+
+  // 2. Interactive profile selection
+  const cache = await readChromeProfileCache();
+  if (!cache) { console.error("Chrome profiles not found"); process.exit(1); }
+  const profiles = Object.entries(cache);
+  console.log("\nAvailable Chrome profiles:");
+  profiles.forEach(([dir, info], i) =>
+    console.log(`  ${String(i + 1).padStart(2)}.  ${(info.user_name || "(no email)").padEnd(32)}  ${(info.name || "").padEnd(20)}  [${dir}]`)
+  );
+  const { createInterface } = await import("readline");
+  const rl = createInterface({ input: process.stdin, output: process.stdout });
+  const answer = await new Promise<string>(r => rl.question("\nProfile number: ", r));
+  rl.close();
+  const idx = parseInt(answer.trim()) - 1;
+  if (isNaN(idx) || idx < 0 || idx >= profiles.length) { console.error("Invalid selection"); process.exit(1); }
+  const [profileDir, profileInfoSel] = profiles[idx];
+  const profileEnv = { PLAYWRIGHT_MCP_PROFILE_DIRECTORY: profileDir };
+  const profileDisplay = profileInfoSel.user_name || profileInfoSel.name || profileDir;
+
+  // 3. Discover the extension ID. Unpacked extension IDs are derived from the
+  //    load path, so look up the actual ID from Chrome's Secure Preferences.
+  //    Env override wins if set explicitly.
+  let extId = process.env.PLAYWRIGHT_MCP_EXTENSION_ID;
+  if (!extId) {
+    const found = await findInstalledExtension(profileDir);
+    if (found) extId = found.id;
+  }
+
+  if (!extId) {
+    printInstallInstructions(profileDisplay);
+    console.error("Opening chrome://extensions/ in the selected profile...");
+    await callServe(url, ["open", "chrome://extensions/"], profileEnv);
+    process.exit(1);
+  }
+
+  const statusUrl = `chrome-extension://${extId}/status.html`;
+  console.log(`\nOpening ${statusUrl}...`);
+  const openResult = await callServe(url, ["open", statusUrl], profileEnv);
+  if (openResult.status !== 0) { process.stderr.write(openResult.stderr); process.exit(openResult.status); }
+
+  // 4. Read token from extension page localStorage
+  const evalResult = await callServe(url, ["eval", `() => localStorage.getItem('auth-token')`], profileEnv);
+  const tokenMatch = evalResult.stdout.match(/"([A-Za-z0-9_-]{20,})"/);
+  const token = tokenMatch?.[1];
+  if (!token) {
+    printInstallInstructions(profileDisplay);
+    console.error("Tried to read the auth token from the extension's status page but failed.");
+    console.error("This usually means the extension is not loaded in this profile.");
+    process.exit(1);
+  }
+
+  // 5. Write single RECHROME_URL with all params to ~/.env.local
+  const home = process.env.HOME!;
+  const globalEnvPath = join(home, ".env.local");
+  const existing = await file(globalEnvPath).text().catch(() => "");
+  const rechUrl = new URL(url);
+  rechUrl.searchParams.set("extension_id", extId);
+  rechUrl.searchParams.set("token", token);
+  // Prefer email for readability, fall back to directory name
+  rechUrl.searchParams.set("profile", profileInfoSel.user_name || profileDir);
+  const userDataDir = await findChromeUserDataDir();
+  if (userDataDir) rechUrl.searchParams.set("user_data_dir", userDataDir);
+  const newLine = `RECHROME_URL=${rechUrl.toString()}`;
+  // Remove old separate vars and update RECHROME_URL
+  const keysToRemove = ["PLAYWRIGHT_MCP_USER_DATA_DIR", "PLAYWRIGHT_MCP_EXTENSION_ID", "PLAYWRIGHT_MCP_EXTENSION_TOKEN", "PLAYWRIGHT_MCP_PROFILE_DIRECTORY"];
+  let lines = existing.trimEnd().split("\n").filter(l => !keysToRemove.some(k => l.startsWith(`${k}=`)));
+  const rechIdx = lines.findIndex(l => l.startsWith("RECHROME_URL="));
+  if (rechIdx >= 0) lines[rechIdx] = newLine;
+  else lines.push(newLine);
+  await Bun.write(globalEnvPath, lines.join("\n").trim() + "\n");
+  console.log(`\nSaved to ${globalEnvPath}:\n  ${newLine}`);
+  console.log("\nDone!");
+}
+
 if (import.meta.main) {
   const args = process.argv.slice(2);
 
   if (args[0] === "serve") {
     const { serve } = await import("./serve.ts");
     serve();
+  } else if (args[0] === "profiles") {
+    await listProfiles();
+  } else if (args[0] === "setup") {
+    await setup();
   } else {
     const url = process.env[ENV_KEY];
     if (!url) {
       console.error(
-        `Usage:\n  rech serve\n  ${ENV_KEY}=remote-chrome://key@host:${DEFAULT_PORT} rech <playwright-args...>`,
+        `Usage:\n  rech serve\n  ${ENV_KEY}=http://key@host:${DEFAULT_PORT}?extension_id=ID&token=TOKEN rech <playwright-args...>\n  ${ENV_KEY}=https://key@host/path?extension_id=ID&token=TOKEN rech <playwright-args...>`,
       );
       process.exit(1);
     }

package/serve.js

@@ -1,6 +1,6 @@
 import { file } from "bun";
-import { createHash } from "crypto";
-import { mkdirSync } from "fs";
+import { createHash, X509Certificate } from "crypto";
+import { mkdirSync, unlinkSync } from "fs";
 import { join, resolve, relative, isAbsolute } from "path";
 import {
   log,
@@ -11,12 +11,59 @@ import {
   PASSTHROUGH_ENV_KEYS,
 } from "./rech.js";
 
+const TAILSCALE_BIN = process.env.TAILSCALE_BIN || "/Applications/Tailscale.app/Contents/MacOS/Tailscale";
+const CERT_RENEW_THRESHOLD_DAYS = 7;
+
+async function renewCertIfNeeded(certPath: string, keyPath: string): Promise<boolean> {
+  const certContent = await file(certPath).text().catch(() => null);
+  if (!certContent) return false;
+  try {
+    const cert = new X509Certificate(certContent);
+    const daysLeft = (new Date(cert.validTo).getTime() - Date.now()) / 86_400_000;
+    if (daysLeft > CERT_RENEW_THRESHOLD_DAYS) return false;
+    const domain = cert.subjectAltName?.match(/DNS:([^\s,]+)/)?.[1];
+    if (!domain) { log("TLS cert renewal: could not determine domain"); return false; }
+    log(`TLS cert expires in ${Math.floor(daysLeft)} days, renewing ${domain}...`);
+    const proc = Bun.spawn([TAILSCALE_BIN, "cert", "--cert-file", certPath, "--key-file", keyPath, domain], {
+      stdout: "pipe", stderr: "pipe",
+    });
+    const [status, stderr] = await Promise.all([proc.exited, new Response(proc.stderr).text()]);
+    if (status !== 0) { log(`TLS cert renewal failed: ${stderr.trim()}`); return false; }
+    log(`TLS cert renewed for ${domain}`);
+    return true;
+  } catch (e) {
+    log(`TLS cert check error: ${e}`);
+    return false;
+  }
+}
+
 export function isUnderDir(base: string, candidate: string): boolean {
   const absBase = resolve(base) + "/";
   const absCandidate = resolve(base, candidate);
   return absCandidate.startsWith(absBase);
 }
 
+async function resolveProfileDirectory(nameOrEmail: string): Promise<string> {
+  if (/^(Default|Profile \d+)$/i.test(nameOrEmail)) return nameOrEmail;
+  const home = process.env.HOME || "~";
+  const candidates = [
+    join(home, "Library/Application Support/Google/Chrome/Local State"),
+    join(home, ".config/google-chrome/Local State"),
+    join(home, "AppData/Local/Google/Chrome/User Data/Local State"),
+  ];
+  for (const statePath of candidates) {
+    const f = file(statePath);
+    if (!(await f.exists())) continue;
+    const data = JSON.parse(await f.text());
+    const cache: Record<string, any> = data?.profile?.info_cache ?? {};
+    for (const [dir, info] of Object.entries(cache)) {
+      if ([info.name, info.user_name, info.gaia_name].includes(nameOrEmail))
+        return dir;
+    }
+  }
+  return nameOrEmail;
+}
+
 export async function serve() {
   const url = await getOrCreateUrl();
   const { key, port } = parseUrl(url);
@@ -25,9 +72,21 @@ export async function serve() {
   mkdirSync(workDir, { recursive: true });
 
   const listenHost = process.env.RECH_HOST || "127.0.0.1";
+  const certPath = process.env.RECH_TLS_CERT;
+  const keyPath = process.env.RECH_TLS_KEY;
+  if (certPath && keyPath) {
+    const renewed = await renewCertIfNeeded(certPath, keyPath);
+    if (renewed) { log("Restarting to load renewed TLS cert..."); process.exit(0); }
+    // Check daily; pm2 restarts cleanly after exit(0)
+    setInterval(async () => {
+      if (await renewCertIfNeeded(certPath, keyPath)) { log("Restarting to load renewed TLS cert..."); process.exit(0); }
+    }, 86_400_000);
+  }
+  const tls = certPath && keyPath ? { cert: Bun.file(certPath), key: Bun.file(keyPath) } : undefined;
   const server = Bun.serve({
     hostname: listenHost,
     port,
+    tls,
     async fetch(req) {
       const reqUrl = new URL(req.url);
 
@@ -61,9 +120,10 @@ export async function serve() {
       } else {
         args = body.args;
         const id = body.identity as
-          | { gitUrl?: string; hostname?: string; cwd?: string }
+          | { gitUrl?: string; hostname?: string; cwd?: string; profile?: string }
           | undefined;
-        const raw = id?.gitUrl || (id?.hostname && id?.cwd ? `${id.hostname}:${id.cwd}` : null);
+        const baseId = id?.gitUrl || (id?.hostname && id?.cwd ? `${id.hostname}:${id.cwd}` : null);
+        const raw = baseId && id?.profile ? `${baseId}@${id.profile}` : baseId;
         if (raw) {
           sessionId = createHash("sha256").update(raw).digest("hex").slice(0, 12);
           clientName = raw;
@@ -101,11 +161,15 @@ export async function serve() {
 
       log(`run: rech ${filteredArgs.join(" ")} (session=${namespacedSession})`);
 
-      // For open commands, check if this session already has tabs open
+      // For open commands, default to about:blank to avoid leaving connect.html visible
       const isOpenCmd = filteredArgs[0] === "open";
-      if (isOpenCmd) {
+      if (isOpenCmd && filteredArgs.length === 1)
+        filteredArgs.push("about:blank");
+
+      // bare `rech open` with no URL: warn if session already has tabs
+      if (isOpenCmd && filteredArgs.length === 1) {
         try {
-          const listProc = Bun.spawn([bin, ...binArgs, "tab-list", "--extension", `-s=${namespacedSession}`], {
+          const listProc = Bun.spawn([bin, ...binArgs, "tab-list", `-s=${namespacedSession}`], {
             cwd: workDir,
             stdin: "ignore",
             stdout: "pipe",
@@ -138,6 +202,14 @@ export async function serve() {
       }
       Object.assign(passthroughEnv, clientEnv);
 
+      // Resolve profile name/email → directory name
+      if (passthroughEnv.PLAYWRIGHT_MCP_PROFILE_DIRECTORY) {
+        const resolved = await resolveProfileDirectory(passthroughEnv.PLAYWRIGHT_MCP_PROFILE_DIRECTORY);
+        if (resolved !== passthroughEnv.PLAYWRIGHT_MCP_PROFILE_DIRECTORY)
+          log(`profile resolved: "${passthroughEnv.PLAYWRIGHT_MCP_PROFILE_DIRECTORY}" → "${resolved}"`);
+        passthroughEnv.PLAYWRIGHT_MCP_PROFILE_DIRECTORY = resolved;
+      }
+
       const childEnv: Record<string, string | undefined> = {
         PATH: process.env.PATH,
         HOME: process.env.HOME,
@@ -146,8 +218,30 @@ export async function serve() {
         XDG_RUNTIME_DIR: process.env.XDG_RUNTIME_DIR,
         ...(clientName ? { PLAYWRIGHT_MCP_CLIENT_NAME: clientName } : {}),
         ...passthroughEnv,
+        // Enable extension bridge when credentials are present
+        ...(passthroughEnv.PLAYWRIGHT_MCP_EXTENSION_ID && passthroughEnv.PLAYWRIGHT_MCP_EXTENSION_TOKEN
+          ? { PLAYWRIGHT_MCP_EXTENSION: "1" }
+          : {}),
       };
-      const proc = Bun.spawn([bin, ...binArgs, ...filteredArgs, "--extension", `-s=${namespacedSession}`], {
+      // For open commands: clean up stale sockets so a closed browser can be reopened
+      if (isOpenCmd) {
+        const tmpDir = (process.env.TMPDIR || "/tmp").replace(/\/$/, "");
+        const playwrightTmpDir = `${tmpDir}/playwright-cli`;
+        try {
+          const { readdirSync } = await import("fs");
+          for (const sub of readdirSync(playwrightTmpDir)) {
+            const subDir = `${playwrightTmpDir}/${sub}`;
+            for (const f of readdirSync(subDir)) {
+              if (f.startsWith(namespacedSession)) {
+                const sockPath = `${subDir}/${f}`;
+                try { unlinkSync(sockPath); log(`Removed stale socket: ${sockPath}`); } catch {}
+              }
+            }
+          }
+        } catch {}
+      }
+
+      const proc = Bun.spawn([bin, ...binArgs, ...filteredArgs, `-s=${namespacedSession}`], {
         cwd: workDir,
         stdin: "ignore",
         stdout: "pipe",
@@ -171,7 +265,7 @@ export async function serve() {
         timeout.then(() => [1, "", ""] as [number, string, string]),
       ]).catch(
         () => [1, "", `Command timed out after ${TIMEOUT / 1000}s\n`] as [number, string, string],
-      );
+      ) as [number, string, string];
 
       log(`exit: ${status}${stdout.trim() ? ` | ${stdout.trim().slice(0, 200)}` : ""}`);
 
@@ -209,6 +303,6 @@ export async function serve() {
     },
   });
 
-  log(`serving on http://${server.hostname}:${server.port}`);
+  log(`serving on ${tls ? "https" : "http"}://${server.hostname}:${server.port}`);
   log(`Connection URL set (use .env.local to view)`);
 }

package/serve.ts

@@ -1,6 +1,6 @@
 import { file } from "bun";
-import { createHash } from "crypto";
-import { mkdirSync } from "fs";
+import { createHash, X509Certificate } from "crypto";
+import { mkdirSync, unlinkSync } from "fs";
 import { join, resolve, relative, isAbsolute } from "path";
 import {
   log,
@@ -11,12 +11,59 @@ import {
   PASSTHROUGH_ENV_KEYS,
 } from "./rech.ts";
 
+const TAILSCALE_BIN = process.env.TAILSCALE_BIN || "/Applications/Tailscale.app/Contents/MacOS/Tailscale";
+const CERT_RENEW_THRESHOLD_DAYS = 7;
+
+async function renewCertIfNeeded(certPath: string, keyPath: string): Promise<boolean> {
+  const certContent = await file(certPath).text().catch(() => null);
+  if (!certContent) return false;
+  try {
+    const cert = new X509Certificate(certContent);
+    const daysLeft = (new Date(cert.validTo).getTime() - Date.now()) / 86_400_000;
+    if (daysLeft > CERT_RENEW_THRESHOLD_DAYS) return false;
+    const domain = cert.subjectAltName?.match(/DNS:([^\s,]+)/)?.[1];
+    if (!domain) { log("TLS cert renewal: could not determine domain"); return false; }
+    log(`TLS cert expires in ${Math.floor(daysLeft)} days, renewing ${domain}...`);
+    const proc = Bun.spawn([TAILSCALE_BIN, "cert", "--cert-file", certPath, "--key-file", keyPath, domain], {
+      stdout: "pipe", stderr: "pipe",
+    });
+    const [status, stderr] = await Promise.all([proc.exited, new Response(proc.stderr).text()]);
+    if (status !== 0) { log(`TLS cert renewal failed: ${stderr.trim()}`); return false; }
+    log(`TLS cert renewed for ${domain}`);
+    return true;
+  } catch (e) {
+    log(`TLS cert check error: ${e}`);
+    return false;
+  }
+}
+
 export function isUnderDir(base: string, candidate: string): boolean {
   const absBase = resolve(base) + "/";
   const absCandidate = resolve(base, candidate);
   return absCandidate.startsWith(absBase);
 }
 
+async function resolveProfileDirectory(nameOrEmail: string): Promise<string> {
+  if (/^(Default|Profile \d+)$/i.test(nameOrEmail)) return nameOrEmail;
+  const home = process.env.HOME || "~";
+  const candidates = [
+    join(home, "Library/Application Support/Google/Chrome/Local State"),
+    join(home, ".config/google-chrome/Local State"),
+    join(home, "AppData/Local/Google/Chrome/User Data/Local State"),
+  ];
+  for (const statePath of candidates) {
+    const f = file(statePath);
+    if (!(await f.exists())) continue;
+    const data = JSON.parse(await f.text());
+    const cache: Record<string, any> = data?.profile?.info_cache ?? {};
+    for (const [dir, info] of Object.entries(cache)) {
+      if ([info.name, info.user_name, info.gaia_name].includes(nameOrEmail))
+        return dir;
+    }
+  }
+  return nameOrEmail;
+}
+
 export async function serve() {
   const url = await getOrCreateUrl();
   const { key, port } = parseUrl(url);
@@ -25,9 +72,21 @@ export async function serve() {
   mkdirSync(workDir, { recursive: true });
 
   const listenHost = process.env.RECH_HOST || "127.0.0.1";
+  const certPath = process.env.RECH_TLS_CERT;
+  const keyPath = process.env.RECH_TLS_KEY;
+  if (certPath && keyPath) {
+    const renewed = await renewCertIfNeeded(certPath, keyPath);
+    if (renewed) { log("Restarting to load renewed TLS cert..."); process.exit(0); }
+    // Check daily; pm2 restarts cleanly after exit(0)
+    setInterval(async () => {
+      if (await renewCertIfNeeded(certPath, keyPath)) { log("Restarting to load renewed TLS cert..."); process.exit(0); }
+    }, 86_400_000);
+  }
+  const tls = certPath && keyPath ? { cert: Bun.file(certPath), key: Bun.file(keyPath) } : undefined;
   const server = Bun.serve({
     hostname: listenHost,
     port,
+    tls,
     async fetch(req) {
       const reqUrl = new URL(req.url);
 
@@ -61,9 +120,10 @@ export async function serve() {
       } else {
         args = body.args;
         const id = body.identity as
-          | { gitUrl?: string; hostname?: string; cwd?: string }
+          | { gitUrl?: string; hostname?: string; cwd?: string; profile?: string }
           | undefined;
-        const raw = id?.gitUrl || (id?.hostname && id?.cwd ? `${id.hostname}:${id.cwd}` : null);
+        const baseId = id?.gitUrl || (id?.hostname && id?.cwd ? `${id.hostname}:${id.cwd}` : null);
+        const raw = baseId && id?.profile ? `${baseId}@${id.profile}` : baseId;
         if (raw) {
           sessionId = createHash("sha256").update(raw).digest("hex").slice(0, 12);
           clientName = raw;
@@ -101,11 +161,15 @@ export async function serve() {
 
       log(`run: rech ${filteredArgs.join(" ")} (session=${namespacedSession})`);
 
-      // For open commands, check if this session already has tabs open
+      // For open commands, default to about:blank to avoid leaving connect.html visible
       const isOpenCmd = filteredArgs[0] === "open";
-      if (isOpenCmd) {
+      if (isOpenCmd && filteredArgs.length === 1)
+        filteredArgs.push("about:blank");
+
+      // bare `rech open` with no URL: warn if session already has tabs
+      if (isOpenCmd && filteredArgs.length === 1) {
         try {
-          const listProc = Bun.spawn([bin, ...binArgs, "tab-list", "--extension", `-s=${namespacedSession}`], {
+          const listProc = Bun.spawn([bin, ...binArgs, "tab-list", `-s=${namespacedSession}`], {
             cwd: workDir,
             stdin: "ignore",
             stdout: "pipe",
@@ -138,6 +202,14 @@ export async function serve() {
       }
       Object.assign(passthroughEnv, clientEnv);
 
+      // Resolve profile name/email → directory name
+      if (passthroughEnv.PLAYWRIGHT_MCP_PROFILE_DIRECTORY) {
+        const resolved = await resolveProfileDirectory(passthroughEnv.PLAYWRIGHT_MCP_PROFILE_DIRECTORY);
+        if (resolved !== passthroughEnv.PLAYWRIGHT_MCP_PROFILE_DIRECTORY)
+          log(`profile resolved: "${passthroughEnv.PLAYWRIGHT_MCP_PROFILE_DIRECTORY}" → "${resolved}"`);
+        passthroughEnv.PLAYWRIGHT_MCP_PROFILE_DIRECTORY = resolved;
+      }
+
       const childEnv: Record<string, string | undefined> = {
         PATH: process.env.PATH,
         HOME: process.env.HOME,
@@ -146,8 +218,30 @@ export async function serve() {
         XDG_RUNTIME_DIR: process.env.XDG_RUNTIME_DIR,
         ...(clientName ? { PLAYWRIGHT_MCP_CLIENT_NAME: clientName } : {}),
         ...passthroughEnv,
+        // Enable extension bridge when credentials are present
+        ...(passthroughEnv.PLAYWRIGHT_MCP_EXTENSION_ID && passthroughEnv.PLAYWRIGHT_MCP_EXTENSION_TOKEN
+          ? { PLAYWRIGHT_MCP_EXTENSION: "1" }
+          : {}),
       };
-      const proc = Bun.spawn([bin, ...binArgs, ...filteredArgs, "--extension", `-s=${namespacedSession}`], {
+      // For open commands: clean up stale sockets so a closed browser can be reopened
+      if (isOpenCmd) {
+        const tmpDir = (process.env.TMPDIR || "/tmp").replace(/\/$/, "");
+        const playwrightTmpDir = `${tmpDir}/playwright-cli`;
+        try {
+          const { readdirSync } = await import("fs");
+          for (const sub of readdirSync(playwrightTmpDir)) {
+            const subDir = `${playwrightTmpDir}/${sub}`;
+            for (const f of readdirSync(subDir)) {
+              if (f.startsWith(namespacedSession)) {
+                const sockPath = `${subDir}/${f}`;
+                try { unlinkSync(sockPath); log(`Removed stale socket: ${sockPath}`); } catch {}
+              }
+            }
+          }
+        } catch {}
+      }
+
+      const proc = Bun.spawn([bin, ...binArgs, ...filteredArgs, `-s=${namespacedSession}`], {
         cwd: workDir,
         stdin: "ignore",
         stdout: "pipe",
@@ -171,7 +265,7 @@ export async function serve() {
         timeout.then(() => [1, "", ""] as [number, string, string]),
       ]).catch(
         () => [1, "", `Command timed out after ${TIMEOUT / 1000}s\n`] as [number, string, string],
-      );
+      ) as [number, string, string];
 
       log(`exit: ${status}${stdout.trim() ? ` | ${stdout.trim().slice(0, 200)}` : ""}`);
 
@@ -209,6 +303,6 @@ export async function serve() {
     },
   });
 
-  log(`serving on http://${server.hostname}:${server.port}`);
+  log(`serving on ${tls ? "https" : "http"}://${server.hostname}:${server.port}`);
   log(`Connection URL set (use .env.local to view)`);
 }