diff --git a/README.md b/README.md index 7206739..fc1bc19 100644 --- a/README.md +++ b/README.md @@ -21,11 +21,25 @@ The browser can run locally, on a remote server, or as an existing browser with ## Embedded experience +`BrowserView` is mounted directly in the workspace content area—without an extra browser card around it. +
- BrowserView embedded in an application, with tabs, address bar, live page, and the F12 Network panel +An agent workspace with BrowserView embedded beside the task activity, clicking a button in the live page
-`BrowserView` renders the live browser stream, tabs, address bar, input controls, and diagnostics directly inside the host application's container. +
+F12 Developer tools — click to open or close +
+The same agent workspace with the embedded BrowserView Network panel open +
+ +
+Control handoff — click to show or hide +
+The same agent workspace with BrowserView showing its Take control overlay +
+ +The surrounding workspace and page contents are illustrative. The embedded panel renders tabs, the address bar, browser input, control handoff, and diagnostics inside the host application's container. [Run the interactive demo](#demo). diff --git a/README.zh-CN.md b/README.zh-CN.md index 524dbca..c08a6c5 100644 --- a/README.zh-CN.md +++ b/README.zh-CN.md @@ -20,11 +20,25 @@ Agent 可通过 CLI 或 Go 函数读取页面、操作元素和管理 Tab；用 ## 嵌入效果 +`BrowserView` 直接挂载在工作台内容区域中，外侧不再重复套一层浏览器卡片。 +
- BrowserView 嵌入应用后的效果，包含 Tab、地址栏、实时页面与 F12 Network 面板 +Agent 工作台中的 BrowserView，右侧实时页面正在点击按钮
-`BrowserView` 会直接在宿主应用的容器内渲染浏览器图流、Tab、地址栏、输入控制与诊断面板。 +
+F12 Developer tools — 点击开启或关闭 +
+同一 Agent 工作台中的 BrowserView 已展开 Network 面板 +
+ +
+操作权接管 — 点击显示或隐藏 +
+同一 Agent 工作台中的 BrowserView 正在显示接管操作界面 +
+ +外侧工作台和页面内容用于模拟宿主场景；嵌入面板会在宿主容器内渲染 Tab、地址栏、浏览器输入、操作权接管和诊断面板。[运行可交互 Demo](#demo)。 diff --git a/docs/images/browser-embedded-control.png b/docs/images/browser-embedded-control.png new file mode 100644 index 0000000..6eb1c9b Binary files /dev/null and b/docs/images/browser-embedded-control.png differ diff --git a/docs/images/browser-embedded-network.png b/docs/images/browser-embedded-network.png new file mode 100644 index 0000000..cfa43c5 Binary files /dev/null and b/docs/images/browser-embedded-network.png differ diff --git a/docs/images/browser-embedded-page.png b/docs/images/browser-embedded-page.png new file mode 100644 index 0000000..8e8fae6 Binary files /dev/null and b/docs/images/browser-embedded-page.png differ diff --git a/docs/images/browser-embedded.svg b/docs/images/browser-embedded.svg deleted file mode 100644 index 364fc06..0000000 --- a/docs/images/browser-embedded.svg +++ /dev/null @@ -1,166 +0,0 @@ - - BrowserKit embedded browser interface - A BrowserView styled like the real component, with tabs, an address bar, a live page, and the developer tools panel below it. - - - - - - - - - - - - - - - - - - - - - - Fieldnotes · Workspace - - - - Project details - - - - - - - - - - http://127.0.0.1:8877/site/ - - - - - F12 - - - - - - - - ◈ Fieldnotes - Workspace - Projects / 2026 - - INPUT AND NAVIGATION - Work notes - Add a note, send a request, or open project details. - - - New note - Note - - Enter a note - - Save note - - Test request - Request succeeded - - - Projects - - Website redesign - Done - - - Mobile layout - Done - - - API testing - In progress - - Open project details ↗ - - - - - - - - - - - Developer tools - Console - Network - - Resources - Collecting - - Stop - - - - - - All - - Fetch/XHR - - Document - - Script - - Filter requests - - - - Name - Status - Method - Type - Time - - - - status - 200 - GET - fetch - 18 ms - - - - index.html - 200 - GET - document - 11 ms - - - - favicon.ico - 200 - GET - image - 3 ms - - - - 3 requests - 0 errors - - - -