feat(web): a browser manifest that promises only what a tab can do, and unit suites for the stand-ins

- web/ai-extension/manifest.js: the desktop manifest minus the commands, settings and welcome
  copy that need a shell, a disk or a local process; a key the browser lets through (Ctrl+Shift+I
  is developer tools on Windows and Linux).
- unit suites in the gate (scripts/test-extensions.sh now also runs web/test/unit): path and
  crypto are compared with Node over many inputs (the comparison found three differences in the
  first path shim), fs for the behaviours and error codes the extension relies on, host.js for
  both modes, the manifest for dangling references.
- the e2e also runs with webviews and the extension host on origins of their own, where the
  extension's requests come from a per-session v--<hash> origin.

Author: ndemianc

scripts/test-extensions.sh

@@ -3,8 +3,9 @@
 # Run every extension's unit suites. This is the gate: the release workflow runs it before spending
 # an hour of macOS build minutes, and every pull request runs it too (.github/workflows/test.yml).
 #
-# It DISCOVERS suites — extensions/*/test/*.test.js — so a new one is gated the moment it is added,
-# with no list to keep in sync. (The gate used to `cd extensions/levelcode-ai`; levelcode-updater's
+# It DISCOVERS suites — extensions/*/test/*.test.js, and the browser edition's unit suites in
+# web/test/unit/*.test.js — so a new one is gated the moment it is added, with no list to keep in sync.
+# (web/test/e2e.mjs drives a real browser against a built editor; it is not a unit suite and is not here.) (The gate used to `cd extensions/levelcode-ai`; levelcode-updater's
 # suites never ran, including the one guarding the Download button against serving a raw .app.zip.)
 # Requires are file-relative, so the suites run from the repo root.
 #
@@ -17,14 +18,14 @@ shopt -s nullglob
 cd "$(dirname "$0")/.."
 
 count=0
-for t in extensions/*/test/*.test.js; do
+for t in extensions/*/test/*.test.js web/test/unit/*.test.js; do
   echo "── $t"
   node "$t"          # `set -e` stops at the first suite that fails
   count=$((count + 1))
 done
 # A glob that matches nothing would otherwise report success and gate nothing. Fail loudly instead.
 if [ "$count" -eq 0 ]; then
-  echo "::error::No suites matched extensions/*/test/*.test.js — the gate would pass vacuously."
+  echo "::error::No suites matched extensions/*/test/*.test.js or web/test/unit/*.test.js — the gate would pass vacuously."
   exit 1
 fi
 echo "──────── $count test files passed ────────"

web/ai-extension/build.mjs

@@ -106,10 +106,11 @@ await esbuild.build({
 fs.rmSync(generated, { force: true });
 
 /* ----- manifest + the files it refers to ---------------------------------------------------- */
-const pkg = JSON.parse(fs.readFileSync(path.join(SRC, 'package.json'), 'utf8'));
-pkg.browser = './extension.web.js';
+const { toWebManifest } = createRequire(import.meta.url)('./manifest.js');
+const pkg = toWebManifest(JSON.parse(fs.readFileSync(path.join(SRC, 'package.json'), 'utf8')));
 fs.writeFileSync(path.join(outDir, 'package.json'), JSON.stringify(pkg, null, '\t') + '\n');
-for (const f of ['README.md', 'package.nls.json']) { if (fs.existsSync(path.join(SRC, f))) { fs.copyFileSync(path.join(SRC, f), path.join(outDir, f)); } }
+fs.writeFileSync(path.join(outDir, 'package.nls.json'), '{}\n');   // the workbench asks for it; there is nothing to localise
+for (const f of ['README.md']) { if (fs.existsSync(path.join(SRC, f))) { fs.copyFileSync(path.join(SRC, f), path.join(outDir, f)); } }
 fs.cpSync(path.join(SRC, 'media'), path.join(outDir, 'media'), { recursive: true });
 
 const size = fs.statSync(path.join(outDir, 'extension.web.js')).size;

web/ai-extension/manifest.js

@@ -0,0 +1,92 @@
+// The manifest of levelcode-ai as the browser build ships it.
+//
+// The desktop manifest promises things a browser tab cannot do: an agent that runs commands, MCP
+// servers started as local processes, importing settings from VS Code on this machine, a folder
+// of sessions on disk. A browser build that lists them would offer a command that always fails
+// and a setting that does nothing. So the browser manifest is the desktop one with those removed,
+// and a welcome page that says what is here. Nothing in the desktop manifest changes.
+//
+// Plain CommonJS so the gate can run it (web/test/unit/manifest.test.js) and build.mjs can load it.
+'use strict';
+
+/** Commands that need a machine, or a part of LevelCode that is not in the browser build. */
+const REMOVED_COMMANDS = new Set([
+	'levelcode.customize',          // the customization pack is a desktop extension
+	'levelcode.import.vscode',      // reads another editor's settings from this machine's disk
+	'levelcode.ai.manageMcp',       // MCP servers are local processes
+	'levelcode.ai.sketch',          // Agent Sketch has not been run in the browser
+]);
+
+/** Settings that only mean something with a shell, a local disk or a local model server. */
+const REMOVED_SETTINGS = new Set([
+	'levelcode.ai.commandTimeout',
+	'levelcode.ai.verify.command',
+	'levelcode.ai.preview.autoOpen',
+	'levelcode.ai.mcp.servers',
+	'levelcode.ai.mcp.toolPolicy',
+	'levelcode.ai.sessions.dir',
+	'levelcode.ai.ollama.url',
+	'levelcode.ai.ollama.model',
+]);
+
+const WELCOME = {
+	id: 'welcome',
+	title: 'Welcome to LevelCode',
+	description: 'Your AI code editor, in a browser tab. Sign in and start.',
+	steps: [
+		{
+			id: 'ai',
+			title: 'Connect your AI',
+			description: 'Chat with your files as context, get inline completions as you type, and let the agent read, search, create and edit files in your workspace. **Sign in and you are on your plan**, with no API key to manage. Prefer your own? Bring a key for Claude, OpenAI, Groq, Mistral and more.\n[Sign in to LevelCode](command:levelcode.ai.account)\n[Use your own key (BYOK)](command:levelcode.ai.setApiKey)\n[Pick a model](command:levelcode.ai.pickModel)\n[Open the chat](command:levelcode.ai.focus)',
+			media: { svg: 'media/walkthrough/ai.svg', altText: 'Chat, inline completions and an agent built into the editor' },
+			completionEvents: ['onCommand:levelcode.ai.setApiKey', 'onCommand:levelcode.ai.account'],
+		},
+		{
+			id: 'files',
+			title: 'Open your files',
+			description: 'Work in the scratch workspace, which is saved in this browser, or open a folder from your computer (Chrome and Edge) and the agent edits it in place.\n[Open a folder from your computer](command:levelcode.web.openLocalFolder)\n[Go to the scratch workspace](command:levelcode.web.openScratch)\n[Choose a theme](command:workbench.action.selectTheme)',
+			media: { svg: 'media/walkthrough/look.svg', altText: 'Themes and workspaces' },
+			completionEvents: ['onCommand:levelcode.web.openLocalFolder'],
+		},
+		{
+			id: 'limits',
+			title: 'What stays in the Mac app',
+			description: 'The browser edition has no terminal, runs no commands, and starts no local MCP servers. The agent can read, search, create, edit and delete files. For the rest, [get the Mac app](https://levelcode.ai/download).',
+			media: { svg: 'media/walkthrough/updates.svg', altText: 'LevelCode for Mac' },
+		},
+	],
+};
+
+/**
+ * @param {any} pkg the desktop package.json
+ * @param {{ entry?: string }} [opts]
+ * @returns {any} a new object; `pkg` is not modified
+ */
+function toWebManifest(pkg, opts) {
+	const out = JSON.parse(JSON.stringify(pkg));
+	out.browser = (opts && opts.entry) || './extension.web.js';
+	const c = out.contributes || (out.contributes = {});
+
+	if (Array.isArray(c.commands)) { c.commands = c.commands.filter((x) => !REMOVED_COMMANDS.has(x.command)); }
+	for (const [where, items] of Object.entries(c.menus || {})) {
+		c.menus[where] = items.filter((m) => !REMOVED_COMMANDS.has(m.command));
+	}
+	if (Array.isArray(c.keybindings)) {
+		c.keybindings = c.keybindings.filter((k) => !REMOVED_COMMANDS.has(k.command));
+		// Windows and Linux browsers keep Ctrl+Shift+I for developer tools, and the page never sees it.
+		c.keybindings.push({ command: 'levelcode.ai.focus', key: 'ctrl+alt+i', when: 'isWeb && !isMac' });
+	}
+	if (c.configuration) {
+		const sections = Array.isArray(c.configuration) ? c.configuration : [c.configuration];
+		for (const s of sections) {
+			for (const k of Object.keys(s.properties || {})) { if (REMOVED_SETTINGS.has(k)) { delete s.properties[k]; } }
+		}
+	}
+	c.walkthroughs = [JSON.parse(JSON.stringify(WELCOME))];
+	if (Array.isArray(out.activationEvents)) {
+		out.activationEvents = out.activationEvents.filter((e) => !(e.startsWith('onCommand:') && REMOVED_COMMANDS.has(e.slice('onCommand:'.length))));
+	}
+	return out;
+}
+
+module.exports = { toWebManifest, REMOVED_COMMANDS, REMOVED_SETTINGS, WELCOME };

web/ai-extension/shims/path.js

@@ -58,17 +58,21 @@ const path = {
 		return abs ? '/' + resolved : (resolved.length ? resolved : '.');
 	},
 
+	// Node's scan, so odd inputs ('a//b' is 'a/', '//x' is '//') are answered as Node answers them.
 	dirname(p) {
 		assertPath(p);
 		if (p.length === 0) { return '.'; }
-		let end = p.length;
-		while (end > 1 && p[end - 1] === '/') { end--; }          // trailing slashes do not count
-		const i = p.lastIndexOf('/', end - 1);
-		if (i === -1) { return '.'; }
-		if (i === 0) { return '/'; }
-		let j = i;
-		while (j > 1 && p[j - 1] === '/') { j--; }                // collapse the slashes before the name
-		return p.slice(0, j);
+		const hasRoot = p[0] === '/';
+		let end = -1;
+		let matchedSlash = true;
+		for (let i = p.length - 1; i >= 1; --i) {
+			if (p[i] === '/') {
+				if (!matchedSlash) { end = i; break; }
+			} else { matchedSlash = false; }
+		}
+		if (end === -1) { return hasRoot ? '/' : '.'; }
+		if (hasRoot && end === 1) { return '//'; }
+		return p.slice(0, end);
 	},
 
 	basename(p, ext) {
@@ -82,10 +86,27 @@ const path = {
 		return base;
 	},
 
+	// Node's own scan, so '..', '.', '.hidden', 'a.' and '..x' all come out as they do there.
 	extname(p) {
-		const base = path.basename(p);
-		const i = base.lastIndexOf('.');
-		return i <= 0 ? '' : base.slice(i);
+		assertPath(p);
+		let startDot = -1;
+		let startPart = 0;
+		let end = -1;
+		let matchedSlash = true;
+		let preDotState = 0;   // 0: no char before the dot yet, 1: only dots, -1: some other char
+		for (let i = p.length - 1; i >= 0; --i) {
+			const ch = p[i];
+			if (ch === '/') {
+				if (!matchedSlash) { startPart = i + 1; break; }
+				continue;
+			}
+			if (end === -1) { matchedSlash = false; end = i + 1; }
+			if (ch === '.') {
+				if (startDot === -1) { startDot = i; } else if (preDotState !== 1) { preDotState = 1; }
+			} else if (startDot !== -1) { preDotState = -1; }
+		}
+		if (startDot === -1 || end === -1 || preDotState === 0 || (preDotState === 1 && startDot === end - 1 && startDot === startPart + 1)) { return ''; }
+		return p.slice(startDot, end);
 	},
 
 	relative(from, to) {
@@ -98,21 +119,46 @@ const path = {
 		return [...f.slice(i).map(() => '..'), ...t.slice(i)].join('/');
 	},
 
+	// Node's scan, as for extname.
 	parse(p) {
 		assertPath(p);
-		const root = p[0] === '/' ? '/' : '';
-		const base = path.basename(p);
-		const ext = path.extname(p);
-		let dir = path.dirname(p);
-		if (dir === '.' && !p.startsWith('.')) { dir = ''; }
-		return { root, dir, base, ext, name: ext ? base.slice(0, -ext.length) : base };
+		const ret = { root: '', dir: '', base: '', ext: '', name: '' };
+		if (p.length === 0) { return ret; }
+		const isAbs = p[0] === '/';
+		const start = isAbs ? 1 : 0;
+		if (isAbs) { ret.root = '/'; }
+		let startDot = -1, startPart = 0, end = -1, matchedSlash = true, preDotState = 0;
+		for (let i = p.length - 1; i >= start; --i) {
+			const ch = p[i];
+			if (ch === '/') {
+				if (!matchedSlash) { startPart = i + 1; break; }
+				continue;
+			}
+			if (end === -1) { matchedSlash = false; end = i + 1; }
+			if (ch === '.') {
+				if (startDot === -1) { startDot = i; } else if (preDotState !== 1) { preDotState = 1; }
+			} else if (startDot !== -1) { preDotState = -1; }
+		}
+		if (end !== -1) {
+			const from = startPart === 0 && isAbs ? 1 : startPart;
+			if (startDot === -1 || preDotState === 0 || (preDotState === 1 && startDot === end - 1 && startDot === startPart + 1)) {
+				ret.base = ret.name = p.slice(from, end);
+			} else {
+				ret.name = p.slice(from, startDot);
+				ret.base = p.slice(from, end);
+				ret.ext = p.slice(startDot, end);
+			}
+		}
+		if (startPart > 0) { ret.dir = p.slice(0, startPart - 1); } else if (isAbs) { ret.dir = '/'; }
+		return ret;
 	},
 
 	format(o) {
-		const dir = o.dir || o.root || '';
-		const base = o.base || (o.name || '') + (o.ext || '');
+		const dir = o.dir || o.root;
+		const ext = o.ext ? (o.ext[0] === '.' ? o.ext : '.' + o.ext) : '';
+		const base = o.base || `${o.name || ''}${ext}`;
 		if (!dir) { return base; }
-		return dir === o.root ? dir + base : dir + '/' + base;
+		return dir === o.root ? `${dir}${base}` : `${dir}/${base}`;
 	},
 };
 

web/serve.mjs

@@ -62,6 +62,10 @@ const server = http.createServer((req, res) => {
 			'content-type': TYPES[path.extname(file)] || 'application/octet-stream',
 			'content-length': st.size,
 			'cache-control': 'no-cache',
+			// The extension host and the webviews run on origins of their own and fetch these files.
+			// They are public static assets and are never requested with credentials.
+			'access-control-allow-origin': '*',
+			'cross-origin-resource-policy': 'cross-origin',
 		});
 		if (req.method === 'HEAD') { res.end(); return; }
 		fs.createReadStream(file).pipe(res);

web/test/cdp.mjs

@@ -74,6 +74,8 @@ export class Page {
 			case 'Target.attachedToTarget':
 				this.sessions.set(d.params.sessionId, { url: d.params.targetInfo.url, type: d.params.targetInfo.type, targetId: d.params.targetInfo.targetId });
 				this.sendTo(d.params.sessionId, 'Runtime.enable').catch(() => {});
+				this.sendTo(d.params.sessionId, 'Network.enable').catch(() => {});
+				this.sendTo(d.params.sessionId, 'Log.enable').catch(() => {});
 				this.sendTo(d.params.sessionId, 'Target.setAutoAttach', { autoAttach: true, waitForDebuggerOnStart: false, flatten: true }).catch(() => {});
 				break;
 		}

web/test/e2e.mjs

@@ -21,7 +21,8 @@ const STATIC = path.resolve(args.static || process.env.LEVELCODE_WEB_STATIC || '
 const EXTS = path.resolve(args.extensions || process.env.LEVELCODE_WEB_EXTENSIONS || '');
 const SHOTS = args.shots ? path.resolve(args.shots) : null;
 const EDITOR_PORT = Number(args.port || 8801);
-const editorOrigin = `http://127.0.0.1:${EDITOR_PORT}`;
+// `localhost`, not 127.0.0.1: the extension host's own iframe policy admits https: and http://localhost:*.
+const editorOrigin = `http://localhost:${EDITOR_PORT}`;
 if (!fs.existsSync(STATIC) || !fs.existsSync(EXTS)) { console.error('usage: e2e.mjs --static <vscode-web dir> --extensions <dir>'); process.exit(2); }
 if (SHOTS) { fs.mkdirSync(SHOTS, { recursive: true }); }
 
@@ -31,7 +32,8 @@ const shot = async (page, name) => { if (SHOTS) { await page.screenshot(path.joi
 
 const stub = await startStub({ editorOrigin });
 const server = spawn(process.execPath, [path.join(HERE, '..', 'serve.mjs'), '--static', STATIC, '--extensions', EXTS,
-	'--extension-names', args['extension-names'] || 'levelcode-ai,levelcode-web', '--account', stub.origin, '--port', String(EDITOR_PORT)], { stdio: 'inherit' });
+	'--extension-names', args['extension-names'] || 'levelcode-ai,levelcode-web', '--account', stub.origin, '--port', String(EDITOR_PORT),
+	...(args.product ? ['--product', args.product] : [])], { stdio: 'inherit' });
 let chrome;
 const finish = async (code) => { try { chrome && chrome.close(); } catch {} try { server.kill(); } catch {} try { await stub.close(); } catch {} process.exit(code); };
 process.on('SIGINT', () => finish(130));
@@ -90,7 +92,14 @@ try {
 		await page.click(frame.x + inner.x, frame.y + inner.y);
 		await sleep(400);
 	};
-	const scratchFile = (p) => page.eval(`new Promise((res, rej) => { const r = indexedDB.open('levelcode-scratch'); r.onsuccess = () => { const g = r.result.transaction('nodes').objectStore('nodes').get(${JSON.stringify(p)}); g.onsuccess = () => res(g.result ? new TextDecoder().decode(g.result.data) : null); g.onerror = () => rej(g.error); }; r.onerror = () => rej(r.error); })`);
+	// With the extension host isolated on its own origin (--product with webEndpointUrlTemplate) the scratch
+	// workspace's IndexedDB belongs to THAT origin and the page cannot open it; the agent's read_file can.
+	const hardened = /webEndpointUrlTemplate/.test(args.product || '');
+	const scratchFile = hardened ? (async (p) => {
+		await ask('Please read the greeting');
+		const t = lastToolResult();
+		return /ERROR/.test(t) ? null : t;
+	}) : (p) => page.eval(`new Promise((res, rej) => { const r = indexedDB.open('levelcode-scratch'); r.onsuccess = () => { const g = r.result.transaction('nodes').objectStore('nodes').get(${JSON.stringify(p)}); g.onsuccess = () => res(g.result ? new TextDecoder().decode(g.result.data) : null); g.onerror = () => rej(g.error); }; r.onerror = () => rej(r.error); })`);
 
 	/* 1. boot */
 	await workbenchReady();
@@ -119,8 +128,8 @@ try {
 	await clickInChat('[data-act="signin"]');
 	await page.waitFor(() => stub.state.log.some((e) => e.path === '/api/levelcode/v1/auth/exchange'), { ms: 45000, label: 'code exchange' }).catch(() => null);
 	check('the sign-in page accepted the editor callback and returned a code', stub.state.signIns >= 1);
-	const exchanged = stub.state.log.some((e) => e.path === '/api/levelcode/v1/auth/exchange' && e.origin === editorOrigin);
-	check('the editor exchanged the code from the editor origin (CORS answered)', exchanged);
+	const exchangeOrigin = (stub.state.log.find((e) => e.path === '/api/levelcode/v1/auth/exchange' && e.method === 'POST') || {}).origin;
+	check('the editor exchanged the code across origins (CORS answered)', !!exchangeOrigin, 'from ' + exchangeOrigin);
 	await page.waitFor(() => stub.state.log.some((e) => e.path === '/api/levelcode/v1/account/profile' && e.auth), { ms: 20000, label: 'profile call' }).catch(() => null);
 	check('the editor used its session token against the account API', stub.state.log.some((e) => e.path === '/api/levelcode/v1/account/profile' && e.auth));
 	await shot(page, '2-signed-in');

web/test/stub-backend.mjs

@@ -62,6 +62,8 @@ export function defaultModel(messages) {
  */
 export async function startStub(o) {
 	const editorOrigin = o.editorOrigin;
+	// `v--<hash>` is the marker the editor puts on the label; the parent domain is the editor's own.
+	const extHostOrigin = o.extHostOrigin || new RegExp('^' + (editorOrigin.startsWith('https') ? 'https' : 'http') + '://v--[a-z0-9]+\\.' + new URL(editorOrigin).hostname.replace(/\./g, '\\.') + '(:\\d+)?$');
 	const model = o.model || defaultModel;
 	const plan = o.plan || 'Pro';
 	const codes = new Map();       // code -> { challenge, at }
@@ -75,9 +77,10 @@ export async function startStub(o) {
 		const entry = { method: req.method, path: url.pathname, origin, auth: !!req.headers.authorization, at: Date.now() };
 		log.push(entry);
 
-		// CORS: only the editor's origin, never credentials.
+		// CORS: the editor's origin, or the origin of its isolated extension host (a per-session
+		// `v--<hash>` subdomain) — never credentials.
 		const cors = {};
-		if (origin && origin === editorOrigin && url.pathname.startsWith('/api/levelcode/v1/')) {
+		if (origin && (origin === editorOrigin || extHostOrigin.test(origin)) && url.pathname.startsWith('/api/levelcode/v1/')) {
 			cors['access-control-allow-origin'] = origin;
 			cors.vary = 'Origin';
 			cors['access-control-expose-headers'] = '';