Browser view native "add to chat" features

[kycutler]

No description provided.

[vs-code-engineering]

📬 CODENOTIFY

The following users are being notified based on files changed in this PR:

@jruales

Matched files:

• src/vs/platform/browserView/common/browserView.ts
• src/vs/platform/browserView/electron-main/browserView.ts
• src/vs/platform/browserView/electron-main/browserViewElementInspector.ts
• src/vs/platform/browserView/electron-main/browserViewMainService.ts
• src/vs/workbench/contrib/browserView/common/browserView.ts
• src/vs/workbench/contrib/browserView/electron-browser/features/browserEditorChatFeatures.ts
• src/vs/workbench/contrib/browserView/electron-browser/tools/screenshotBrowserTool.ts

[Copilot]

Pull request overview

This PR adds native “add to chat” support for the integrated Browser View by moving element inspection and console-log collection into the Browser View model/service layer (electron-main), and adjusting screenshot cropping to use page coordinates.

Changes:

• Replace Browser Elements service usage in the editor chat integration with new IBrowserViewModel APIs for element inspection and console logs.
• Add electron-main implementations for capturing console output and inspecting elements via CDP.
• Update screenshot capture options to support pageRect/screenRect (and migrate callsites).

Reviewed changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
src/vs/workbench/contrib/browserView/electron-browser/tools/screenshotBrowserTool.ts	Switches partial screenshot requests to pageRect cropping.
src/vs/workbench/contrib/browserView/electron-browser/features/browserEditorChatFeatures.ts	Uses IBrowserViewModel APIs for element selection and console log attachment.
src/vs/workbench/contrib/browserView/common/browserView.ts	Adds model-level APIs (getConsoleLogs, getElementData, getFocusedElementData) and cancellable request plumbing.
src/vs/platform/browserView/electron-main/browserViewMainService.ts	Exposes new IPC service methods and adds cancellation support for in-flight requests.
src/vs/platform/browserView/electron-main/browserViewElementInspector.ts	New CDP-based element inspector/serializer used by BrowserView.
src/vs/platform/browserView/electron-main/browserView.ts	Captures console messages, adds element inspection entrypoints, and converts pageRect → screenRect for screenshots.
src/vs/platform/browserView/common/browserView.ts	Extends the public BrowserView service contract (new APIs + new screenshot option shape).

Comments suppressed due to low confidence (2)

src/vs/platform/browserView/electron-main/browserViewElementInspector.ts:236

• DOMParser is used in electron-main code to parse outerHTML, but DOMParser is a browser API and is not available in the Electron main process at runtime. This will throw when element inspection runs. Consider omitting innerText here, deriving it via CDP (e.g. DOM/CSS/AX APIs), or using a Node-safe HTML parser that is already available in the repo.

		// IMPORTANT: this node itself is untrusted and must not be added to the DOM.
		//            Parsing is safe and allows us to easily extract contents.
		const untrustedNodeParsed = new DOMParser().parseFromString(outerHTML, 'text/html').body.firstElementChild;
		if (!untrustedNodeParsed) {
			throw new Error('Failed to parse outerHTML.');
		}

		innerText = untrustedNodeParsed.textContent;

src/vs/platform/browserView/electron-main/browserViewElementInspector.ts:98

• The overlay cleanup is registered as an async dispose on a DisposableStore, but DisposableStore.dispose() is synchronous and will not await these CDP commands. Since the caller disposes the CDP connection immediately after getElementData returns, the cleanup commands can race/fail, potentially leaving inspect mode/highlight active. Prefer explicit try/finally cleanup that is awaited before the connection is disposed (or provide an explicit async cleanup path).

	store.add({
		dispose: async () => {
			try {
				await connection.sendCommand('Overlay.setInspectMode', {
					mode: 'none',
					highlightConfig: {
						showInfo: false,
						showStyles: false
					}
				});
				await connection.sendCommand('Overlay.hideHighlight');
				await connection.sendCommand('Overlay.disable');
			} catch {
				// Best effort cleanup
			}
		}