[Nithin (felarof99)]

Summary

• Adds apps/agent/web/ — a standalone Vite server (localhost:5300) that runs the existing extension UI (entrypoints/app) as a plain web page, no chrome-extension:// load.
• Connects to the real apps/server over the production HTTP/SSE path — a true integration target (real UI + transport + agent loop + tools), with only boot-time chrome.* plumbing faked.
• Drivable by agent-browser for e2e; example script (web/e2e/chat.e2e.sh) + runbook (web/README.md) included.

Design

The UI boots via a shim (web/shim.ts) that installs @webext-core/fake-browser as globalThis.chrome/browser (in-memory storage/tabs/runtime) plus a thin chrome.browserOS stub (web/browseros-stub.ts). The stub's only truthful call is getPref('browseros.server.mcp_port'), returning the real server port from VITE_BROWSEROS_MCP_PORT — so the app's existing getAgentServerUrl() resolution targets the real server with zero app-code changes. No server change was needed: isTrustedAppOrigin already trusts any http://localhost:* origin and CORS is permissive. import.meta.env.DEV (true under Vite) enables all capability features, so the UI renders without login. Production entrypoints/app/* are untouched; web scripts auto-run codegen + wxt prepare so the standalone build reuses WXT's exact TS setup.

Test plan

• bun run dev:watch (real BrowserOS + server; note the MCP port)
• cd apps/agent && VITE_BROWSEROS_MCP_PORT=<port> bun run web → open http://localhost:5300 → agent UI renders
• Configure an LLM provider in the web UI, send a chat, confirm a streamed reply from the real server
• Drive web/e2e/chat.e2e.sh with agent-browser (fill refs from snapshot -i)

Verified locally: vite build passes; runtime boot via agent-browser mounts React and renders the real UI; getPref(mcp_port)→9100, runtime.lastError→undefined, getManifest().version→0.0.0-web; biome clean.

🤖 Generated with Claude Code

[greptile-apps]

Greptile Summary

This PR adds apps/agent/web/ — a standalone Vite dev server (port 5300) that serves the existing extension UI as a plain web page for e2e testing, wiring it to the real apps/server via HTTP/SSE with only the chrome.* extension APIs shimmed using @webext-core/fake-browser and a thin chrome.browserOS stub.

• web/shim.ts + web/browseros-stub.ts: Install fakeBrowser as globalThis.chrome/browser and provide a localStorage-backed pref store; the MCP port pref is seeded from VITE_BROWSEROS_MCP_PORT so getAgentServerUrl() targets the real server with zero changes to app code.
• web/vite.config.ts: Standalone Vite config with path aliases mirroring WXT's tsconfig and a direct alias of the #imports virtual module to @wxt-dev/storage.
• web/e2e/chat.e2e.sh: Example agent-browser CLI driver script for end-to-end chat flow validation.

Confidence Score: 3/5

The web harness is dev-only and does not touch production extension paths, but the MCP port seeding logic can leave the harness silently connected to the wrong server across runs.

The MCP port stored in localStorage is never overwritten when VITE_BROWSEROS_MCP_PORT changes between dev sessions. A developer who first ran with port 9100 and then restarts the server on 9200 will see the harness make requests to the old port with no error or warning.

packages/browseros-agent/apps/agent/web/browseros-stub.ts — the PrefStore constructor port-seeding guard needs to always honour the build-time env var over a stale stored value.

Important Files Changed

Filename	Overview
packages/browseros-agent/apps/agent/web/browseros-stub.ts	localStorage-backed pref store with a MCP-port seeding bug: the build-time env var is ignored on subsequent runs when a value already exists in localStorage, so port changes are silently missed
packages/browseros-agent/apps/agent/web/shim.ts	Installs fakeBrowser as globalThis.chrome/browser with sidePanel and BrowserOS stubs; correct module-evaluation ordering via shim import before app bootstrap
packages/browseros-agent/apps/agent/web/vite.config.ts	Standalone Vite config for the web harness; the #imports alias to @wxt-dev/storage is fragile if app code ever imports non-storage exports from that virtual module
packages/browseros-agent/apps/agent/web/main.tsx	Thin entry point that loads the shim before the real app; import order correctly ensures chrome globals are available before app module evaluation
packages/browseros-agent/apps/agent/web/e2e/chat.e2e.sh	Example agent-browser e2e script; placeholder element refs are clearly documented as requiring replacement from a live snapshot
packages/browseros-agent/apps/agent/package.json	Adds web/web:build/web:prepare scripts and new devDependencies (vite, @vitejs/plugin-react, @webext-core/fake-browser)

Sequence Diagram

sequenceDiagram
    participant Dev as Developer / agent-browser
    participant Vite as Vite (localhost:5300)
    participant Shim as web/shim.ts + browseros-stub.ts
    participant App as entrypoints/app (React UI)
    participant Server as apps/server (real)

    Dev->>Vite: open http://localhost:5300
    Vite->>Shim: import './shim' (ES module, depth-first)
    Shim->>Shim: install fakeBrowser as globalThis.chrome/browser
    Shim->>Shim: seed chrome.browserOS stubs
    Shim->>Shim: seed MCP port from VITE_BROWSEROS_MCP_PORT
    Vite->>App: import entrypoints/app/main
    App->>Shim: chrome.browserOS.getPref(mcp_port)
    Shim-->>App: real port value
    App->>Server: HTTP/SSE to real server
    Server-->>App: streamed agent reply
    App-->>Dev: rendered chat UI

Loading

Prompt To Fix All With AI

Fix the following 2 code review issues. Work through them one at a time, proposing concise fixes.

---

### Issue 1 of 2
packages/browseros-agent/apps/agent/web/browseros-stub.ts:35-42
**Stale MCP port not refreshed when env var changes**

`PrefStore` only seeds `MCP_PORT_PREF` when the stored value is `null`, so any cached value from a previous session is silently reused. If a developer restarts the harness with a different `VITE_BROWSEROS_MCP_PORT` (e.g. because the server moved from 9100 to 9200), the old port stays in `localStorage` and the harness silently continues to target the wrong server — no error, no redirect, just a failed SSE connection.

The build-time env var should always take precedence over the persisted value. The seed guard should be split: if `import.meta.env.VITE_BROWSEROS_MCP_PORT` is explicitly set, write it unconditionally; otherwise fall back to the stored value or the compile-time default.

### Issue 2 of 2
packages/browseros-agent/apps/agent/web/vite.config.ts:19-20
The `#imports` alias maps the entire WXT virtual module to `@wxt-dev/storage`. If any production app file later imports something other than storage from `#imports` (e.g. `import { browser } from '#imports'`), Vite will silently resolve it to `@wxt-dev/storage`, returning `undefined` for unknown named exports — no build error, only a runtime crash. A comment marking this assumption is worth making explicit so a future importer knows it will break the web harness silently.

```suggestion
      // WXT's #imports virtual module — ONLY `storage` is imported from it in the
      // current codebase. If any file adds `import { browser } from '#imports'` or
      // similar, this alias will silently resolve to @wxt-dev/storage (which does
      // not export `browser`), causing a runtime crash with no build error.
      { find: '#imports', replacement: '@wxt-dev/storage' },
```

_{Reviews (1): Last reviewed commit: "fix(agent): harden web-harness MCP port ..." | Re-trigger Greptile}

[greptile-apps]

Stale MCP port not refreshed when env var changes

PrefStore only seeds MCP_PORT_PREF when the stored value is null, so any cached value from a previous session is silently reused. If a developer restarts the harness with a different VITE_BROWSEROS_MCP_PORT (e.g. because the server moved from 9100 to 9200), the old port stays in localStorage and the harness silently continues to target the wrong server — no error, no redirect, just a failed SSE connection.

The build-time env var should always take precedence over the persisted value. The seed guard should be split: if import.meta.env.VITE_BROWSEROS_MCP_PORT is explicitly set, write it unconditionally; otherwise fall back to the stored value or the compile-time default.

Prompt To Fix With AI

This is a comment left during a code review.
Path: packages/browseros-agent/apps/agent/web/browseros-stub.ts
Line: 35-42

Comment:
**Stale MCP port not refreshed when env var changes**

`PrefStore` only seeds `MCP_PORT_PREF` when the stored value is `null`, so any cached value from a previous session is silently reused. If a developer restarts the harness with a different `VITE_BROWSEROS_MCP_PORT` (e.g. because the server moved from 9100 to 9200), the old port stays in `localStorage` and the harness silently continues to target the wrong server — no error, no redirect, just a failed SSE connection.

The build-time env var should always take precedence over the persisted value. The seed guard should be split: if `import.meta.env.VITE_BROWSEROS_MCP_PORT` is explicitly set, write it unconditionally; otherwise fall back to the stored value or the compile-time default.

How can I resolve this? If you propose a fix, please make it concise.

[greptile-apps]

The #imports alias maps the entire WXT virtual module to @wxt-dev/storage. If any production app file later imports something other than storage from #imports (e.g. import { browser } from '#imports'), Vite will silently resolve it to @wxt-dev/storage, returning undefined for unknown named exports — no build error, only a runtime crash. A comment marking this assumption is worth making explicit so a future importer knows it will break the web harness silently.

Suggested change

	// WXT's #imports virtual module — only `storage` is imported from it
	{ find: '#imports', replacement: '@wxt-dev/storage' },
	// WXT's #imports virtual module — ONLY `storage` is imported from it in the
	// current codebase. If any file adds `import { browser } from '#imports'` or
	// similar, this alias will silently resolve to @wxt-dev/storage (which does
	// not export `browser`), causing a runtime crash with no build error.
	{ find: '#imports', replacement: '@wxt-dev/storage' },

Prompt To Fix With AI

This is a comment left during a code review.
Path: packages/browseros-agent/apps/agent/web/vite.config.ts
Line: 19-20

Comment:
The `#imports` alias maps the entire WXT virtual module to `@wxt-dev/storage`. If any production app file later imports something other than storage from `#imports` (e.g. `import { browser } from '#imports'`), Vite will silently resolve it to `@wxt-dev/storage`, returning `undefined` for unknown named exports — no build error, only a runtime crash. A comment marking this assumption is worth making explicit so a future importer knows it will break the web harness silently.

```suggestion
      // WXT's #imports virtual module — ONLY `storage` is imported from it in the
      // current codebase. If any file adds `import { browser } from '#imports'` or
      // similar, this alias will silently resolve to @wxt-dev/storage (which does
      // not export `browser`), causing a runtime crash with no build error.
      { find: '#imports', replacement: '@wxt-dev/storage' },
```

How can I resolve this? If you propose a fix, please make it concise.

Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!

[Nikhil (shadowfax92)]

Thanks so much for contributing to BrowserOS! 🙏

We're doing some housekeeping on our PR queue and closing out PRs that have been open for more than 7 days. This isn't a reflection on your work — we really appreciate the time and effort you put in.

If this is still relevant, please feel free to reopen it or open a fresh PR and we'll take another look. Thanks again for being part of the project! 🚀