mirror of
https://github.com/Tencent/BrowserSkill.git
synced 2026-09-10 13:01:23 +08:00
Compare commits
16
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
383e3128eb | ||
|
|
2d2636030d | ||
|
|
a28b9d55e7 | ||
|
|
c39874591f | ||
|
|
1485addfd5 | ||
|
|
90b0ff301b | ||
|
|
e74f354e90 | ||
|
|
05c036518a | ||
|
|
020fb3212e | ||
|
|
0822c53c65 | ||
|
|
4450fbe28c | ||
|
|
a3bb81bfab | ||
|
|
caea98cd52 | ||
|
|
187b088013 | ||
|
|
5046b5ab44 | ||
|
|
e8137b42cc |
@@ -38,7 +38,7 @@ jobs:
|
|||||||
run: cargo test --workspace --locked
|
run: cargo test --workspace --locked
|
||||||
|
|
||||||
windows-daemon:
|
windows-daemon:
|
||||||
name: Windows daemon and update regression tests
|
name: Windows daemon, installer and cancellation regression tests
|
||||||
runs-on: windows-latest
|
runs-on: windows-latest
|
||||||
|
|
||||||
steps:
|
steps:
|
||||||
@@ -55,8 +55,16 @@ jobs:
|
|||||||
- name: Run Windows update tests
|
- name: Run Windows update tests
|
||||||
run: cargo test -p bsk --lib --locked cli::update::tests
|
run: cargo test -p bsk --lib --locked cli::update::tests
|
||||||
|
|
||||||
- name: Run Windows update process tests
|
- name: Run Windows update and cancellation process tests
|
||||||
run: cargo test -p bsk --test windows_update --locked
|
run: cargo test -p bsk --test windows_update --test windows_parent_cancel --locked
|
||||||
|
|
||||||
|
- name: Run installer tests (Windows PowerShell 5.1)
|
||||||
|
shell: powershell
|
||||||
|
run: ./scripts/install-windows.test.ps1
|
||||||
|
|
||||||
|
- name: Run installer tests (PowerShell 7)
|
||||||
|
shell: pwsh
|
||||||
|
run: ./scripts/install-windows.test.ps1
|
||||||
|
|
||||||
frontend:
|
frontend:
|
||||||
name: Frontend lint, typecheck, tests, build
|
name: Frontend lint, typecheck, tests, build
|
||||||
|
|||||||
+18
-1
@@ -5,7 +5,24 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/).
|
|||||||
|
|
||||||
Starting from 0.2.0, CLI / Extension / DSH Plugin share the same version number.
|
Starting from 0.2.0, CLI / Extension / DSH Plugin share the same version number.
|
||||||
|
|
||||||
## [Unreleased]
|
## [0.2.1] - 2026-09-09
|
||||||
|
|
||||||
|
### Changed
|
||||||
|
- DSH Plugin: clarified installation, configuration, profile restart, and upgrade instructions
|
||||||
|
|
||||||
|
### Fixed
|
||||||
|
- CLI: reliable Windows self-updates, including executable replacement and daemon restart
|
||||||
|
- CLI: Windows named-pipe connection continuity and stale daemon process detection
|
||||||
|
- Windows installer: PowerShell 5.1 compatibility, path quoting, and staged executable replacement
|
||||||
|
- CLI / DSH Plugin: cancellation propagation and upload/download cleanup when the parent process exits
|
||||||
|
- Extension: tab ownership and session cleanup when agent tabs fail to open or borrowed tabs are returned or closed
|
||||||
|
- Extension: navigation recovery when other extensions restrict Chrome DevTools Protocol access
|
||||||
|
- Extension: background input filling, automatic append behavior, and verification of field values before reporting success
|
||||||
|
- Extension: match observed form state to the correct element after page changes
|
||||||
|
- Extension: UUID generation fallback for recording and overlays on insecure origins
|
||||||
|
- Browser locale matching for regional language variants
|
||||||
|
- DSH Plugin: observation state synchronization, thumbnail capture lifecycle, and stale preview cleanup
|
||||||
|
- DSH Plugin: removed the obsolete client runtime host dependency
|
||||||
|
|
||||||
## [0.2.0] - 2026-09-02
|
## [0.2.0] - 2026-09-02
|
||||||
|
|
||||||
|
|||||||
Generated
+2
-2
@@ -134,7 +134,7 @@ dependencies = [
|
|||||||
|
|
||||||
[[package]]
|
[[package]]
|
||||||
name = "bsk"
|
name = "bsk"
|
||||||
version = "0.2.0"
|
version = "0.2.1"
|
||||||
dependencies = [
|
dependencies = [
|
||||||
"anyhow",
|
"anyhow",
|
||||||
"base64",
|
"base64",
|
||||||
@@ -169,7 +169,7 @@ dependencies = [
|
|||||||
|
|
||||||
[[package]]
|
[[package]]
|
||||||
name = "bsk-protocol"
|
name = "bsk-protocol"
|
||||||
version = "0.2.0"
|
version = "0.2.1"
|
||||||
dependencies = [
|
dependencies = [
|
||||||
"schemars",
|
"schemars",
|
||||||
"semver",
|
"semver",
|
||||||
|
|||||||
+2
-2
@@ -7,7 +7,7 @@ members = [
|
|||||||
default-members = ["crates/bsk-cli"]
|
default-members = ["crates/bsk-cli"]
|
||||||
|
|
||||||
[workspace.package]
|
[workspace.package]
|
||||||
version = "0.2.0"
|
version = "0.2.1"
|
||||||
edition = "2024"
|
edition = "2024"
|
||||||
rust-version = "1.85"
|
rust-version = "1.85"
|
||||||
license = "MIT"
|
license = "MIT"
|
||||||
@@ -43,7 +43,7 @@ rand = "0.8"
|
|||||||
uuid = { version = "1", features = ["v4", "serde"] }
|
uuid = { version = "1", features = ["v4", "serde"] }
|
||||||
|
|
||||||
# Workspace crates (version required for `cargo publish` of dependents)
|
# Workspace crates (version required for `cargo publish` of dependents)
|
||||||
bsk-protocol = { version = "0.2.0", path = "crates/bsk-protocol" }
|
bsk-protocol = { version = "0.2.1", path = "crates/bsk-protocol" }
|
||||||
|
|
||||||
[profile.release]
|
[profile.release]
|
||||||
strip = "symbols"
|
strip = "symbols"
|
||||||
|
|||||||
@@ -147,20 +147,26 @@ Start a new Agent session and write a prompt that needs the browser, for example
|
|||||||
Using [DeepSeek Harness](https://github.com/deepseek-ai/deepseek-harness) (`dsh`)?
|
Using [DeepSeek Harness](https://github.com/deepseek-ai/deepseek-harness) (`dsh`)?
|
||||||
BrowserSkill ships a first-class dsh plugin on npm as
|
BrowserSkill ships a first-class dsh plugin on npm as
|
||||||
[`@wxg-prc-cpg/browser-skill-dsh-plugin`](https://www.npmjs.com/package/@wxg-prc-cpg/browser-skill-dsh-plugin).
|
[`@wxg-prc-cpg/browser-skill-dsh-plugin`](https://www.npmjs.com/package/@wxg-prc-cpg/browser-skill-dsh-plugin).
|
||||||
It injects native `browser_*` tools (no shelling out to `bsk`) and a live Web UI
|
It gives the agent native `browser_*` tools and a live view of its browser sessions
|
||||||
overlay of each Agent Window.
|
in the Web UI. The plugin runs `bsk` on the agent's behalf.
|
||||||
|
|
||||||
Add it to a dsh profile, then start that profile:
|
Install the `bsk` CLI and connect the browser extension first. Then add the plugin
|
||||||
|
to a dsh profile and start it (replace `web` with your profile name):
|
||||||
|
|
||||||
```sh
|
```sh
|
||||||
dsh plugin --profile web add @wxg-prc-cpg/browser-skill-dsh-plugin
|
dsh plugin --profile web add @wxg-prc-cpg/browser-skill-dsh-plugin
|
||||||
dsh --profile web
|
dsh --profile web
|
||||||
```
|
```
|
||||||
|
|
||||||
The plugin carries its own copy of the skill, so `bsk install-skill` is not needed
|
The plugin includes the `browser-skill` skill, so `bsk install-skill` is not needed
|
||||||
for dsh — but the `bsk` CLI and the browser extension are still prerequisites. See
|
for dsh. Installed plugins do not update automatically. To upgrade this plugin:
|
||||||
the [plugin README](packages/dsh-plugin-browserskill/README.md) for the tool list,
|
|
||||||
configuration, and the observation overlay.
|
```sh
|
||||||
|
dsh plugin --profile web update @wxg-prc-cpg/browser-skill-dsh-plugin --latest
|
||||||
|
```
|
||||||
|
|
||||||
|
Restart the profile after upgrading. See the
|
||||||
|
[plugin README](packages/dsh-plugin-browserskill/README.md) for usage and configuration.
|
||||||
|
|
||||||
## How It Works
|
## How It Works
|
||||||
|
|
||||||
|
|||||||
+9
-3
@@ -125,16 +125,22 @@ bsk install-skill
|
|||||||
|
|
||||||
## DeepSeek Harness 插件
|
## DeepSeek Harness 插件
|
||||||
|
|
||||||
在用 [DeepSeek Harness](https://github.com/deepseek-ai/deepseek-harness)(`dsh`)?BrowserSkill 提供了官方 dsh 插件,已发布到 npm:[`@wxg-prc-cpg/browser-skill-dsh-plugin`](https://www.npmjs.com/package/@wxg-prc-cpg/browser-skill-dsh-plugin)。它会注入原生 `browser_*` 工具(无需再通过 Shell 调用 `bsk`),并在 Web UI 中实时观察每个 Agent Window。
|
在用 [DeepSeek Harness](https://github.com/deepseek-ai/deepseek-harness)(`dsh`)?BrowserSkill 提供了官方 dsh 插件,已发布到 npm:[`@wxg-prc-cpg/browser-skill-dsh-plugin`](https://www.npmjs.com/package/@wxg-prc-cpg/browser-skill-dsh-plugin)。它为 Agent 提供原生 `browser_*` 工具,由插件代为调用 `bsk`,并在 Web UI 中实时展示浏览器会话。
|
||||||
|
|
||||||
把它装进某个 dsh profile,然后启动该 profile:
|
先安装 `bsk` CLI 并连接浏览器扩展,再将插件装进 dsh profile 并启动(将 `web` 替换为你的 profile 名称):
|
||||||
|
|
||||||
```sh
|
```sh
|
||||||
dsh plugin --profile web add @wxg-prc-cpg/browser-skill-dsh-plugin
|
dsh plugin --profile web add @wxg-prc-cpg/browser-skill-dsh-plugin
|
||||||
dsh --profile web
|
dsh --profile web
|
||||||
```
|
```
|
||||||
|
|
||||||
插件自带 skill,所以在 dsh 下无需执行 `bsk install-skill`;但 `bsk` CLI 和浏览器扩展仍是前置条件。工具清单、配置项与观察浮层见[插件 README](packages/dsh-plugin-browserskill/README.md)。
|
插件自带 `browser-skill` skill,所以在 dsh 下无需执行 `bsk install-skill`。已安装的插件不会自动更新;升级此插件请运行:
|
||||||
|
|
||||||
|
```sh
|
||||||
|
dsh plugin --profile web update @wxg-prc-cpg/browser-skill-dsh-plugin --latest
|
||||||
|
```
|
||||||
|
|
||||||
|
升级后重启该 profile。用法与配置见[插件 README](packages/dsh-plugin-browserskill/README.md)。
|
||||||
|
|
||||||
## 工作原理
|
## 工作原理
|
||||||
|
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@browser-skill/extension",
|
"name": "@browser-skill/extension",
|
||||||
"version": "0.2.0",
|
"version": "0.2.1",
|
||||||
"private": true,
|
"private": true,
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { describe, expect, it, vi } from "vitest";
|
import { describe, expect, it, vi } from "vitest";
|
||||||
import { resolveFrameProjection, resolveNodeGeometry } from "../frame-geometry";
|
import { resolveNodeGeometry } from "../frame-geometry";
|
||||||
import {
|
import {
|
||||||
clipPolygon,
|
clipPolygon,
|
||||||
polygonArea,
|
polygonArea,
|
||||||
@@ -10,6 +10,7 @@ import {
|
|||||||
rectPolygon,
|
rectPolygon,
|
||||||
regionBounds,
|
regionBounds,
|
||||||
} from "../geometry";
|
} from "../geometry";
|
||||||
|
import { GeometryContext } from "../geometry/frame-context";
|
||||||
import type { CdpRunner } from "../shared";
|
import type { CdpRunner } from "../shared";
|
||||||
|
|
||||||
describe("frame geometry projection", () => {
|
describe("frame geometry projection", () => {
|
||||||
@@ -82,9 +83,7 @@ describe("frame geometry projection", () => {
|
|||||||
throw new Error(`unexpected child command ${method}`);
|
throw new Error(`unexpected child command ${method}`);
|
||||||
}) as CdpRunner["sendToTarget"],
|
}) as CdpRunner["sendToTarget"],
|
||||||
};
|
};
|
||||||
const projection = await resolveFrameProjection(
|
const projection = await new GeometryContext(cdp, 4, {
|
||||||
cdp,
|
|
||||||
{
|
|
||||||
rootFrameId: "main",
|
rootFrameId: "main",
|
||||||
frames: [
|
frames: [
|
||||||
{ frameId: "main", target: { tabId: 4 } },
|
{ frameId: "main", target: { tabId: 4 } },
|
||||||
@@ -101,9 +100,7 @@ describe("frame geometry projection", () => {
|
|||||||
target: { tabId: 4, sessionId: "oopif-session" },
|
target: { tabId: 4, sessionId: "oopif-session" },
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
}).targetProjection("oopif");
|
||||||
"oopif",
|
|
||||||
);
|
|
||||||
|
|
||||||
expect(projection?.edges).toEqual([
|
expect(projection?.edges).toEqual([
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -0,0 +1,464 @@
|
|||||||
|
import { describe, expect, it, vi } from "vitest";
|
||||||
|
import type { CdpFrameGraph } from "@/browser-driver/frame-graph";
|
||||||
|
import { resolveNodeGeometry } from "../frame-geometry";
|
||||||
|
import { rectPolygon } from "../geometry";
|
||||||
|
import {
|
||||||
|
projectSnapshotRect,
|
||||||
|
screenshotPageRect,
|
||||||
|
snapshotCoordinates,
|
||||||
|
snapshotViewportRect,
|
||||||
|
} from "../geometry/coordinate-types";
|
||||||
|
import { GeometryContext, snapshotLayoutScale } from "../geometry/frame-context";
|
||||||
|
import type { CdpRunner } from "../shared";
|
||||||
|
|
||||||
|
const target = { tabId: 4 };
|
||||||
|
const graph: CdpFrameGraph = {
|
||||||
|
rootFrameId: "main",
|
||||||
|
frames: [
|
||||||
|
{ frameId: "main", target },
|
||||||
|
{ frameId: "child", parentFrameId: "main", ownerBackendNodeId: 10, target },
|
||||||
|
],
|
||||||
|
};
|
||||||
|
|
||||||
|
function driver() {
|
||||||
|
const send = vi.fn(async (_tab: number, method: string): Promise<object> => {
|
||||||
|
if (method === "Page.getLayoutMetrics")
|
||||||
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 1000 },
|
||||||
|
};
|
||||||
|
if (method === "DOM.getBoxModel")
|
||||||
|
return { model: { content: [52.5, 612.5, 427.5, 612.5, 427.5, 862.5, 52.5, 862.5] } };
|
||||||
|
if (method === "DOM.resolveNode") return { object: { objectId: "owner" } };
|
||||||
|
if (method === "Runtime.callFunctionOn")
|
||||||
|
return { result: { value: { width: 300, height: 200 } } };
|
||||||
|
if (method === "Runtime.releaseObject") return {};
|
||||||
|
throw new Error(method);
|
||||||
|
});
|
||||||
|
return { send: send as CdpRunner["send"], getFrameGraph: vi.fn(async () => graph), calls: send };
|
||||||
|
}
|
||||||
|
|
||||||
|
describe("measurement geometry context", () => {
|
||||||
|
it.each([0.8, 1, 1.25, 2])("normalizes snapshot layout units at scale %s", (scale) => {
|
||||||
|
const measured = snapshotLayoutScale({
|
||||||
|
visualViewport: { clientWidth: 997.25, zoom: 1.1 },
|
||||||
|
cssVisualViewport: { clientWidth: 997.25 / scale, zoom: 1.1 },
|
||||||
|
// Rounded layout dimensions must not supply the scale.
|
||||||
|
layoutViewport: { clientWidth: 997 },
|
||||||
|
cssLayoutViewport: { clientWidth: Math.floor(997.25 / scale) },
|
||||||
|
});
|
||||||
|
expect(measured).toBeCloseTo(scale, 12);
|
||||||
|
const coordinates = snapshotCoordinates(
|
||||||
|
{ scrollOffsetX: 80 * scale, scrollOffsetY: 200 * scale },
|
||||||
|
measured,
|
||||||
|
{ x: 999, y: 999 },
|
||||||
|
);
|
||||||
|
expect(
|
||||||
|
snapshotViewportRect(
|
||||||
|
[160 * scale, 320 * scale, 120 * scale, 40 * scale],
|
||||||
|
{ target },
|
||||||
|
coordinates,
|
||||||
|
)?.rect,
|
||||||
|
).toEqual({ x: 80, y: 120, width: 120, height: 40 });
|
||||||
|
});
|
||||||
|
|
||||||
|
it("uses CSS root scroll only for missing snapshot offsets, without scaling it twice", () => {
|
||||||
|
const coordinates = snapshotCoordinates({ scrollOffsetX: 80 }, 2, { x: 999, y: 100 });
|
||||||
|
expect(snapshotViewportRect([200, 800, 240, 80], { target }, coordinates)?.rect).toEqual({
|
||||||
|
x: 60,
|
||||||
|
y: 300,
|
||||||
|
width: 120,
|
||||||
|
height: 40,
|
||||||
|
});
|
||||||
|
expect(snapshotCoordinates({ scrollOffsetX: 0 }, 2)).toBeNull();
|
||||||
|
expect(
|
||||||
|
snapshotCoordinates({ scrollOffsetX: NaN, scrollOffsetY: 0 }, 2, { x: 0, y: 0 }),
|
||||||
|
).toBeNull();
|
||||||
|
});
|
||||||
|
|
||||||
|
it("does not infer snapshot units from missing, invalid, or CSS-only metrics", () => {
|
||||||
|
expect(snapshotLayoutScale({ cssLayoutViewport: { clientWidth: 800 } })).toBeNull();
|
||||||
|
for (const raw of [0, -1, NaN, Infinity]) {
|
||||||
|
expect(
|
||||||
|
snapshotLayoutScale({
|
||||||
|
visualViewport: { clientWidth: raw },
|
||||||
|
cssVisualViewport: { clientWidth: 800 },
|
||||||
|
}),
|
||||||
|
).toBeNull();
|
||||||
|
}
|
||||||
|
expect(
|
||||||
|
snapshotLayoutScale({
|
||||||
|
visualViewport: { clientWidth: 0, clientHeight: 600 },
|
||||||
|
cssVisualViewport: { clientWidth: 0, clientHeight: 300 },
|
||||||
|
}),
|
||||||
|
).toBe(2);
|
||||||
|
expect(snapshotCoordinates({ scrollOffsetX: 0, scrollOffsetY: 0 }, null)).toBeNull();
|
||||||
|
expect(snapshotViewportRect([10, 20, 120, 40], { target }, null)).toBeNull();
|
||||||
|
});
|
||||||
|
|
||||||
|
it("shares in-flight frame measurements, but never shares them with the next context", async () => {
|
||||||
|
const cdp = driver();
|
||||||
|
const context = new GeometryContext(cdp, 4);
|
||||||
|
const results = await Promise.all(
|
||||||
|
Array.from({ length: 20 }, () => context.targetProjection("child")),
|
||||||
|
);
|
||||||
|
expect(results.every((value) => value === results[0])).toBe(true);
|
||||||
|
expect(cdp.getFrameGraph).toHaveBeenCalledTimes(1);
|
||||||
|
expect(cdp.calls.mock.calls.map(([, method]) => method)).toEqual([
|
||||||
|
"Page.getLayoutMetrics",
|
||||||
|
"DOM.getBoxModel",
|
||||||
|
]);
|
||||||
|
await new GeometryContext(cdp, 4).targetProjection("child");
|
||||||
|
expect(cdp.getFrameGraph).toHaveBeenCalledTimes(2);
|
||||||
|
expect(cdp.calls.mock.calls).toHaveLength(4);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("projects frame-local snapshot CSS bounds through the scaled owner content quad", async () => {
|
||||||
|
const cdp = driver();
|
||||||
|
const context = new GeometryContext(cdp, 4);
|
||||||
|
const source = { target, frameId: "child" };
|
||||||
|
const projection = await context.snapshotProjection(source, 10, [], {
|
||||||
|
width: 1000,
|
||||||
|
height: 1000,
|
||||||
|
});
|
||||||
|
if (projection.status !== "available") throw new Error("expected available projection");
|
||||||
|
const input = snapshotViewportRect([17, 23, 120, 40], source, {
|
||||||
|
layoutUnitsPerCssPixel: 1,
|
||||||
|
scrollCss: { x: 0, y: 0 },
|
||||||
|
});
|
||||||
|
expect(projectSnapshotRect(input!, projection.projection)).toEqual({
|
||||||
|
x: 73.75,
|
||||||
|
y: 641.25,
|
||||||
|
width: 150,
|
||||||
|
height: 50,
|
||||||
|
});
|
||||||
|
const scrolled = snapshotViewportRect([17, 23, 120, 40], source, {
|
||||||
|
layoutUnitsPerCssPixel: 1,
|
||||||
|
scrollCss: { x: 0, y: 10 },
|
||||||
|
});
|
||||||
|
expect(projectSnapshotRect(scrolled!, projection.projection)?.y).toBe(628.75);
|
||||||
|
await context.snapshotProjection(source, 10, [], { width: 1000, height: 1000 });
|
||||||
|
expect(cdp.calls.mock.calls.filter(([, method]) => method === "DOM.resolveNode")).toHaveLength(
|
||||||
|
1,
|
||||||
|
);
|
||||||
|
expect(
|
||||||
|
cdp.calls.mock.calls.filter(([, method]) => method === "Runtime.releaseObject"),
|
||||||
|
).toHaveLength(1);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("falls back only for missing or invalid batch entries and does not reuse sizes across contexts", async () => {
|
||||||
|
const cdp = driver();
|
||||||
|
const original = cdp.send;
|
||||||
|
const calls: string[] = [];
|
||||||
|
cdp.send = async (tabId, method, params) => {
|
||||||
|
calls.push(method);
|
||||||
|
if (method === "Runtime.evaluate")
|
||||||
|
return {
|
||||||
|
result: {
|
||||||
|
deepSerializedValue: {
|
||||||
|
type: "array",
|
||||||
|
value: [
|
||||||
|
{
|
||||||
|
type: "array",
|
||||||
|
value: [
|
||||||
|
{ type: "node", value: { backendNodeId: 10 } },
|
||||||
|
{ type: "string", value: '{"width":300,"height":200}' },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: "array",
|
||||||
|
value: [
|
||||||
|
{ type: "node", value: { backendNodeId: 11 } },
|
||||||
|
{ type: "string", value: '{"width":0,"height":200}' },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
} as never;
|
||||||
|
if (method === "Runtime.releaseObjectGroup") return {} as never;
|
||||||
|
return original(tabId, method, params);
|
||||||
|
};
|
||||||
|
const context = new GeometryContext(cdp, 4);
|
||||||
|
context.registerSnapshotOwners(target, new Set([10, 11]));
|
||||||
|
const values = await Promise.all(
|
||||||
|
[10, 11].map((id) =>
|
||||||
|
context.snapshotProjection({ target, frameId: String(id) }, id, [], {
|
||||||
|
width: 1000,
|
||||||
|
height: 1000,
|
||||||
|
}),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
expect(values.every((value) => value.status === "available")).toBe(true);
|
||||||
|
expect(calls.filter((method) => method === "DOM.resolveNode")).toHaveLength(1);
|
||||||
|
expect(calls.filter((method) => method === "Runtime.evaluate")).toHaveLength(1);
|
||||||
|
await new GeometryContext(cdp, 4).snapshotProjection({ target, frameId: "child" }, 10, [], {
|
||||||
|
width: 1000,
|
||||||
|
height: 1000,
|
||||||
|
});
|
||||||
|
expect(calls.filter((method) => method === "DOM.resolveNode")).toHaveLength(2);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("waits for batch object cleanup and propagates cancellation", async () => {
|
||||||
|
const cdp = driver();
|
||||||
|
const original = cdp.send;
|
||||||
|
const controller = new AbortController();
|
||||||
|
let release!: () => void;
|
||||||
|
let cleanup!: () => void;
|
||||||
|
const started = new Promise<void>((resolve) => {
|
||||||
|
cleanup = resolve;
|
||||||
|
});
|
||||||
|
cdp.send = async (tabId, method, params) => {
|
||||||
|
if (method === "Runtime.evaluate") return {} as never;
|
||||||
|
if (method === "Runtime.releaseObjectGroup") {
|
||||||
|
cleanup();
|
||||||
|
await new Promise<void>((resolve) => {
|
||||||
|
release = resolve;
|
||||||
|
});
|
||||||
|
return {} as never;
|
||||||
|
}
|
||||||
|
return original(tabId, method, params);
|
||||||
|
};
|
||||||
|
const context = new GeometryContext(cdp, 4, undefined, controller.signal);
|
||||||
|
context.registerSnapshotOwners(target, new Set([10, 11]));
|
||||||
|
let settled = false;
|
||||||
|
const operation = context
|
||||||
|
.snapshotProjection({ target, frameId: "child" }, 10, [], { width: 1000, height: 1000 })
|
||||||
|
.finally(() => {
|
||||||
|
settled = true;
|
||||||
|
});
|
||||||
|
const rejected = expect(operation).rejects.toMatchObject({ name: "AbortError" });
|
||||||
|
await started;
|
||||||
|
controller.abort();
|
||||||
|
expect(settled).toBe(false);
|
||||||
|
release();
|
||||||
|
await rejected;
|
||||||
|
expect(cdp.calls.mock.calls.some(([, method]) => method === "DOM.resolveNode")).toBe(false);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("rejects owner mismatches and invalid numeric bounds", () => {
|
||||||
|
const input = snapshotViewportRect(
|
||||||
|
[30, 50, 120, 40],
|
||||||
|
{ target, frameId: "main" },
|
||||||
|
{ layoutUnitsPerCssPixel: 1, scrollCss: { x: 10, y: 20 } },
|
||||||
|
)!;
|
||||||
|
const projection = {
|
||||||
|
source: { target, frameId: "main" },
|
||||||
|
geometry: { sourceClips: [], edges: [], topViewport: { width: 800, height: 600 } },
|
||||||
|
};
|
||||||
|
expect(projectSnapshotRect(input, projection)).toEqual({
|
||||||
|
x: 20,
|
||||||
|
y: 30,
|
||||||
|
width: 120,
|
||||||
|
height: 40,
|
||||||
|
});
|
||||||
|
expect(
|
||||||
|
projectSnapshotRect(input, { ...projection, source: { target, frameId: "other" } }),
|
||||||
|
).toBeNull();
|
||||||
|
expect(
|
||||||
|
projectSnapshotRect(input, {
|
||||||
|
...projection,
|
||||||
|
source: { target: { tabId: 5 }, frameId: "main" },
|
||||||
|
}),
|
||||||
|
).toBeNull();
|
||||||
|
expect(
|
||||||
|
snapshotViewportRect(
|
||||||
|
[0, 0, NaN, 40],
|
||||||
|
{ target },
|
||||||
|
{ layoutUnitsPerCssPixel: 1, scrollCss: { x: 0, y: 0 } },
|
||||||
|
),
|
||||||
|
).toBeNull();
|
||||||
|
expect(
|
||||||
|
snapshotViewportRect(
|
||||||
|
[0, 0, 10, 40],
|
||||||
|
{ target },
|
||||||
|
{ layoutUnitsPerCssPixel: 1, scrollCss: { x: Infinity, y: 0 } },
|
||||||
|
),
|
||||||
|
).toBeNull();
|
||||||
|
});
|
||||||
|
|
||||||
|
it("does not turn a border quad or a failed owner read into a content projection", async () => {
|
||||||
|
const cdp: CdpRunner = {
|
||||||
|
send: vi.fn(async () => ({
|
||||||
|
model: { border: [0, 0, 100, 0, 100, 100, 0, 100] },
|
||||||
|
})) as CdpRunner["send"],
|
||||||
|
};
|
||||||
|
expect(
|
||||||
|
await new GeometryContext(cdp, 4).snapshotProjection({ target, frameId: "child" }, 10, [], {
|
||||||
|
width: 100,
|
||||||
|
height: 100,
|
||||||
|
}),
|
||||||
|
).toEqual({
|
||||||
|
status: "unavailable",
|
||||||
|
source: { target, frameId: "child" },
|
||||||
|
ownerBackendNodeId: 10,
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it("keeps ancestor clips in target coordinates instead of applying nested offsets twice", async () => {
|
||||||
|
const cdp = driver();
|
||||||
|
const projection = await new GeometryContext(cdp, 4).snapshotProjection(
|
||||||
|
{ target, frameId: "nested" },
|
||||||
|
10,
|
||||||
|
[rectPolygon({ x: 60, y: 620, w: 100, h: 100 })],
|
||||||
|
{ width: 1000, height: 1000 },
|
||||||
|
);
|
||||||
|
if (projection.status !== "available") throw new Error("expected available projection");
|
||||||
|
const input = snapshotViewportRect(
|
||||||
|
[0, 0, 300, 200],
|
||||||
|
{ target, frameId: "nested" },
|
||||||
|
{ layoutUnitsPerCssPixel: 1, scrollCss: { x: 0, y: 0 } },
|
||||||
|
);
|
||||||
|
expect(projectSnapshotRect(input!, projection.projection)).toEqual({
|
||||||
|
x: 60,
|
||||||
|
y: 620,
|
||||||
|
width: 100,
|
||||||
|
height: 100,
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it("rejects malformed frame ancestry without looping", async () => {
|
||||||
|
const cdp = driver();
|
||||||
|
const cycle: CdpFrameGraph = {
|
||||||
|
rootFrameId: "a",
|
||||||
|
frames: [
|
||||||
|
{ frameId: "a", parentFrameId: "b", target },
|
||||||
|
{ frameId: "b", parentFrameId: "a", target },
|
||||||
|
],
|
||||||
|
};
|
||||||
|
expect(await new GeometryContext(cdp, 4, cycle).targetProjection("a")).toBeNull();
|
||||||
|
expect(cdp.calls).not.toHaveBeenCalled();
|
||||||
|
const orphan: CdpFrameGraph = {
|
||||||
|
rootFrameId: "a",
|
||||||
|
frames: [{ frameId: "a", parentFrameId: "missing", target }],
|
||||||
|
};
|
||||||
|
expect(await new GeometryContext(cdp, 4, orphan).targetProjection("a")).toBeNull();
|
||||||
|
});
|
||||||
|
|
||||||
|
it("rejects a live node whose frame belongs to another target before any DOM input", async () => {
|
||||||
|
const cdp = driver();
|
||||||
|
expect(
|
||||||
|
await resolveNodeGeometry(
|
||||||
|
cdp,
|
||||||
|
4,
|
||||||
|
{ target: { tabId: 4, sessionId: "wrong" }, frameId: "child", backendNodeId: 20 },
|
||||||
|
{ scrollIntoView: true },
|
||||||
|
),
|
||||||
|
).toMatchObject({ code: "cdp_failed" });
|
||||||
|
expect(cdp.calls).not.toHaveBeenCalled();
|
||||||
|
});
|
||||||
|
|
||||||
|
it("bounds concurrent measurements and does not dispatch queued reads after cancellation", async () => {
|
||||||
|
let active = 0;
|
||||||
|
let peak = 0;
|
||||||
|
const release: Array<() => void> = [];
|
||||||
|
const send = vi.fn(async () => {
|
||||||
|
active++;
|
||||||
|
peak = Math.max(peak, active);
|
||||||
|
await new Promise<void>((resolve) => release.push(resolve));
|
||||||
|
active--;
|
||||||
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
|
cssLayoutViewport: { clientWidth: 100, clientHeight: 100 },
|
||||||
|
};
|
||||||
|
});
|
||||||
|
const controller = new AbortController();
|
||||||
|
const context = new GeometryContext(
|
||||||
|
{ send: send as CdpRunner["send"] },
|
||||||
|
4,
|
||||||
|
undefined,
|
||||||
|
controller.signal,
|
||||||
|
);
|
||||||
|
const tasks = Array.from({ length: 8 }, (_, index) =>
|
||||||
|
context.viewport({ tabId: 4, sessionId: String(index) }),
|
||||||
|
);
|
||||||
|
const settled = Promise.allSettled(tasks);
|
||||||
|
expect(send).toHaveBeenCalledTimes(4);
|
||||||
|
controller.abort();
|
||||||
|
for (const done of release) done();
|
||||||
|
const results = await settled;
|
||||||
|
expect(peak).toBe(4);
|
||||||
|
expect(send).toHaveBeenCalledTimes(4);
|
||||||
|
expect(results.filter((item) => item.status === "rejected")).toHaveLength(4);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("releases an owner object even when cancellation arrives before its viewport read", async () => {
|
||||||
|
const controller = new AbortController();
|
||||||
|
const cdp = driver();
|
||||||
|
const original = cdp.calls.getMockImplementation()!;
|
||||||
|
cdp.calls.mockImplementation(async (tab, method) => {
|
||||||
|
const result = await original(tab, method);
|
||||||
|
if (method === "DOM.resolveNode") controller.abort();
|
||||||
|
return result;
|
||||||
|
});
|
||||||
|
const context = new GeometryContext(cdp, 4, undefined, controller.signal);
|
||||||
|
await expect(
|
||||||
|
context.snapshotProjection({ target, frameId: "child" }, 10, [], {
|
||||||
|
width: 1000,
|
||||||
|
height: 1000,
|
||||||
|
}),
|
||||||
|
).rejects.toMatchObject({ name: "AbortError" });
|
||||||
|
expect(cdp.calls.mock.calls.map(([, method]) => method)).toEqual([
|
||||||
|
"DOM.getBoxModel",
|
||||||
|
"DOM.resolveNode",
|
||||||
|
"Runtime.releaseObject",
|
||||||
|
]);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("reads live owner geometry only after scrolling", async () => {
|
||||||
|
const cdp = driver();
|
||||||
|
const original = cdp.calls.getMockImplementation()!;
|
||||||
|
let scrolled = false;
|
||||||
|
cdp.calls.mockImplementation(async (tab, method) => {
|
||||||
|
if (method === "DOM.scrollIntoViewIfNeeded") {
|
||||||
|
scrolled = true;
|
||||||
|
return {};
|
||||||
|
}
|
||||||
|
if (method === "DOM.getContentQuads") {
|
||||||
|
expect(scrolled).toBe(true);
|
||||||
|
return { quads: [[60, 620, 100, 620, 100, 640, 60, 640]] };
|
||||||
|
}
|
||||||
|
if (method === "DOM.getBoxModel") expect(scrolled).toBe(true);
|
||||||
|
return original(tab, method);
|
||||||
|
});
|
||||||
|
expect(
|
||||||
|
await resolveNodeGeometry(
|
||||||
|
cdp,
|
||||||
|
4,
|
||||||
|
{ target, frameId: "child", backendNodeId: 20 },
|
||||||
|
{ scrollIntoView: true },
|
||||||
|
),
|
||||||
|
).toMatchObject({ topBounds: { x: 60, y: 620, width: 40, height: 20 } });
|
||||||
|
expect(cdp.getFrameGraph).toHaveBeenCalledTimes(1);
|
||||||
|
expect(cdp.calls.mock.calls.filter(([, method]) => method === "DOM.getBoxModel")).toHaveLength(
|
||||||
|
1,
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("adapts viewport CSS bounds to page DIP with scroll and browser zoom, never raster DPR", () => {
|
||||||
|
const viewport = { width: 1600, height: 1000, scrollX: 10, scrollY: 100, cssToDip: 0.9 };
|
||||||
|
const clip = screenshotPageRect({ x: 20, y: 30, width: 120, height: 40 }, viewport);
|
||||||
|
expect(clip).toEqual({ space: "page-dip", rect: { x: 27, y: 117, width: 108, height: 36 } });
|
||||||
|
expect(
|
||||||
|
screenshotPageRect({ x: 20, y: 30, width: 120, height: 40 }, { ...viewport, cssToDip: NaN }),
|
||||||
|
).toBeNull();
|
||||||
|
expect(
|
||||||
|
screenshotPageRect({ x: 20, y: 30, width: 120, height: 40 }, { ...viewport, cssToDip: 0 }),
|
||||||
|
).toBeNull();
|
||||||
|
});
|
||||||
|
|
||||||
|
it("retries a rejected measurement only in a new operation", async () => {
|
||||||
|
const cdp = driver();
|
||||||
|
cdp.calls.mockRejectedValueOnce(new Error("unavailable"));
|
||||||
|
const context = new GeometryContext(cdp, 4);
|
||||||
|
await expect(context.viewport(target)).rejects.toThrow("unavailable");
|
||||||
|
await expect(context.viewport(target)).rejects.toThrow("unavailable");
|
||||||
|
expect(cdp.calls).toHaveBeenCalledTimes(1);
|
||||||
|
expect(await new GeometryContext(cdp, 4).viewport(target)).toEqual({
|
||||||
|
width: 1000,
|
||||||
|
height: 1000,
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
@@ -65,7 +65,11 @@ function makeFakeCdp(handlers: Record<string, (params?: object) => unknown>) {
|
|||||||
sent.push({ method, params });
|
sent.push({ method, params });
|
||||||
const handler = handlers[method];
|
const handler = handlers[method];
|
||||||
if (!handler && method === "Page.getLayoutMetrics") {
|
if (!handler && method === "Page.getLayoutMetrics") {
|
||||||
return { cssLayoutViewport: { clientWidth: 1280, clientHeight: 720 } };
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
|
cssLayoutViewport: { clientWidth: 1280, clientHeight: 720 },
|
||||||
|
};
|
||||||
}
|
}
|
||||||
if (!handler) throw new Error(`unexpected CDP call ${method}`);
|
if (!handler) throw new Error(`unexpected CDP call ${method}`);
|
||||||
return handler(params);
|
return handler(params);
|
||||||
@@ -266,7 +270,15 @@ describe("handleScreenshot", () => {
|
|||||||
expect(sent.find((c) => c.method === "Page.captureScreenshot")).toBeUndefined();
|
expect(sent.find((c) => c.method === "Page.captureScreenshot")).toBeUndefined();
|
||||||
});
|
});
|
||||||
|
|
||||||
it("captures a clipped PNG when ref is given", async () => {
|
it.each([
|
||||||
|
{ zoom: 1, scroll: 0, expected: { x: 10, y: 20, width: 100, height: 40 } },
|
||||||
|
{ zoom: 0.9, scroll: 100, expected: { x: 9, y: 108, width: 90, height: 36 } },
|
||||||
|
{ zoom: 1.25, scroll: 100, expected: { x: 12.5, y: 150, width: 125, height: 50 } },
|
||||||
|
])("captures a ref in page DIP at zoom $zoom and scroll $scroll", async ({
|
||||||
|
zoom,
|
||||||
|
scroll,
|
||||||
|
expected,
|
||||||
|
}) => {
|
||||||
const sm = new SessionManager({ agentWindow: fakeAgentWindow([100]) });
|
const sm = new SessionManager({ agentWindow: fakeAgentWindow([100]) });
|
||||||
const ctx = await sm.start("aa11");
|
const ctx = await sm.start("aa11");
|
||||||
ctx.refStore.set("e5", 999, { tabId: 7 });
|
ctx.refStore.set("e5", 999, { tabId: 7 });
|
||||||
@@ -274,6 +286,10 @@ describe("handleScreenshot", () => {
|
|||||||
"DOM.scrollIntoViewIfNeeded": () => ({}),
|
"DOM.scrollIntoViewIfNeeded": () => ({}),
|
||||||
"DOM.getContentQuads": () => ({ quads: [[10, 20, 110, 20, 110, 60, 10, 60]] }),
|
"DOM.getContentQuads": () => ({ quads: [[10, 20, 110, 20, 110, 60, 10, 60]] }),
|
||||||
"Page.captureScreenshot": () => ({ data: TINY_PNG }),
|
"Page.captureScreenshot": () => ({ data: TINY_PNG }),
|
||||||
|
"Page.getLayoutMetrics": () => ({
|
||||||
|
cssLayoutViewport: { clientWidth: 1280, clientHeight: 720, pageX: 0, pageY: scroll },
|
||||||
|
cssVisualViewport: { zoom },
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
const captureVisibleTab = vi.fn();
|
const captureVisibleTab = vi.fn();
|
||||||
const res = await handleScreenshot(
|
const res = await handleScreenshot(
|
||||||
@@ -297,7 +313,8 @@ describe("handleScreenshot", () => {
|
|||||||
clip?: { x: number; y: number; width: number; height: number };
|
clip?: { x: number; y: number; width: number; height: number };
|
||||||
}
|
}
|
||||||
)?.clip;
|
)?.clip;
|
||||||
expect(clip).toMatchObject({ x: 10, y: 20, width: 100, height: 40 });
|
expect(clip).toMatchObject(expected);
|
||||||
|
expect(sent.filter((c) => c.method === "Page.getLayoutMetrics")).toHaveLength(1);
|
||||||
});
|
});
|
||||||
|
|
||||||
it("returns not_found for unknown ref", async () => {
|
it("returns not_found for unknown ref", async () => {
|
||||||
@@ -2481,7 +2498,11 @@ describe("handleSnapshot", () => {
|
|||||||
if (method === "Accessibility.enable") return {};
|
if (method === "Accessibility.enable") return {};
|
||||||
if (method === "Accessibility.getFullAXTree") return { nodes };
|
if (method === "Accessibility.getFullAXTree") return { nodes };
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return { cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 } };
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
||||||
|
};
|
||||||
}
|
}
|
||||||
if (method === "DOMSnapshot.enable") return {};
|
if (method === "DOMSnapshot.enable") return {};
|
||||||
if (method === "DOMSnapshot.captureSnapshot") throw new Error("snapshot unsupported");
|
if (method === "DOMSnapshot.captureSnapshot") throw new Error("snapshot unsupported");
|
||||||
@@ -2568,7 +2589,11 @@ describe("handleSnapshot", () => {
|
|||||||
if (method === "Accessibility.enable") return {};
|
if (method === "Accessibility.enable") return {};
|
||||||
if (method === "Accessibility.getFullAXTree") return { nodes: [root, button] };
|
if (method === "Accessibility.getFullAXTree") return { nodes: [root, button] };
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return { cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 } };
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
||||||
|
};
|
||||||
}
|
}
|
||||||
if (method === "DOMSnapshot.enable") return {};
|
if (method === "DOMSnapshot.enable") return {};
|
||||||
if (method === "DOMSnapshot.captureSnapshot") {
|
if (method === "DOMSnapshot.captureSnapshot") {
|
||||||
@@ -2659,7 +2684,11 @@ describe("handleSnapshot", () => {
|
|||||||
if (method === "Accessibility.enable") return {};
|
if (method === "Accessibility.enable") return {};
|
||||||
if (method === "Accessibility.getFullAXTree") return { nodes: [root, button] };
|
if (method === "Accessibility.getFullAXTree") return { nodes: [root, button] };
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return { cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 } };
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
||||||
|
};
|
||||||
}
|
}
|
||||||
if (method === "DOMSnapshot.enable") return {};
|
if (method === "DOMSnapshot.enable") return {};
|
||||||
if (method === "DOMSnapshot.captureSnapshot") {
|
if (method === "DOMSnapshot.captureSnapshot") {
|
||||||
@@ -2753,7 +2782,11 @@ describe("handleSnapshot", () => {
|
|||||||
if (method === "Accessibility.enable") return {};
|
if (method === "Accessibility.enable") return {};
|
||||||
if (method === "Accessibility.getFullAXTree") return { nodes: [root, button] };
|
if (method === "Accessibility.getFullAXTree") return { nodes: [root, button] };
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return { cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 } };
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
||||||
|
};
|
||||||
}
|
}
|
||||||
if (method === "DOMSnapshot.enable") return {};
|
if (method === "DOMSnapshot.enable") return {};
|
||||||
if (method === "DOMSnapshot.captureSnapshot") {
|
if (method === "DOMSnapshot.captureSnapshot") {
|
||||||
@@ -2918,7 +2951,11 @@ describe("handleSnapshot", () => {
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return { cssLayoutViewport: { clientWidth: 1000, clientHeight: 800 } };
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800 },
|
||||||
|
};
|
||||||
}
|
}
|
||||||
if (method === "DOMSnapshot.enable") return {};
|
if (method === "DOMSnapshot.enable") return {};
|
||||||
if (method === "DOMSnapshot.captureSnapshot") {
|
if (method === "DOMSnapshot.captureSnapshot") {
|
||||||
@@ -3131,10 +3168,14 @@ describe("handleSnapshot", () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const VP_METRICS = {
|
const VP_METRICS = {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
||||||
};
|
};
|
||||||
|
|
||||||
function makeFrameAwareDeps() {
|
function makeFrameAwareDeps(
|
||||||
|
ownerGeometry: "unavailable" | "available" | "clipped" = "unavailable",
|
||||||
|
) {
|
||||||
const strings = ["html", "body", "iframe", "button", "title", "Remote", "static", "auto"];
|
const strings = ["html", "body", "iframe", "button", "title", "Remote", "static", "auto"];
|
||||||
const i = (value: string) => strings.indexOf(value);
|
const i = (value: string) => strings.indexOf(value);
|
||||||
const styles = [i("static"), i("auto"), i("auto")];
|
const styles = [i("static"), i("auto"), i("auto")];
|
||||||
@@ -3142,6 +3183,8 @@ describe("handleSnapshot", () => {
|
|||||||
strings,
|
strings,
|
||||||
documents: [
|
documents: [
|
||||||
{
|
{
|
||||||
|
scrollOffsetX: 0,
|
||||||
|
scrollOffsetY: 0,
|
||||||
frameId: "main",
|
frameId: "main",
|
||||||
nodes: {
|
nodes: {
|
||||||
parentIndex: [-1, 0, 1],
|
parentIndex: [-1, 0, 1],
|
||||||
@@ -3162,6 +3205,8 @@ describe("handleSnapshot", () => {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
scrollOffsetX: 0,
|
||||||
|
scrollOffsetY: 0,
|
||||||
frameId: "child",
|
frameId: "child",
|
||||||
nodes: {
|
nodes: {
|
||||||
parentIndex: [-1, 0, 1],
|
parentIndex: [-1, 0, 1],
|
||||||
@@ -3214,6 +3259,16 @@ describe("handleSnapshot", () => {
|
|||||||
];
|
];
|
||||||
const send = vi.fn(async (_tabId: number, method: string) => {
|
const send = vi.fn(async (_tabId: number, method: string) => {
|
||||||
if (method === "Page.getLayoutMetrics") return VP_METRICS;
|
if (method === "Page.getLayoutMetrics") return VP_METRICS;
|
||||||
|
if (ownerGeometry !== "unavailable") {
|
||||||
|
if (method === "DOM.getBoxModel") {
|
||||||
|
const x = ownerGeometry === "clipped" ? 10000 : 100;
|
||||||
|
return { model: { content: [x, 100, x + 400, 100, x + 400, 400, x, 400] } };
|
||||||
|
}
|
||||||
|
if (method === "DOM.resolveNode") return { object: { objectId: "owner" } };
|
||||||
|
if (method === "Runtime.callFunctionOn")
|
||||||
|
return { result: { value: { width: 400, height: 300 } } };
|
||||||
|
if (method === "Runtime.releaseObject") return {};
|
||||||
|
}
|
||||||
if (method === "DOMSnapshot.enable" || method === "Accessibility.enable") return {};
|
if (method === "DOMSnapshot.enable" || method === "Accessibility.enable") return {};
|
||||||
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
||||||
if (method === "Accessibility.getFullAXTree") return { nodes: mainAx };
|
if (method === "Accessibility.getFullAXTree") return { nodes: mainAx };
|
||||||
@@ -3454,6 +3509,43 @@ describe("handleSnapshot", () => {
|
|||||||
expect(result.text).toContain("•••");
|
expect(result.text).toContain("•••");
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it.each([
|
||||||
|
undefined,
|
||||||
|
100,
|
||||||
|
0,
|
||||||
|
])("reports unavailable iframe geometry within the observation budget %s", async (maxTokens) => {
|
||||||
|
const result = await captureVomObservation(makeFrameAwareDeps().cdp, 4, "https://example.com", {
|
||||||
|
maxTokens,
|
||||||
|
});
|
||||||
|
expect(result.text.match(/@warning/g)).toHaveLength(1);
|
||||||
|
expect(result.text).toContain("geometry incomplete");
|
||||||
|
expect(result.text.startsWith("@vom 1\n")).toBe(true);
|
||||||
|
if (maxTokens === undefined) {
|
||||||
|
expect(result.truncated).toBe(false);
|
||||||
|
expect(result.text).toContain("Frame action");
|
||||||
|
expect(result.matchNodes.find((node) => node.backendNodeId === 22)).toMatchObject({
|
||||||
|
rect: null,
|
||||||
|
localRect: { x: 20, y: 30, w: 120, h: 40 },
|
||||||
|
});
|
||||||
|
}
|
||||||
|
if (maxTokens === 100) expect(Math.ceil(result.text.length / 4)).toBeLessThanOrEqual(maxTokens);
|
||||||
|
});
|
||||||
|
|
||||||
|
it.each([
|
||||||
|
"available",
|
||||||
|
"clipped",
|
||||||
|
] as const)("does not report successful %s geometry as an observation failure", async (ownerGeometry) => {
|
||||||
|
const result = await captureVomObservation(
|
||||||
|
makeFrameAwareDeps(ownerGeometry).cdp,
|
||||||
|
4,
|
||||||
|
"https://example.com",
|
||||||
|
);
|
||||||
|
expect(result.text).not.toContain("@warning");
|
||||||
|
const node = result.matchNodes.find((item) => item.backendNodeId === 22);
|
||||||
|
if (ownerGeometry === "clipped") expect(node?.rect).toBeNull();
|
||||||
|
else expect(node?.rect).toEqual({ x: 120, y: 130, w: 120, h: 40 });
|
||||||
|
});
|
||||||
|
|
||||||
it("keeps frames and rendered refs on the same frame identity", async () => {
|
it("keeps frames and rendered refs on the same frame identity", async () => {
|
||||||
const deps = makeFrameAwareDeps();
|
const deps = makeFrameAwareDeps();
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,237 @@
|
|||||||
|
// @vitest-environment node
|
||||||
|
import { describe, expect, it } from "vitest";
|
||||||
|
import type { CdpFrame, CdpFrameGraph, CdpTarget } from "@/browser-driver/frame-graph";
|
||||||
|
import { GeometryContext } from "../geometry/frame-context";
|
||||||
|
import type { CdpRunner } from "../shared";
|
||||||
|
import { captureViewModel } from "../vom/capture";
|
||||||
|
import { captureFrameData } from "../vom/frame-capture";
|
||||||
|
|
||||||
|
type Send = <T = Record<string, unknown>>(
|
||||||
|
method: string,
|
||||||
|
params?: object,
|
||||||
|
sessionId?: string,
|
||||||
|
) => Promise<T>;
|
||||||
|
type Tree = { frame: { id: string; parentId?: string; name?: string }; childFrames?: Tree[] };
|
||||||
|
type Rect = { x: number; y: number; w: number; h: number };
|
||||||
|
type Oracle = { probe: Rect; owners: Record<string, { x: number; y: number; scale: number }> };
|
||||||
|
|
||||||
|
// The independent oracle uses DOM border boxes and this fixture's axis-aligned
|
||||||
|
// iframe transforms. No production snapshot conversion/projection builds expectations.
|
||||||
|
const oracleExpression = `(() => {
|
||||||
|
const box = document.querySelector('#probe').getBoundingClientRect();
|
||||||
|
const owners = {};
|
||||||
|
for (const frame of document.querySelectorAll('iframe')) {
|
||||||
|
const rect = frame.getBoundingClientRect();
|
||||||
|
const style = getComputedStyle(frame);
|
||||||
|
const scale = rect.width / frame.offsetWidth;
|
||||||
|
owners[frame.name] = {
|
||||||
|
x: rect.x + (frame.clientLeft + parseFloat(style.paddingLeft)) * scale,
|
||||||
|
y: rect.y + (frame.clientTop + parseFloat(style.paddingTop)) * scale,
|
||||||
|
scale,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
return { probe: { x: box.x, y: box.y, w: box.width, h: box.height }, owners };
|
||||||
|
})()`;
|
||||||
|
|
||||||
|
describe.skipIf(!process.env.BSK_GEOMETRY_CHROME)("real DOMSnapshot coordinate contract", () => {
|
||||||
|
it.each([
|
||||||
|
{ deviceScale: 1, zoom: 1 },
|
||||||
|
{ deviceScale: 0.8, zoom: 1 },
|
||||||
|
{ deviceScale: 1, zoom: 1.25 },
|
||||||
|
{ deviceScale: 2, zoom: 1 },
|
||||||
|
{ deviceScale: 2, zoom: 0.8 },
|
||||||
|
])("matches DOM geometry at device scale $deviceScale and zoom $zoom", async (configuration) => {
|
||||||
|
const evalRoot = new URL("../../../../../evals/browser/", import.meta.url);
|
||||||
|
const { createEvalServer } = await import(new URL("lib/server.mjs", evalRoot).href);
|
||||||
|
const { withChrome } = await import(
|
||||||
|
new URL("cases/regression/snapshot-coordinates/chrome.mjs", evalRoot).href
|
||||||
|
);
|
||||||
|
const server = createEvalServer();
|
||||||
|
const { baseUrl } = await server.start();
|
||||||
|
try {
|
||||||
|
await withChrome(
|
||||||
|
{ executable: process.env.BSK_GEOMETRY_CHROME, ...configuration },
|
||||||
|
async (send: Send) => {
|
||||||
|
const { targetId } = await send<{ targetId: string }>("Target.createTarget", {
|
||||||
|
url: "about:blank",
|
||||||
|
});
|
||||||
|
const { sessionId: rootSession } = await send<{ sessionId: string }>(
|
||||||
|
"Target.attachToTarget",
|
||||||
|
{ targetId, flatten: true },
|
||||||
|
);
|
||||||
|
await send(
|
||||||
|
"Page.navigate",
|
||||||
|
{ url: `${baseUrl}/snapshot-coordinates?run=coordinates` },
|
||||||
|
rootSession,
|
||||||
|
);
|
||||||
|
await expect
|
||||||
|
.poll(
|
||||||
|
() =>
|
||||||
|
server
|
||||||
|
.snapshot("coordinates")
|
||||||
|
.events.some(
|
||||||
|
(event: { type: string; data: { root?: boolean } }) =>
|
||||||
|
event.type === "geometry.ready" && event.data.root,
|
||||||
|
),
|
||||||
|
{ timeout: 10_000 },
|
||||||
|
)
|
||||||
|
.toBe(true);
|
||||||
|
|
||||||
|
const targets = await send<{ targetInfos: { targetId: string; type: string }[] }>(
|
||||||
|
"Target.getTargets",
|
||||||
|
);
|
||||||
|
const sessions = [rootSession];
|
||||||
|
for (const target of targets.targetInfos.filter((target) => target.type === "iframe")) {
|
||||||
|
const { sessionId } = await send<{ sessionId: string }>("Target.attachToTarget", {
|
||||||
|
targetId: target.targetId,
|
||||||
|
flatten: true,
|
||||||
|
});
|
||||||
|
sessions.push(sessionId);
|
||||||
|
}
|
||||||
|
expect(sessions.length).toBe(2); // The cross-site fixture must actually be an OOPIF.
|
||||||
|
const frames: CdpFrame[] = [];
|
||||||
|
const names = new Map<string, string>();
|
||||||
|
const sessionFor = (target: CdpTarget) => target.sessionId ?? rootSession;
|
||||||
|
for (const sessionId of sessions) {
|
||||||
|
const { frameTree } = await send<{ frameTree: Tree }>(
|
||||||
|
"Page.getFrameTree",
|
||||||
|
{},
|
||||||
|
sessionId,
|
||||||
|
);
|
||||||
|
const target: CdpTarget = {
|
||||||
|
tabId: 1,
|
||||||
|
...(sessionId === rootSession ? {} : { sessionId }),
|
||||||
|
};
|
||||||
|
const visit = (tree: Tree, parentFrameId = tree.frame.parentId) => {
|
||||||
|
frames.push({ frameId: tree.frame.id, parentFrameId, target });
|
||||||
|
names.set(tree.frame.id, tree.frame.name ?? "");
|
||||||
|
for (const child of tree.childFrames ?? []) visit(child, tree.frame.id);
|
||||||
|
};
|
||||||
|
visit(frameTree);
|
||||||
|
}
|
||||||
|
expect(frames).toHaveLength(5);
|
||||||
|
for (const frame of frames) {
|
||||||
|
if (!frame.parentFrameId) continue;
|
||||||
|
const parent = frames.find((item) => item.frameId === frame.parentFrameId)!;
|
||||||
|
const owner = await send<{ backendNodeId: number }>(
|
||||||
|
"DOM.getFrameOwner",
|
||||||
|
{ frameId: frame.frameId },
|
||||||
|
sessionFor(parent.target),
|
||||||
|
);
|
||||||
|
frame.ownerBackendNodeId = owner.backendNodeId;
|
||||||
|
}
|
||||||
|
const graph: CdpFrameGraph = { rootFrameId: frames[0].frameId, frames };
|
||||||
|
const calls: string[] = [];
|
||||||
|
const cdp: CdpRunner = {
|
||||||
|
send: (tabId, method, params) => {
|
||||||
|
calls.push(`${tabId}:${method}`);
|
||||||
|
return send(method, params, rootSession);
|
||||||
|
},
|
||||||
|
sendToTarget: (target, method, params) => {
|
||||||
|
calls.push(`${target.sessionId ?? target.tabId}:${method}`);
|
||||||
|
return send(method, params, sessionFor(target));
|
||||||
|
},
|
||||||
|
getFrameGraph: async () => graph,
|
||||||
|
};
|
||||||
|
const oracles = new Map<string, Oracle>();
|
||||||
|
for (const frame of frames) {
|
||||||
|
const session = sessionFor(frame.target);
|
||||||
|
const { executionContextId } = await send<{ executionContextId: number }>(
|
||||||
|
"Page.createIsolatedWorld",
|
||||||
|
{ frameId: frame.frameId, worldName: "coordinate-oracle" },
|
||||||
|
session,
|
||||||
|
);
|
||||||
|
await expect
|
||||||
|
.poll(
|
||||||
|
async () => {
|
||||||
|
const ready = await send<{ result: { value: boolean } }>(
|
||||||
|
"Runtime.evaluate",
|
||||||
|
{
|
||||||
|
expression: 'document.documentElement.dataset.geometryReady === "true"',
|
||||||
|
contextId: executionContextId,
|
||||||
|
returnByValue: true,
|
||||||
|
},
|
||||||
|
session,
|
||||||
|
);
|
||||||
|
return ready.result.value;
|
||||||
|
},
|
||||||
|
{ timeout: 5_000 },
|
||||||
|
)
|
||||||
|
.toBe(true);
|
||||||
|
// Establish scroll after cross-process target creation/layout settles.
|
||||||
|
const scroll = frame.parentFrameId
|
||||||
|
? names.get(frame.frameId) === "nested"
|
||||||
|
? [10, 20]
|
||||||
|
: [40, 100]
|
||||||
|
: [80, 240];
|
||||||
|
await send(
|
||||||
|
"Runtime.evaluate",
|
||||||
|
{
|
||||||
|
expression: `(async () => { scrollTo(${scroll.join(",")}); await new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve))); })()`,
|
||||||
|
contextId: executionContextId,
|
||||||
|
awaitPromise: true,
|
||||||
|
},
|
||||||
|
session,
|
||||||
|
);
|
||||||
|
const reply = await send<{ result: { value: Oracle } }>(
|
||||||
|
"Runtime.evaluate",
|
||||||
|
{ expression: oracleExpression, contextId: executionContextId, returnByValue: true },
|
||||||
|
session,
|
||||||
|
);
|
||||||
|
oracles.set(frame.frameId, reply.result.value);
|
||||||
|
}
|
||||||
|
const geometry = new GeometryContext(cdp, 1, graph);
|
||||||
|
const captured = await captureViewModel(cdp, 1, { geometry });
|
||||||
|
await captureFrameData(cdp, 1, captured, undefined, geometry);
|
||||||
|
expect(captured.frameGeometryIssues).toEqual([]);
|
||||||
|
for (const frame of frames) {
|
||||||
|
const node = captured.frameNodes
|
||||||
|
?.get(frame.frameId)
|
||||||
|
?.find((node) => node.attrs.id === "probe");
|
||||||
|
expect(node, `missing probe in ${names.get(frame.frameId) || "root"}`).toBeDefined();
|
||||||
|
const local = oracles.get(frame.frameId)!.probe;
|
||||||
|
const top = { ...local };
|
||||||
|
let current = frame;
|
||||||
|
while (current.parentFrameId) {
|
||||||
|
const owner = oracles.get(current.parentFrameId)!.owners[names.get(current.frameId)!];
|
||||||
|
top.x = owner.x + top.x * owner.scale;
|
||||||
|
top.y = owner.y + top.y * owner.scale;
|
||||||
|
top.w *= owner.scale;
|
||||||
|
top.h *= owner.scale;
|
||||||
|
current = frames.find((item) => item.frameId === current.parentFrameId)!;
|
||||||
|
}
|
||||||
|
expect(
|
||||||
|
node!.rect,
|
||||||
|
JSON.stringify({
|
||||||
|
frame: names.get(frame.frameId),
|
||||||
|
local,
|
||||||
|
top,
|
||||||
|
viewport: captured.viewport,
|
||||||
|
}),
|
||||||
|
).not.toBeNull();
|
||||||
|
for (const key of ["x", "y", "w", "h"] as const) {
|
||||||
|
expect(
|
||||||
|
Math.abs(node!.localRect![key] - local[key]),
|
||||||
|
`${names.get(frame.frameId)} local ${key}`,
|
||||||
|
).toBeLessThan(2);
|
||||||
|
expect(
|
||||||
|
Math.abs(node!.rect![key] - top[key]),
|
||||||
|
`${names.get(frame.frameId)} top ${key}`,
|
||||||
|
).toBeLessThan(2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
expect(calls.filter((call) => call.endsWith(":Page.getLayoutMetrics"))).toHaveLength(
|
||||||
|
sessions.length,
|
||||||
|
);
|
||||||
|
const metrics = await send<{
|
||||||
|
cssVisualViewport: { zoom: number };
|
||||||
|
visualViewport: { clientWidth: number };
|
||||||
|
}>("Page.getLayoutMetrics", {}, rootSession);
|
||||||
|
expect(metrics.cssVisualViewport.zoom).toBeCloseTo(configuration.zoom, 4);
|
||||||
|
},
|
||||||
|
);
|
||||||
|
} finally {
|
||||||
|
await server.stop();
|
||||||
|
}
|
||||||
|
}, 30_000);
|
||||||
|
});
|
||||||
@@ -1,24 +1,21 @@
|
|||||||
import { type CdpFrame, type CdpFrameGraph, type CdpTarget } from "@/browser-driver/frame-graph";
|
import { type CdpTarget, cdpTargetKey } from "@/browser-driver/frame-graph";
|
||||||
import type { RpcError } from "@/transport/types";
|
import type { RpcError } from "@/transport/types";
|
||||||
import { nodeContentRegion, scrollNodeIntoView } from "./element-geometry";
|
import { nodeContentRegion, scrollNodeIntoView } from "./element-geometry";
|
||||||
import {
|
import {
|
||||||
clipPolygon,
|
clipPolygon,
|
||||||
type GeometryProjection,
|
|
||||||
type Point,
|
type Point,
|
||||||
type Polygon,
|
type Polygon,
|
||||||
type ProjectiveEdge,
|
|
||||||
parseCdpQuad,
|
|
||||||
polygonArea,
|
polygonArea,
|
||||||
polygonCentroid,
|
polygonCentroid,
|
||||||
projectRegionToViewport,
|
projectRegionToViewport,
|
||||||
type Quad,
|
|
||||||
type Region,
|
type Region,
|
||||||
rectPolygon,
|
rectPolygon,
|
||||||
regionBounds,
|
regionBounds,
|
||||||
type Size,
|
|
||||||
type ViewportRect,
|
type ViewportRect,
|
||||||
} from "./geometry";
|
} from "./geometry";
|
||||||
import { type CdpRunner, cdpRunnerForTarget, isRpcError, sendToCdpTarget } from "./shared";
|
import type { CssViewport } from "./geometry/coordinate-types";
|
||||||
|
import { cssViewport, GeometryContext } from "./geometry/frame-context";
|
||||||
|
import { type CdpRunner, cdpRunnerForTarget, isRpcError } from "./shared";
|
||||||
|
|
||||||
export interface NodeAddress {
|
export interface NodeAddress {
|
||||||
target: CdpTarget;
|
target: CdpTarget;
|
||||||
@@ -27,6 +24,8 @@ export interface NodeAddress {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export interface ResolvedNodeGeometry {
|
export interface ResolvedNodeGeometry {
|
||||||
|
/** The same top-level measurement used by projection, for screenshot coordinate adaptation. */
|
||||||
|
topViewport: CssViewport;
|
||||||
topVisibleRegions: Region;
|
topVisibleRegions: Region;
|
||||||
topBounds: ViewportRect;
|
topBounds: ViewportRect;
|
||||||
/** Point in the top-level tab viewport, used by root-target input events. */
|
/** Point in the top-level tab viewport, used by root-target input events. */
|
||||||
@@ -39,145 +38,16 @@ function geometryError(message: string): RpcError {
|
|||||||
return { code: "cdp_failed", message };
|
return { code: "cdp_failed", message };
|
||||||
}
|
}
|
||||||
|
|
||||||
function frameMap(graph: CdpFrameGraph): Map<string, CdpFrame> {
|
|
||||||
return new Map(graph.frames.map((frame) => [frame.frameId, frame]));
|
|
||||||
}
|
|
||||||
|
|
||||||
function targetRootFrame(byId: Map<string, CdpFrame>, frame: CdpFrame): CdpFrame | null {
|
|
||||||
const seen = new Set<string>();
|
|
||||||
let current = frame;
|
|
||||||
while (current.parentFrameId) {
|
|
||||||
if (seen.has(current.frameId)) return null;
|
|
||||||
seen.add(current.frameId);
|
|
||||||
const parent = byId.get(current.parentFrameId);
|
|
||||||
if (!parent || parent.target.sessionId !== current.target.sessionId) break;
|
|
||||||
current = parent;
|
|
||||||
}
|
|
||||||
return current;
|
|
||||||
}
|
|
||||||
|
|
||||||
function frameAncestry(graph: CdpFrameGraph, frameId: string): CdpFrame[] | null {
|
|
||||||
const byId = frameMap(graph);
|
|
||||||
const path: CdpFrame[] = [];
|
|
||||||
const seen = new Set<string>();
|
|
||||||
let current = byId.get(frameId);
|
|
||||||
if (!current) return null;
|
|
||||||
while (current.parentFrameId) {
|
|
||||||
if (seen.has(current.frameId)) return null;
|
|
||||||
seen.add(current.frameId);
|
|
||||||
path.push(current);
|
|
||||||
const parent = byId.get(current.parentFrameId);
|
|
||||||
if (!parent) return null;
|
|
||||||
current = parent;
|
|
||||||
}
|
|
||||||
return path;
|
|
||||||
}
|
|
||||||
|
|
||||||
async function targetViewport(cdp: CdpRunner, target: CdpTarget): Promise<Size | null> {
|
|
||||||
const metrics = await sendToCdpTarget<{
|
|
||||||
cssLayoutViewport?: { clientWidth?: number; clientHeight?: number };
|
|
||||||
layoutViewport?: { clientWidth?: number; clientHeight?: number };
|
|
||||||
}>(cdp, target, "Page.getLayoutMetrics", {});
|
|
||||||
const viewport = metrics.cssLayoutViewport ?? metrics.layoutViewport ?? {};
|
|
||||||
const width = viewport.clientWidth ?? 0;
|
|
||||||
const height = viewport.clientHeight ?? 0;
|
|
||||||
return width > 0 && height > 0 ? { width, height } : null;
|
|
||||||
}
|
|
||||||
|
|
||||||
async function ownerContentQuad(
|
|
||||||
cdp: CdpRunner,
|
|
||||||
parent: CdpFrame,
|
|
||||||
ownerBackendNodeId: number,
|
|
||||||
): Promise<Quad | null> {
|
|
||||||
const result = await sendToCdpTarget<{ model?: { content?: number[] } }>(
|
|
||||||
cdp,
|
|
||||||
parent.target,
|
|
||||||
"DOM.getBoxModel",
|
|
||||||
{ backendNodeId: ownerBackendNodeId },
|
|
||||||
);
|
|
||||||
return parseCdpQuad(result.model?.content);
|
|
||||||
}
|
|
||||||
|
|
||||||
async function sameTargetFrameClips(
|
|
||||||
cdp: CdpRunner,
|
|
||||||
byId: Map<string, CdpFrame>,
|
|
||||||
frame: CdpFrame,
|
|
||||||
targetRoot: CdpFrame,
|
|
||||||
): Promise<Polygon[] | null> {
|
|
||||||
const clips: Polygon[] = [];
|
|
||||||
let current = frame;
|
|
||||||
const seen = new Set<string>();
|
|
||||||
while (current.frameId !== targetRoot.frameId) {
|
|
||||||
if (seen.has(current.frameId) || !current.parentFrameId) return null;
|
|
||||||
seen.add(current.frameId);
|
|
||||||
const parent = byId.get(current.parentFrameId);
|
|
||||||
if (!parent || current.ownerBackendNodeId === undefined) return null;
|
|
||||||
const clip = await ownerContentQuad(cdp, parent, current.ownerBackendNodeId);
|
|
||||||
if (!clip) return null;
|
|
||||||
clips.push(clip);
|
|
||||||
current = parent;
|
|
||||||
}
|
|
||||||
return clips;
|
|
||||||
}
|
|
||||||
|
|
||||||
export async function resolveFrameProjection(
|
|
||||||
cdp: CdpRunner,
|
|
||||||
graph: CdpFrameGraph,
|
|
||||||
frameId: string,
|
|
||||||
): Promise<GeometryProjection | null> {
|
|
||||||
const byId = frameMap(graph);
|
|
||||||
const frame = byId.get(frameId);
|
|
||||||
if (!frame) return null;
|
|
||||||
let targetRoot = targetRootFrame(byId, frame);
|
|
||||||
if (!targetRoot) return null;
|
|
||||||
const sourceViewport = await targetViewport(cdp, targetRoot.target);
|
|
||||||
if (!sourceViewport) return null;
|
|
||||||
const sourceClips = await sameTargetFrameClips(cdp, byId, frame, targetRoot);
|
|
||||||
if (!sourceClips) return null;
|
|
||||||
|
|
||||||
const edges: ProjectiveEdge[] = [];
|
|
||||||
while (targetRoot.parentFrameId) {
|
|
||||||
const parent = byId.get(targetRoot.parentFrameId);
|
|
||||||
if (!parent || targetRoot.ownerBackendNodeId === undefined) return null;
|
|
||||||
const destinationQuad = await ownerContentQuad(cdp, parent, targetRoot.ownerBackendNodeId);
|
|
||||||
if (!destinationQuad) return null;
|
|
||||||
const source =
|
|
||||||
edges.length === 0 ? sourceViewport : await targetViewport(cdp, targetRoot.target);
|
|
||||||
if (!source) return null;
|
|
||||||
const parentTargetRoot = targetRootFrame(byId, parent);
|
|
||||||
if (!parentTargetRoot) return null;
|
|
||||||
const destinationClips = await sameTargetFrameClips(cdp, byId, parent, parentTargetRoot);
|
|
||||||
if (!destinationClips) return null;
|
|
||||||
edges.push({ sourceViewport: source, destinationQuad, destinationClips });
|
|
||||||
targetRoot = parentTargetRoot;
|
|
||||||
}
|
|
||||||
|
|
||||||
const topViewport =
|
|
||||||
edges.length === 0 ? sourceViewport : await targetViewport(cdp, targetRoot.target);
|
|
||||||
return topViewport ? { sourceClips, edges, topViewport } : null;
|
|
||||||
}
|
|
||||||
|
|
||||||
async function loadFrameGraph(cdp: CdpRunner, tabId: number): Promise<CdpFrameGraph | null> {
|
|
||||||
if (!cdp.getFrameGraph) return null;
|
|
||||||
try {
|
|
||||||
return await cdp.getFrameGraph(tabId);
|
|
||||||
} catch (error) {
|
|
||||||
console.debug("[bsk frame-geometry] frame graph resolution failed", error);
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function scrollFrameOwners(
|
async function scrollFrameOwners(
|
||||||
cdp: CdpRunner,
|
cdp: CdpRunner,
|
||||||
tabId: number,
|
tabId: number,
|
||||||
graph: CdpFrameGraph,
|
context: GeometryContext,
|
||||||
frameId: string,
|
frameId: string,
|
||||||
): Promise<RpcError | null> {
|
): Promise<RpcError | null> {
|
||||||
const byId = frameMap(graph);
|
const ancestry = await context.ancestry(frameId);
|
||||||
const ancestry = frameAncestry(graph, frameId);
|
|
||||||
if (!ancestry) return geometryError(`could not resolve frame ancestry for ${frameId}`);
|
if (!ancestry) return geometryError(`could not resolve frame ancestry for ${frameId}`);
|
||||||
for (const child of [...ancestry].reverse()) {
|
for (const child of [...ancestry].reverse()) {
|
||||||
const parent = child.parentFrameId ? byId.get(child.parentFrameId) : undefined;
|
const parent = child.parentFrameId ? await context.frame(child.parentFrameId) : undefined;
|
||||||
if (!parent || child.ownerBackendNodeId === undefined) {
|
if (!parent || child.ownerBackendNodeId === undefined) {
|
||||||
return geometryError(`could not resolve frame owner for ${child.frameId}`);
|
return geometryError(`could not resolve frame owner for ${child.frameId}`);
|
||||||
}
|
}
|
||||||
@@ -191,17 +61,20 @@ async function scrollFrameOwners(
|
|||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
async function scrollElementWithFrameGraph(
|
async function scrollElementWithContext(
|
||||||
cdp: CdpRunner,
|
cdp: CdpRunner,
|
||||||
tabId: number,
|
tabId: number,
|
||||||
target: CdpTarget,
|
target: CdpTarget,
|
||||||
backendNodeId: number,
|
backendNodeId: number,
|
||||||
frameId: string | undefined,
|
frameId: string | undefined,
|
||||||
graph: CdpFrameGraph | null,
|
context: GeometryContext,
|
||||||
): Promise<RpcError | null> {
|
): Promise<RpcError | null> {
|
||||||
if (frameId) {
|
if (frameId) {
|
||||||
if (!graph) return geometryError(`could not resolve frame graph for ${frameId}`);
|
const frame = await context.frame(frameId);
|
||||||
const error = await scrollFrameOwners(cdp, tabId, graph, frameId);
|
if (!frame || cdpTargetKey(frame.target) !== cdpTargetKey(target)) {
|
||||||
|
return geometryError("node frame does not belong to its target");
|
||||||
|
}
|
||||||
|
const error = await scrollFrameOwners(cdp, tabId, context, frameId);
|
||||||
if (error) return error;
|
if (error) return error;
|
||||||
} else if (target.sessionId) {
|
} else if (target.sessionId) {
|
||||||
return geometryError("an OOPIF node address requires frameId");
|
return geometryError("an OOPIF node address requires frameId");
|
||||||
@@ -216,8 +89,15 @@ export async function scrollElementAndFramesIntoView(
|
|||||||
backendNodeId: number,
|
backendNodeId: number,
|
||||||
frameId?: string,
|
frameId?: string,
|
||||||
): Promise<RpcError | null> {
|
): Promise<RpcError | null> {
|
||||||
const graph = frameId ? await loadFrameGraph(cdp, tabId) : null;
|
if (target.tabId !== tabId) return geometryError("node target belongs to another tab");
|
||||||
return scrollElementWithFrameGraph(cdp, tabId, target, backendNodeId, frameId, graph);
|
return scrollElementWithContext(
|
||||||
|
cdp,
|
||||||
|
tabId,
|
||||||
|
target,
|
||||||
|
backendNodeId,
|
||||||
|
frameId,
|
||||||
|
new GeometryContext(cdp, tabId),
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function largestRegion(regions: Region): Polygon | null {
|
function largestRegion(regions: Region): Polygon | null {
|
||||||
@@ -240,23 +120,32 @@ export async function resolveNodeGeometry(
|
|||||||
if (address.target.sessionId && !address.frameId) {
|
if (address.target.sessionId && !address.frameId) {
|
||||||
return geometryError("an OOPIF node address requires frameId");
|
return geometryError("an OOPIF node address requires frameId");
|
||||||
}
|
}
|
||||||
const graph = address.frameId ? await loadFrameGraph(cdp, tabId) : null;
|
if (address.target.tabId !== tabId) return geometryError("node target belongs to another tab");
|
||||||
|
const context = new GeometryContext(cdp, tabId);
|
||||||
|
const graph = address.frameId ? await context.graph() : null;
|
||||||
|
if (address.frameId && graph) {
|
||||||
|
const frame = await context.frame(address.frameId);
|
||||||
|
if (!frame || cdpTargetKey(frame.target) !== cdpTargetKey(address.target)) {
|
||||||
|
return geometryError("node frame does not belong to its target");
|
||||||
|
}
|
||||||
|
}
|
||||||
if (address.frameId && !graph) {
|
if (address.frameId && !graph) {
|
||||||
return geometryError(`could not resolve frame graph for ${address.frameId}`);
|
return geometryError(`could not resolve frame graph for ${address.frameId}`);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (options.scrollIntoView) {
|
if (options.scrollIntoView) {
|
||||||
const scrollError = await scrollElementWithFrameGraph(
|
const scrollError = await scrollElementWithContext(
|
||||||
cdp,
|
cdp,
|
||||||
tabId,
|
tabId,
|
||||||
address.target,
|
address.target,
|
||||||
address.backendNodeId,
|
address.backendNodeId,
|
||||||
address.frameId,
|
address.frameId,
|
||||||
graph,
|
context,
|
||||||
);
|
);
|
||||||
if (scrollError) return scrollError;
|
if (scrollError) return scrollError;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Only topology was read above. Begin live measurements after scrolling.
|
||||||
const localRegion = await nodeContentRegion(
|
const localRegion = await nodeContentRegion(
|
||||||
cdpRunnerForTarget(cdp, address.target),
|
cdpRunnerForTarget(cdp, address.target),
|
||||||
tabId,
|
tabId,
|
||||||
@@ -267,7 +156,7 @@ export async function resolveNodeGeometry(
|
|||||||
let topVisibleRegions: Region;
|
let topVisibleRegions: Region;
|
||||||
let targetActionPoint: Point | null = null;
|
let targetActionPoint: Point | null = null;
|
||||||
if (address.frameId && graph) {
|
if (address.frameId && graph) {
|
||||||
const projection = await resolveFrameProjection(cdp, graph, address.frameId);
|
const projection = await context.targetProjection(address.frameId);
|
||||||
if (!projection)
|
if (!projection)
|
||||||
return geometryError(`could not resolve frame geometry for ${address.frameId}`);
|
return geometryError(`could not resolve frame geometry for ${address.frameId}`);
|
||||||
topVisibleRegions = projectRegionToViewport(localRegion, projection);
|
topVisibleRegions = projectRegionToViewport(localRegion, projection);
|
||||||
@@ -290,7 +179,7 @@ export async function resolveNodeGeometry(
|
|||||||
targetActionPoint = localActionRegion ? polygonCentroid(localActionRegion) : null;
|
targetActionPoint = localActionRegion ? polygonCentroid(localActionRegion) : null;
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
const viewport = await targetViewport(cdp, address.target);
|
const viewport = await context.viewport(address.target);
|
||||||
if (!viewport) return geometryError("could not resolve top viewport geometry");
|
if (!viewport) return geometryError("could not resolve top viewport geometry");
|
||||||
topVisibleRegions = localRegion
|
topVisibleRegions = localRegion
|
||||||
.map((polygon) =>
|
.map((polygon) =>
|
||||||
@@ -309,7 +198,13 @@ export async function resolveNodeGeometry(
|
|||||||
return { code: "permission_denied", message: "element not visible in its target" };
|
return { code: "permission_denied", message: "element not visible in its target" };
|
||||||
}
|
}
|
||||||
targetActionPoint ??= actionPoint;
|
targetActionPoint ??= actionPoint;
|
||||||
return { topVisibleRegions, topBounds, actionPoint, targetActionPoint };
|
return {
|
||||||
|
topVisibleRegions,
|
||||||
|
topBounds,
|
||||||
|
actionPoint,
|
||||||
|
targetActionPoint,
|
||||||
|
topViewport: cssViewport(await context.layoutMetrics({ tabId })),
|
||||||
|
};
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
return geometryError(error instanceof Error ? error.message : String(error));
|
return geometryError(error instanceof Error ? error.message : String(error));
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -245,22 +245,3 @@ export function projectRectToViewport(
|
|||||||
if (!rect) return null;
|
if (!rect) return null;
|
||||||
return regionBounds(projectRegionToViewport([rectPolygon(rect)], projection));
|
return regionBounds(projectRegionToViewport([rectPolygon(rect)], projection));
|
||||||
}
|
}
|
||||||
|
|
||||||
export function childFrameProjection(
|
|
||||||
parent: GeometryProjection,
|
|
||||||
ownerRectInParent: { x: number; y: number; w: number; h: number },
|
|
||||||
): GeometryProjection {
|
|
||||||
const destinationQuad = rectPolygon(ownerRectInParent);
|
|
||||||
return {
|
|
||||||
sourceClips: [],
|
|
||||||
edges: [
|
|
||||||
{
|
|
||||||
sourceViewport: { width: ownerRectInParent.w, height: ownerRectInParent.h },
|
|
||||||
destinationQuad,
|
|
||||||
destinationClips: parent.sourceClips,
|
|
||||||
},
|
|
||||||
...parent.edges,
|
|
||||||
],
|
|
||||||
topViewport: parent.topViewport,
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|||||||
@@ -0,0 +1,157 @@
|
|||||||
|
import { type CdpTarget, cdpTargetKey } from "@/browser-driver/frame-graph";
|
||||||
|
import type { GeometryProjection, ViewportRect } from "../geometry";
|
||||||
|
import { projectRectToViewport } from "../geometry";
|
||||||
|
|
||||||
|
export interface CoordinateOwner {
|
||||||
|
target: CdpTarget;
|
||||||
|
frameId?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface FrameViewportRect {
|
||||||
|
space: "frame-viewport-css";
|
||||||
|
owner: CoordinateOwner;
|
||||||
|
rect: ViewportRect;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface SnapshotProjection {
|
||||||
|
source: CoordinateOwner;
|
||||||
|
geometry: GeometryProjection;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** A failed owner read is different from a successfully projected, clipped-out rect. */
|
||||||
|
export interface UnavailableFrameProjection {
|
||||||
|
status: "unavailable";
|
||||||
|
source: CoordinateOwner;
|
||||||
|
ownerBackendNodeId: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface UnavailableSnapshotCoordinates {
|
||||||
|
status: "unavailable";
|
||||||
|
source: CoordinateOwner;
|
||||||
|
reason: "snapshot-coordinates-unavailable";
|
||||||
|
}
|
||||||
|
|
||||||
|
export type SnapshotProjectionResult =
|
||||||
|
| { status: "available"; projection: SnapshotProjection }
|
||||||
|
| UnavailableFrameProjection;
|
||||||
|
|
||||||
|
/** Descendants inherit the failed boundary without attempting another owner read. */
|
||||||
|
export type FrameProjectionIssue =
|
||||||
|
| UnavailableFrameProjection
|
||||||
|
| UnavailableSnapshotCoordinates
|
||||||
|
| {
|
||||||
|
status: "blocked";
|
||||||
|
source: CoordinateOwner;
|
||||||
|
cause: UnavailableFrameProjection | UnavailableSnapshotCoordinates;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type FrameProjectionState = SnapshotProjectionResult | FrameProjectionIssue;
|
||||||
|
|
||||||
|
export interface SnapshotCoordinates {
|
||||||
|
layoutUnitsPerCssPixel: number;
|
||||||
|
scrollCss: { x: number; y: number };
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Snapshot scroll offsets share the raw layout units of its bounds. Only a
|
||||||
|
* target's root document may fall back to that target's CSS layout viewport. */
|
||||||
|
export function snapshotCoordinates(
|
||||||
|
document: { scrollOffsetX?: number; scrollOffsetY?: number },
|
||||||
|
layoutUnitsPerCssPixel: number | null,
|
||||||
|
rootScrollCss?: { x?: number; y?: number },
|
||||||
|
): SnapshotCoordinates | null {
|
||||||
|
if (
|
||||||
|
layoutUnitsPerCssPixel === null ||
|
||||||
|
!Number.isFinite(layoutUnitsPerCssPixel) ||
|
||||||
|
layoutUnitsPerCssPixel <= 0
|
||||||
|
)
|
||||||
|
return null;
|
||||||
|
const x =
|
||||||
|
document.scrollOffsetX === undefined
|
||||||
|
? rootScrollCss?.x
|
||||||
|
: document.scrollOffsetX / layoutUnitsPerCssPixel;
|
||||||
|
const y =
|
||||||
|
document.scrollOffsetY === undefined
|
||||||
|
? rootScrollCss?.y
|
||||||
|
: document.scrollOffsetY / layoutUnitsPerCssPixel;
|
||||||
|
if (x === undefined || y === undefined || !Number.isFinite(x) || !Number.isFinite(y)) return null;
|
||||||
|
return { layoutUnitsPerCssPixel, scrollCss: { x, y } };
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Convert raw document-relative Blink layout units exactly once, before any
|
||||||
|
* CSS viewport clipping or frame projection. This scale is not screenshot zoom. */
|
||||||
|
export function snapshotViewportRect(
|
||||||
|
bounds: number[],
|
||||||
|
owner: CoordinateOwner,
|
||||||
|
coordinates: SnapshotCoordinates | null,
|
||||||
|
): FrameViewportRect | null {
|
||||||
|
if (!coordinates || bounds.length < 4 || !bounds.slice(0, 4).every(Number.isFinite)) return null;
|
||||||
|
const { layoutUnitsPerCssPixel: scale, scrollCss: scroll } = coordinates;
|
||||||
|
const [x, y, width, height] = bounds;
|
||||||
|
if (
|
||||||
|
!Number.isFinite(scale) ||
|
||||||
|
scale <= 0 ||
|
||||||
|
width <= 0 ||
|
||||||
|
height <= 0 ||
|
||||||
|
!Number.isFinite(scroll.x) ||
|
||||||
|
!Number.isFinite(scroll.y)
|
||||||
|
) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
space: "frame-viewport-css",
|
||||||
|
owner,
|
||||||
|
rect: {
|
||||||
|
x: x / scale - scroll.x,
|
||||||
|
y: y / scale - scroll.y,
|
||||||
|
width: width / scale,
|
||||||
|
height: height / scale,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export function projectSnapshotRect(
|
||||||
|
input: FrameViewportRect,
|
||||||
|
projection: SnapshotProjection,
|
||||||
|
): ViewportRect | null {
|
||||||
|
if (
|
||||||
|
input.owner.frameId !== projection.source.frameId ||
|
||||||
|
cdpTargetKey(input.owner.target) !== cdpTargetKey(projection.source.target)
|
||||||
|
) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
const { x, y, width: w, height: h } = input.rect;
|
||||||
|
return projectRectToViewport({ x, y, w, h }, projection.geometry);
|
||||||
|
}
|
||||||
|
|
||||||
|
/** CSS viewport metadata; browser zoom is distinct from raster devicePixelRatio. */
|
||||||
|
export interface CssViewport {
|
||||||
|
width: number;
|
||||||
|
height: number;
|
||||||
|
scrollX: number;
|
||||||
|
scrollY: number;
|
||||||
|
cssToDip: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Page.captureScreenshot takes page-relative DIP, not viewport-relative CSS pixels. */
|
||||||
|
export function screenshotPageRect(
|
||||||
|
rect: ViewportRect,
|
||||||
|
viewport: CssViewport,
|
||||||
|
): { space: "page-dip"; rect: ViewportRect } | null {
|
||||||
|
const { cssToDip, scrollX, scrollY } = viewport;
|
||||||
|
if (
|
||||||
|
![rect.x, rect.y, rect.width, rect.height, cssToDip, scrollX, scrollY].every(Number.isFinite) ||
|
||||||
|
cssToDip <= 0 ||
|
||||||
|
rect.width <= 0 ||
|
||||||
|
rect.height <= 0
|
||||||
|
)
|
||||||
|
return null;
|
||||||
|
return {
|
||||||
|
space: "page-dip",
|
||||||
|
rect: {
|
||||||
|
x: (rect.x + scrollX) * cssToDip,
|
||||||
|
y: (rect.y + scrollY) * cssToDip,
|
||||||
|
width: rect.width * cssToDip,
|
||||||
|
height: rect.height * cssToDip,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}
|
||||||
@@ -0,0 +1,356 @@
|
|||||||
|
import {
|
||||||
|
type CdpFrame,
|
||||||
|
type CdpFrameGraph,
|
||||||
|
type CdpTarget,
|
||||||
|
cdpTargetKey,
|
||||||
|
} from "@/browser-driver/frame-graph";
|
||||||
|
import {
|
||||||
|
type GeometryProjection,
|
||||||
|
type Polygon,
|
||||||
|
type ProjectiveEdge,
|
||||||
|
parseCdpQuad,
|
||||||
|
type Quad,
|
||||||
|
type Size,
|
||||||
|
} from "../geometry";
|
||||||
|
import { type CdpRunner, sendToCdpTarget } from "../shared";
|
||||||
|
import type { CoordinateOwner, CssViewport, SnapshotProjectionResult } from "./coordinate-types";
|
||||||
|
|
||||||
|
import { readSnapshotOwnerSizes } from "./snapshot-owner-sizes";
|
||||||
|
|
||||||
|
export interface LayoutMetrics {
|
||||||
|
cssVisualViewport?: { zoom?: number; clientWidth?: number; clientHeight?: number };
|
||||||
|
visualViewport?: { zoom?: number; clientWidth?: number; clientHeight?: number };
|
||||||
|
cssLayoutViewport?: {
|
||||||
|
clientWidth?: number;
|
||||||
|
clientHeight?: number;
|
||||||
|
pageX?: number;
|
||||||
|
pageY?: number;
|
||||||
|
};
|
||||||
|
layoutViewport?: { clientWidth?: number; clientHeight?: number; pageX?: number; pageY?: number };
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Chromium emits these paired floating-point dimensions before/after dividing
|
||||||
|
* by LayoutZoomFactor. Integer layout viewport dimensions lose precision at
|
||||||
|
* fractional zoom. Neither visualViewport.scale nor .zoom is this conversion.
|
||||||
|
* See InspectorPageAgent::getLayoutMetrics in Chromium. */
|
||||||
|
export function snapshotLayoutScale(metrics: LayoutMetrics): number | null {
|
||||||
|
for (const dimension of ["clientWidth", "clientHeight"] as const) {
|
||||||
|
const raw = metrics.visualViewport?.[dimension];
|
||||||
|
const css = metrics.cssVisualViewport?.[dimension];
|
||||||
|
if (
|
||||||
|
raw !== undefined &&
|
||||||
|
css !== undefined &&
|
||||||
|
Number.isFinite(raw) &&
|
||||||
|
Number.isFinite(css) &&
|
||||||
|
raw > 0 &&
|
||||||
|
css > 0
|
||||||
|
) {
|
||||||
|
const scale = raw / css;
|
||||||
|
if (Number.isFinite(scale) && scale > 0) return scale;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** The legacy field is a compatibility fallback, never a source of raster DPR. */
|
||||||
|
export function cssViewport(metrics: LayoutMetrics): CssViewport {
|
||||||
|
const value = metrics.cssLayoutViewport ?? metrics.layoutViewport;
|
||||||
|
return {
|
||||||
|
width: value?.clientWidth ?? 0,
|
||||||
|
height: value?.clientHeight ?? 0,
|
||||||
|
scrollX: value?.pageX ?? 0,
|
||||||
|
scrollY: value?.pageY ?? 0,
|
||||||
|
cssToDip: metrics.cssVisualViewport?.zoom ?? metrics.visualViewport?.zoom ?? 1,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
/** One read-only measurement phase. Discard after scrolling or any later operation. */
|
||||||
|
export class GeometryContext {
|
||||||
|
private readonly metrics = new Map<string, Promise<LayoutMetrics>>();
|
||||||
|
private readonly owners = new Map<string, Promise<Quad | null>>();
|
||||||
|
private readonly projections = new Map<string, Promise<GeometryProjection | null>>();
|
||||||
|
private readonly snapshotOwners = new Map<string, Promise<{ quad: Quad; size: Size } | null>>();
|
||||||
|
private readonly sizeBatches = new Map<string, () => Promise<Map<number, Size>>>();
|
||||||
|
private active = 0;
|
||||||
|
private readonly waiting: Array<() => void> = [];
|
||||||
|
private graphPromise?: Promise<CdpFrameGraph | null>;
|
||||||
|
private framesPromise?: Promise<Map<string, CdpFrame>>;
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private readonly cdp: CdpRunner,
|
||||||
|
private readonly tabId: number,
|
||||||
|
graph?: CdpFrameGraph,
|
||||||
|
private readonly signal?: AbortSignal,
|
||||||
|
) {
|
||||||
|
if (graph) this.graphPromise = Promise.resolve(graph);
|
||||||
|
}
|
||||||
|
|
||||||
|
private async request<T>(
|
||||||
|
target: CdpTarget,
|
||||||
|
method: string,
|
||||||
|
params: object,
|
||||||
|
cleanup = false,
|
||||||
|
): Promise<T> {
|
||||||
|
if (!cleanup && this.signal?.aborted) throw new DOMException("geometry aborted", "AbortError");
|
||||||
|
if (this.active >= 4) await new Promise<void>((resolve) => this.waiting.push(resolve));
|
||||||
|
else this.active++;
|
||||||
|
try {
|
||||||
|
if (!cleanup && this.signal?.aborted)
|
||||||
|
throw new DOMException("geometry aborted", "AbortError");
|
||||||
|
return await sendToCdpTarget<T>(this.cdp, target, method, params);
|
||||||
|
} finally {
|
||||||
|
const next = this.waiting.shift();
|
||||||
|
if (next) next();
|
||||||
|
else this.active--;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
graph(): Promise<CdpFrameGraph | null> {
|
||||||
|
this.graphPromise ??=
|
||||||
|
this.cdp.getFrameGraph?.(this.tabId).catch(() => null) ?? Promise.resolve(null);
|
||||||
|
return this.graphPromise;
|
||||||
|
}
|
||||||
|
|
||||||
|
private frames(): Promise<Map<string, CdpFrame>> {
|
||||||
|
this.framesPromise ??= this.graph().then(
|
||||||
|
(graph) => new Map(graph?.frames.map((frame) => [frame.frameId, frame]) ?? []),
|
||||||
|
);
|
||||||
|
return this.framesPromise;
|
||||||
|
}
|
||||||
|
|
||||||
|
async frame(frameId: string): Promise<CdpFrame | undefined> {
|
||||||
|
return (await this.frames()).get(frameId);
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Topology only: safe to resolve before the caller scrolls frame owners. */
|
||||||
|
async ancestry(frameId: string): Promise<CdpFrame[] | null> {
|
||||||
|
const frames = await this.frames();
|
||||||
|
const path: CdpFrame[] = [];
|
||||||
|
const seen = new Set<string>();
|
||||||
|
let current = frames.get(frameId);
|
||||||
|
if (!current) return null;
|
||||||
|
while (current.parentFrameId) {
|
||||||
|
if (seen.has(current.frameId)) return null;
|
||||||
|
seen.add(current.frameId);
|
||||||
|
path.push(current);
|
||||||
|
const parent = frames.get(current.parentFrameId);
|
||||||
|
if (!parent) return null;
|
||||||
|
current = parent;
|
||||||
|
}
|
||||||
|
return path;
|
||||||
|
}
|
||||||
|
|
||||||
|
layoutMetrics(target: CdpTarget): Promise<LayoutMetrics> {
|
||||||
|
const key = cdpTargetKey(target);
|
||||||
|
let promise = this.metrics.get(key);
|
||||||
|
if (!promise) {
|
||||||
|
promise = this.request<LayoutMetrics>(target, "Page.getLayoutMetrics", {});
|
||||||
|
this.metrics.set(key, promise);
|
||||||
|
}
|
||||||
|
return promise;
|
||||||
|
}
|
||||||
|
|
||||||
|
async viewport(target: CdpTarget): Promise<Size | null> {
|
||||||
|
const { width, height } = cssViewport(await this.layoutMetrics(target));
|
||||||
|
return Number.isFinite(width) && Number.isFinite(height) && width > 0 && height > 0
|
||||||
|
? { width, height }
|
||||||
|
: null;
|
||||||
|
}
|
||||||
|
|
||||||
|
ownerContent(target: CdpTarget, backendNodeId: number): Promise<Quad | null> {
|
||||||
|
const key = `${cdpTargetKey(target)}:${backendNodeId}`;
|
||||||
|
let promise = this.owners.get(key);
|
||||||
|
if (!promise) {
|
||||||
|
promise = this.request<{ model?: { content?: number[] } }>(target, "DOM.getBoxModel", {
|
||||||
|
backendNodeId,
|
||||||
|
}).then((reply) => parseCdpQuad(reply.model?.content));
|
||||||
|
this.owners.set(key, promise);
|
||||||
|
}
|
||||||
|
return promise;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Same-target owner quads are already target-relative, including nested owners. */
|
||||||
|
async snapshotProjection(
|
||||||
|
source: CoordinateOwner,
|
||||||
|
ownerBackendNodeId: number,
|
||||||
|
ancestorClips: Polygon[],
|
||||||
|
viewport: Size,
|
||||||
|
): Promise<SnapshotProjectionResult> {
|
||||||
|
const key = `${cdpTargetKey(source.target)}:${ownerBackendNodeId}`;
|
||||||
|
let promise = this.snapshotOwners.get(key);
|
||||||
|
if (!promise) {
|
||||||
|
promise = this.snapshotOwner(source.target, ownerBackendNodeId);
|
||||||
|
this.snapshotOwners.set(key, promise);
|
||||||
|
}
|
||||||
|
let owner: { quad: Quad; size: Size } | null;
|
||||||
|
try {
|
||||||
|
owner = await promise;
|
||||||
|
} catch (error) {
|
||||||
|
if (error && typeof error === "object" && "name" in error && error.name === "AbortError")
|
||||||
|
throw error;
|
||||||
|
console.debug("[bsk geometry] frame owner unavailable", error);
|
||||||
|
owner = null;
|
||||||
|
}
|
||||||
|
return owner
|
||||||
|
? {
|
||||||
|
status: "available",
|
||||||
|
projection: {
|
||||||
|
source,
|
||||||
|
geometry: {
|
||||||
|
sourceClips: [],
|
||||||
|
edges: [
|
||||||
|
{
|
||||||
|
sourceViewport: owner.size,
|
||||||
|
destinationQuad: owner.quad,
|
||||||
|
destinationClips: ancestorClips,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
topViewport: viewport,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
: { status: "unavailable", source, ownerBackendNodeId };
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Register one target's snapshot owners; the batch starts only when a
|
||||||
|
* projection actually needs a size. Single owners keep the cheaper old path. */
|
||||||
|
registerSnapshotOwners(target: CdpTarget, owners: ReadonlySet<number>): void {
|
||||||
|
const key = cdpTargetKey(target);
|
||||||
|
if (owners.size < 2 || this.sizeBatches.has(key)) return;
|
||||||
|
let pending: Promise<Map<number, Size>> | undefined;
|
||||||
|
this.sizeBatches.set(key, () => {
|
||||||
|
pending ??= readSnapshotOwnerSizes(
|
||||||
|
(method, params, cleanup) => this.request(target, method, params, cleanup),
|
||||||
|
owners,
|
||||||
|
).catch((error) => {
|
||||||
|
if (error && typeof error === "object" && "name" in error && error.name === "AbortError")
|
||||||
|
throw error;
|
||||||
|
return new Map<number, Size>();
|
||||||
|
});
|
||||||
|
return pending;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
private async snapshotOwner(
|
||||||
|
target: CdpTarget,
|
||||||
|
backendNodeId: number,
|
||||||
|
): Promise<{ quad: Quad; size: Size } | null> {
|
||||||
|
const quad = await this.ownerContent(target, backendNodeId);
|
||||||
|
if (!quad) return null;
|
||||||
|
const batchSize = (await this.sizeBatches.get(cdpTargetKey(target))?.())?.get(backendNodeId);
|
||||||
|
if (this.signal?.aborted) throw new DOMException("geometry aborted", "AbortError");
|
||||||
|
if (batchSize) return { quad, size: batchSize };
|
||||||
|
const resolved = await this.request<{ object?: { objectId?: string } }>(
|
||||||
|
target,
|
||||||
|
"DOM.resolveNode",
|
||||||
|
{ backendNodeId },
|
||||||
|
);
|
||||||
|
const objectId = resolved.object?.objectId;
|
||||||
|
if (!objectId) return null;
|
||||||
|
try {
|
||||||
|
const reply = await this.request<{ result?: { value?: Size }; exceptionDetails?: unknown }>(
|
||||||
|
target,
|
||||||
|
"Runtime.callFunctionOn",
|
||||||
|
{
|
||||||
|
objectId,
|
||||||
|
functionDeclaration: `function() {
|
||||||
|
if (!this.isConnected) return null;
|
||||||
|
const style = getComputedStyle(this);
|
||||||
|
return {
|
||||||
|
width: this.clientWidth - parseFloat(style.paddingLeft) - parseFloat(style.paddingRight),
|
||||||
|
height: this.clientHeight - parseFloat(style.paddingTop) - parseFloat(style.paddingBottom)
|
||||||
|
};
|
||||||
|
}`,
|
||||||
|
returnByValue: true,
|
||||||
|
},
|
||||||
|
);
|
||||||
|
const size = reply.result?.value;
|
||||||
|
return !reply.exceptionDetails &&
|
||||||
|
size &&
|
||||||
|
Number.isFinite(size.width) &&
|
||||||
|
Number.isFinite(size.height) &&
|
||||||
|
size.width > 0 &&
|
||||||
|
size.height > 0
|
||||||
|
? { quad, size }
|
||||||
|
: null;
|
||||||
|
} finally {
|
||||||
|
// Cleanup must still run if cancellation arrived after resolving the object.
|
||||||
|
await this.request(target, "Runtime.releaseObject", { objectId }, true).catch(() => {});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
private targetRoot(frames: Map<string, CdpFrame>, frame: CdpFrame): CdpFrame | null {
|
||||||
|
const seen = new Set<string>();
|
||||||
|
let current = frame;
|
||||||
|
while (current.parentFrameId) {
|
||||||
|
if (seen.has(current.frameId)) return null;
|
||||||
|
seen.add(current.frameId);
|
||||||
|
const parent = frames.get(current.parentFrameId);
|
||||||
|
if (!parent) return null;
|
||||||
|
if (cdpTargetKey(parent.target) !== cdpTargetKey(current.target)) break;
|
||||||
|
current = parent;
|
||||||
|
}
|
||||||
|
return current;
|
||||||
|
}
|
||||||
|
|
||||||
|
private async clips(
|
||||||
|
frames: Map<string, CdpFrame>,
|
||||||
|
frame: CdpFrame,
|
||||||
|
root: CdpFrame,
|
||||||
|
): Promise<Polygon[] | null> {
|
||||||
|
const clips: Polygon[] = [];
|
||||||
|
let current = frame;
|
||||||
|
const seen = new Set<string>();
|
||||||
|
while (current.frameId !== root.frameId) {
|
||||||
|
if (seen.has(current.frameId) || !current.parentFrameId) return null;
|
||||||
|
seen.add(current.frameId);
|
||||||
|
const parent = frames.get(current.parentFrameId);
|
||||||
|
if (!parent || current.ownerBackendNodeId === undefined) return null;
|
||||||
|
const quad = await this.ownerContent(parent.target, current.ownerBackendNodeId);
|
||||||
|
if (!quad) return null;
|
||||||
|
clips.push(quad);
|
||||||
|
current = parent;
|
||||||
|
}
|
||||||
|
return clips;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Input is already in the frame's CDP target viewport, not its local viewport. */
|
||||||
|
targetProjection(frameId: string): Promise<GeometryProjection | null> {
|
||||||
|
let promise = this.projections.get(frameId);
|
||||||
|
if (!promise) {
|
||||||
|
promise = this.buildTargetProjection(frameId);
|
||||||
|
this.projections.set(frameId, promise);
|
||||||
|
}
|
||||||
|
return promise;
|
||||||
|
}
|
||||||
|
|
||||||
|
private async buildTargetProjection(frameId: string): Promise<GeometryProjection | null> {
|
||||||
|
const frames = await this.frames();
|
||||||
|
const frame = frames.get(frameId);
|
||||||
|
if (!frame) return null;
|
||||||
|
let root = this.targetRoot(frames, frame);
|
||||||
|
if (!root) return null;
|
||||||
|
const sourceViewport = await this.viewport(root.target);
|
||||||
|
if (!sourceViewport) return null;
|
||||||
|
const sourceClips = await this.clips(frames, frame, root);
|
||||||
|
if (!sourceClips) return null;
|
||||||
|
const edges: ProjectiveEdge[] = [];
|
||||||
|
const seen = new Set<string>();
|
||||||
|
while (root.parentFrameId) {
|
||||||
|
if (seen.has(root.frameId)) return null;
|
||||||
|
seen.add(root.frameId);
|
||||||
|
const parent = frames.get(root.parentFrameId);
|
||||||
|
if (!parent || root.ownerBackendNodeId === undefined) return null;
|
||||||
|
const destinationQuad = await this.ownerContent(parent.target, root.ownerBackendNodeId);
|
||||||
|
const source = await this.viewport(root.target);
|
||||||
|
const parentRoot = this.targetRoot(frames, parent);
|
||||||
|
if (!destinationQuad || !source || !parentRoot) return null;
|
||||||
|
const destinationClips = await this.clips(frames, parent, parentRoot);
|
||||||
|
if (!destinationClips) return null;
|
||||||
|
edges.push({ sourceViewport: source, destinationQuad, destinationClips });
|
||||||
|
root = parentRoot;
|
||||||
|
}
|
||||||
|
const topViewport = await this.viewport(root.target);
|
||||||
|
return topViewport ? { sourceClips, edges, topViewport } : null;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,74 @@
|
|||||||
|
import type { Size } from "../geometry";
|
||||||
|
|
||||||
|
interface SerializedValue {
|
||||||
|
type: string;
|
||||||
|
value?: unknown;
|
||||||
|
}
|
||||||
|
|
||||||
|
type Send = <T>(method: string, params: object, cleanup?: boolean) => Promise<T>;
|
||||||
|
|
||||||
|
/** Batch only accessible frame owners. Missing/shadow/cross-origin owners keep
|
||||||
|
* the existing node-scoped read; no page-wide style columns are requested. */
|
||||||
|
export async function readSnapshotOwnerSizes(
|
||||||
|
send: Send,
|
||||||
|
owners: ReadonlySet<number>,
|
||||||
|
): Promise<Map<number, Size>> {
|
||||||
|
const sizes = new Map<number, Size>();
|
||||||
|
const objectGroup = `bsk-frame-sizes-${crypto.randomUUID()}`;
|
||||||
|
try {
|
||||||
|
const reply = await send<{ result?: { deepSerializedValue?: SerializedValue } }>(
|
||||||
|
"Runtime.evaluate",
|
||||||
|
{
|
||||||
|
expression: `(() => {
|
||||||
|
const result = [];
|
||||||
|
const documents = [document];
|
||||||
|
for (let i = 0; i < documents.length && result.length < ${owners.size}; i++) {
|
||||||
|
for (const owner of documents[i].querySelectorAll('iframe,frame')) {
|
||||||
|
if (result.length >= ${owners.size}) break;
|
||||||
|
if (!owner.isConnected) continue;
|
||||||
|
const style = getComputedStyle(owner);
|
||||||
|
result.push([owner, JSON.stringify({
|
||||||
|
width: owner.clientWidth - parseFloat(style.paddingLeft) - parseFloat(style.paddingRight),
|
||||||
|
height: owner.clientHeight - parseFloat(style.paddingTop) - parseFloat(style.paddingBottom)
|
||||||
|
})]);
|
||||||
|
try { if (owner.contentDocument) documents.push(owner.contentDocument); } catch {}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return result;
|
||||||
|
})()`,
|
||||||
|
objectGroup,
|
||||||
|
serializationOptions: {
|
||||||
|
serialization: "deep",
|
||||||
|
maxDepth: 3,
|
||||||
|
additionalParameters: { maxNodeDepth: 0, includeShadowTree: "none" },
|
||||||
|
},
|
||||||
|
},
|
||||||
|
);
|
||||||
|
const result = reply.result?.deepSerializedValue;
|
||||||
|
if (result?.type !== "array" || !Array.isArray(result.value)) return sizes;
|
||||||
|
for (const entry of result.value as SerializedValue[]) {
|
||||||
|
if (entry.type !== "array" || !Array.isArray(entry.value)) continue;
|
||||||
|
const [node, data] = entry.value as SerializedValue[];
|
||||||
|
if (node?.type !== "node" || data?.type !== "string" || typeof data.value !== "string")
|
||||||
|
continue;
|
||||||
|
const id = (node.value as { backendNodeId?: number } | undefined)?.backendNodeId;
|
||||||
|
if (id === undefined || !owners.has(id)) continue;
|
||||||
|
try {
|
||||||
|
const size = JSON.parse(data.value) as Size;
|
||||||
|
if (
|
||||||
|
size &&
|
||||||
|
Number.isFinite(size.width) &&
|
||||||
|
Number.isFinite(size.height) &&
|
||||||
|
size.width > 0 &&
|
||||||
|
size.height > 0
|
||||||
|
)
|
||||||
|
sizes.set(id, size);
|
||||||
|
} catch {
|
||||||
|
/* An invalid entry uses the existing individual read. */
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} finally {
|
||||||
|
await send("Runtime.releaseObjectGroup", { objectGroup }, true).catch(() => {});
|
||||||
|
}
|
||||||
|
return sizes;
|
||||||
|
}
|
||||||
@@ -34,6 +34,8 @@ import type {
|
|||||||
import { attachDialogs, markDialogCursor } from "./dialogs";
|
import { attachDialogs, markDialogCursor } from "./dialogs";
|
||||||
import { rpcError } from "./errors";
|
import { rpcError } from "./errors";
|
||||||
import { resolveNodeGeometry } from "./frame-geometry";
|
import { resolveNodeGeometry } from "./frame-geometry";
|
||||||
|
import { screenshotPageRect } from "./geometry/coordinate-types";
|
||||||
|
import { cssViewport, GeometryContext } from "./geometry/frame-context";
|
||||||
import {
|
import {
|
||||||
type ChromeTabsApi,
|
type ChromeTabsApi,
|
||||||
enforceToolTargetScope,
|
enforceToolTargetScope,
|
||||||
@@ -197,15 +199,14 @@ async function captureElementScreenshot(
|
|||||||
if (isRpcError(geometry)) return geometry;
|
if (isRpcError(geometry)) return geometry;
|
||||||
if (signal?.aborted) return cancelled("screenshot");
|
if (signal?.aborted) return cancelled("screenshot");
|
||||||
const rect = geometry.topBounds;
|
const rect = geometry.topBounds;
|
||||||
|
const clip = screenshotPageRect(rect, geometry.topViewport);
|
||||||
|
if (!clip) return { code: "cdp_failed", message: "invalid screenshot coordinate space" };
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const shot = await cdp.send<{ data?: string }>(tabId, "Page.captureScreenshot", {
|
const shot = await cdp.send<{ data?: string }>(tabId, "Page.captureScreenshot", {
|
||||||
format: "png",
|
format: "png",
|
||||||
clip: {
|
clip: {
|
||||||
x: rect.x,
|
...clip.rect,
|
||||||
y: rect.y,
|
|
||||||
width: rect.width,
|
|
||||||
height: rect.height,
|
|
||||||
scale: 1,
|
scale: 1,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
@@ -984,26 +985,19 @@ function emptyCapturedViewModel(viewport = { width: 0, height: 0 }): CapturedVie
|
|||||||
return { viewport, nodes: [], iframeNodes: new Map(), excludedBackendNodeIds: new Set() };
|
return { viewport, nodes: [], iframeNodes: new Map(), excludedBackendNodeIds: new Set() };
|
||||||
}
|
}
|
||||||
|
|
||||||
interface LayoutMetricsViewportReply {
|
|
||||||
cssLayoutViewport?: { clientWidth?: number; clientHeight?: number };
|
|
||||||
layoutViewport?: { clientWidth?: number; clientHeight?: number };
|
|
||||||
}
|
|
||||||
|
|
||||||
async function fallbackCapturedViewModel(
|
async function fallbackCapturedViewModel(
|
||||||
cdp: CdpRunner,
|
cdp: CdpRunner,
|
||||||
tabId: number,
|
tabId: number,
|
||||||
|
geometry: GeometryContext,
|
||||||
signal?: AbortSignal,
|
signal?: AbortSignal,
|
||||||
): Promise<CapturedViewModel> {
|
): Promise<CapturedViewModel> {
|
||||||
throwIfAborted(signal, "observation");
|
throwIfAborted(signal, "observation");
|
||||||
let viewport = { width: 0, height: 0 };
|
let viewport = { width: 0, height: 0 };
|
||||||
try {
|
try {
|
||||||
const metrics = await cdp.send<LayoutMetricsViewportReply>(tabId, "Page.getLayoutMetrics", {});
|
const metrics = await geometry.layoutMetrics({ tabId });
|
||||||
throwIfAborted(signal, "observation");
|
throwIfAborted(signal, "observation");
|
||||||
const source = metrics.cssLayoutViewport ?? metrics.layoutViewport ?? {};
|
const source = cssViewport(metrics);
|
||||||
viewport = {
|
viewport = { width: source.width, height: source.height };
|
||||||
width: source.clientWidth ?? 0,
|
|
||||||
height: source.clientHeight ?? 0,
|
|
||||||
};
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
if (isAbortError(error)) throw error;
|
if (isAbortError(error)) throw error;
|
||||||
}
|
}
|
||||||
@@ -1016,12 +1010,13 @@ async function captureForVom(
|
|||||||
cdp: CdpRunner,
|
cdp: CdpRunner,
|
||||||
tabId: number,
|
tabId: number,
|
||||||
options: CaptureVomObservationOptions,
|
options: CaptureVomObservationOptions,
|
||||||
|
geometry: GeometryContext,
|
||||||
): Promise<CapturedViewModel> {
|
): Promise<CapturedViewModel> {
|
||||||
try {
|
try {
|
||||||
return await captureViewModel(cdp, tabId, { signal: options.signal });
|
return await captureViewModel(cdp, tabId, { signal: options.signal, geometry });
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
if (isAbortError(error)) throw error;
|
if (isAbortError(error)) throw error;
|
||||||
return fallbackCapturedViewModel(cdp, tabId, options.signal);
|
return fallbackCapturedViewModel(cdp, tabId, geometry, options.signal);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -1096,9 +1091,16 @@ export async function captureVomObservation(
|
|||||||
throwIfAborted(options.signal, "observation");
|
throwIfAborted(options.signal, "observation");
|
||||||
await cdp.ensureAttachedToUrl?.(tabId, url);
|
await cdp.ensureAttachedToUrl?.(tabId, url);
|
||||||
throwIfAborted(options.signal, "observation");
|
throwIfAborted(options.signal, "observation");
|
||||||
const captured = await captureForVom(cdp, tabId, options);
|
const geometry = new GeometryContext(cdp, tabId, undefined, options.signal);
|
||||||
|
const captured = await captureForVom(cdp, tabId, options, geometry);
|
||||||
throwIfAborted(options.signal, "observation");
|
throwIfAborted(options.signal, "observation");
|
||||||
const documents = await captureFrameData<CdpAxNode>(cdp, tabId, captured, options.signal);
|
const documents = await captureFrameData<CdpAxNode>(
|
||||||
|
cdp,
|
||||||
|
tabId,
|
||||||
|
captured,
|
||||||
|
options.signal,
|
||||||
|
geometry,
|
||||||
|
);
|
||||||
throwIfAborted(options.signal, "observation");
|
throwIfAborted(options.signal, "observation");
|
||||||
const normalizedDocuments =
|
const normalizedDocuments =
|
||||||
documents.length === 1 && captured.iframeNodes.size > 0
|
documents.length === 1 && captured.iframeNodes.size > 0
|
||||||
@@ -1131,12 +1133,21 @@ export async function captureVomObservation(
|
|||||||
captured,
|
captured,
|
||||||
hoverProbes.surfaceProbes,
|
hoverProbes.surfaceProbes,
|
||||||
);
|
);
|
||||||
|
// Reserve space using the renderer's character-based token estimate. Like VOM
|
||||||
|
// headers, this integrity notice remains visible even under a tiny token budget.
|
||||||
|
const geometryNotice = captured.frameGeometryIssues?.length
|
||||||
|
? "@warning geometry incomplete: some page or frame content has no top-level coordinates.\n"
|
||||||
|
: "";
|
||||||
const rendered = renderVom(decoratedScene, {
|
const rendered = renderVom(decoratedScene, {
|
||||||
maxDepth: options.maxDepth,
|
maxDepth: options.maxDepth,
|
||||||
maxTokens: options.maxTokens,
|
maxTokens:
|
||||||
|
!geometryNotice || options.maxTokens === undefined
|
||||||
|
? options.maxTokens
|
||||||
|
: Math.max(0, options.maxTokens - Math.ceil(geometryNotice.length / 4)),
|
||||||
redactValues: options.redactValues,
|
redactValues: options.redactValues,
|
||||||
activeRegionPolicy: options.activeRegionPolicy,
|
activeRegionPolicy: options.activeRegionPolicy,
|
||||||
});
|
});
|
||||||
|
if (geometryNotice) rendered.text += `\n${geometryNotice.trimEnd()}`;
|
||||||
throwIfAborted(options.signal, "observation");
|
throwIfAborted(options.signal, "observation");
|
||||||
return projectRecordSafeObservation({
|
return projectRecordSafeObservation({
|
||||||
rootFrameId: captured.rootFrameId ?? normalizedDocuments[0]?.frameId ?? "root",
|
rootFrameId: captured.rootFrameId ?? normalizedDocuments[0]?.frameId ?? "root",
|
||||||
|
|||||||
@@ -1,5 +1,6 @@
|
|||||||
import { describe, expect, it, vi } from "vitest";
|
import { describe, expect, it, vi } from "vitest";
|
||||||
import { OVERLAY_HOST_MARKER_ATTR, OVERLAY_HOST_NAME } from "../../../lib/overlay-bridge";
|
import { OVERLAY_HOST_MARKER_ATTR, OVERLAY_HOST_NAME } from "../../../lib/overlay-bridge";
|
||||||
|
import type { CdpRunner } from "../../shared";
|
||||||
import { captureViewModel, collectOverlayExcludedBackendIds, probeHoverSurfaces } from "../capture";
|
import { captureViewModel, collectOverlayExcludedBackendIds, probeHoverSurfaces } from "../capture";
|
||||||
|
|
||||||
// Minimal but format-accurate captureSnapshot reply: a body with one
|
// Minimal but format-accurate captureSnapshot reply: a body with one
|
||||||
@@ -210,7 +211,11 @@ function makeCdp(snapshot: unknown) {
|
|||||||
if (method === "DOMSnapshot.enable") return {};
|
if (method === "DOMSnapshot.enable") return {};
|
||||||
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return { cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 } };
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
||||||
|
};
|
||||||
}
|
}
|
||||||
if (method === "Runtime.evaluate") {
|
if (method === "Runtime.evaluate") {
|
||||||
return {
|
return {
|
||||||
@@ -298,6 +303,8 @@ describe("captureViewModel", () => {
|
|||||||
if (method === "DOMSnapshot.captureSnapshot") return hoverTriggerSnapshotReply();
|
if (method === "DOMSnapshot.captureSnapshot") return hoverTriggerSnapshotReply();
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return {
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -361,6 +368,8 @@ describe("captureViewModel", () => {
|
|||||||
if (method === "DOMSnapshot.captureSnapshot") return twoHoverTriggerSnapshotReply();
|
if (method === "DOMSnapshot.captureSnapshot") return twoHoverTriggerSnapshotReply();
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return {
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -409,6 +418,8 @@ describe("captureViewModel", () => {
|
|||||||
if (method === "DOMSnapshot.captureSnapshot") return nestedHoverTriggerSnapshotReply();
|
if (method === "DOMSnapshot.captureSnapshot") return nestedHoverTriggerSnapshotReply();
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return {
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -742,6 +753,8 @@ describe("captureViewModel", () => {
|
|||||||
if (method === "DOMSnapshot.captureSnapshot") return fakeSnapshotReply();
|
if (method === "DOMSnapshot.captureSnapshot") return fakeSnapshotReply();
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return {
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 200 },
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 200 },
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -754,7 +767,46 @@ describe("captureViewModel", () => {
|
|||||||
expect(div?.rect).toMatchObject({ y: 0, h: 600 });
|
expect(div?.rect).toMatchObject({ y: 0, h: 600 });
|
||||||
});
|
});
|
||||||
|
|
||||||
it("normalizes device-pixel bounds by devicePixelRatio", async () => {
|
it("normalizes snapshot-owned scroll before using a stale CSS metrics fallback", async () => {
|
||||||
|
const snapshot = {
|
||||||
|
strings: ["html", "button"],
|
||||||
|
documents: [
|
||||||
|
{
|
||||||
|
frameId: "root",
|
||||||
|
scrollOffsetX: 40,
|
||||||
|
scrollOffsetY: 200,
|
||||||
|
nodes: {
|
||||||
|
parentIndex: [-1, 0],
|
||||||
|
nodeName: [0, 1],
|
||||||
|
backendNodeId: [10, 11],
|
||||||
|
attributes: [[], []],
|
||||||
|
},
|
||||||
|
layout: { nodeIndex: [1], bounds: [[200, 800, 240, 80]] },
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
const cdp: CdpRunner = {
|
||||||
|
send: vi.fn(async (_tab: number, method: string) => {
|
||||||
|
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
||||||
|
if (method === "Page.getLayoutMetrics")
|
||||||
|
return {
|
||||||
|
visualViewport: { clientWidth: 2000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 999, pageY: 999 },
|
||||||
|
};
|
||||||
|
return {};
|
||||||
|
}) as CdpRunner["send"],
|
||||||
|
};
|
||||||
|
const captured = await captureViewModel(cdp, 4);
|
||||||
|
expect(captured.nodes.find((node) => node.backendNodeId === 11)).toMatchObject({
|
||||||
|
localRect: { x: 80, y: 300, w: 120, h: 40 },
|
||||||
|
rect: { x: 80, y: 300, w: 120, h: 40 },
|
||||||
|
rendered: true,
|
||||||
|
});
|
||||||
|
expect(captured.frameGeometryIssues).toEqual([]);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("normalizes raw snapshot bounds before viewport clipping", async () => {
|
||||||
const S = ["html", "body", "div", "position", "fixed", "static", "pointer-events", "auto"];
|
const S = ["html", "body", "div", "position", "fixed", "static", "pointer-events", "auto"];
|
||||||
const i = (s: string) => S.indexOf(s);
|
const i = (s: string) => S.indexOf(s);
|
||||||
const snapshot = {
|
const snapshot = {
|
||||||
@@ -788,6 +840,8 @@ describe("captureViewModel", () => {
|
|||||||
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return {
|
return {
|
||||||
|
visualViewport: { clientWidth: 2000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
||||||
layoutViewport: { clientWidth: 2000, clientHeight: 1600 },
|
layoutViewport: { clientWidth: 2000, clientHeight: 1600 },
|
||||||
};
|
};
|
||||||
@@ -802,6 +856,12 @@ describe("captureViewModel", () => {
|
|||||||
w: 1000,
|
w: 1000,
|
||||||
h: 800,
|
h: 800,
|
||||||
});
|
});
|
||||||
|
expect(nodes.find((n) => n.backendNodeId === 12)?.localRect).toEqual({
|
||||||
|
x: 0,
|
||||||
|
y: 0,
|
||||||
|
w: 1000,
|
||||||
|
h: 800,
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
it("extracts textContent from #text child nodes via nodeValue", async () => {
|
it("extracts textContent from #text child nodes via nodeValue", async () => {
|
||||||
@@ -857,6 +917,8 @@ describe("captureViewModel", () => {
|
|||||||
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return {
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -947,9 +1009,17 @@ describe("captureViewModel", () => {
|
|||||||
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return {
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
if (method === "DOM.getBoxModel")
|
||||||
|
return { model: { content: [100, 300, 900, 300, 900, 700, 100, 700] } };
|
||||||
|
if (method === "DOM.resolveNode") return { object: { objectId: "owner" } };
|
||||||
|
if (method === "Runtime.callFunctionOn")
|
||||||
|
return { result: { value: { width: 800, height: 400 } } };
|
||||||
|
if (method === "Runtime.releaseObject") return {};
|
||||||
throw new Error(method);
|
throw new Error(method);
|
||||||
}) as unknown as <T>(tabId: number, method: string, params?: object) => Promise<T>,
|
}) as unknown as <T>(tabId: number, method: string, params?: object) => Promise<T>,
|
||||||
};
|
};
|
||||||
@@ -979,7 +1049,7 @@ describe("captureViewModel", () => {
|
|||||||
expect(frameParentIds?.get("child-frame")).toBe("main-frame");
|
expect(frameParentIds?.get("child-frame")).toBe("main-frame");
|
||||||
});
|
});
|
||||||
|
|
||||||
it("captures iframe documents without requiring owner-frame geometry", async () => {
|
it("projects iframe documents independently of owner snapshot geometry", async () => {
|
||||||
const S = [
|
const S = [
|
||||||
"html",
|
"html",
|
||||||
"body",
|
"body",
|
||||||
@@ -1037,9 +1107,17 @@ describe("captureViewModel", () => {
|
|||||||
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return {
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
if (method === "DOM.getBoxModel")
|
||||||
|
return { model: { content: [100, 300, 900, 300, 900, 700, 100, 700] } };
|
||||||
|
if (method === "DOM.resolveNode") return { object: { objectId: "owner" } };
|
||||||
|
if (method === "Runtime.callFunctionOn")
|
||||||
|
return { result: { value: { width: 800, height: 400 } } };
|
||||||
|
if (method === "Runtime.releaseObject") return {};
|
||||||
throw new Error(method);
|
throw new Error(method);
|
||||||
}) as unknown as <T>(tabId: number, method: string, params?: object) => Promise<T>,
|
}) as unknown as <T>(tabId: number, method: string, params?: object) => Promise<T>,
|
||||||
};
|
};
|
||||||
@@ -1048,7 +1126,7 @@ describe("captureViewModel", () => {
|
|||||||
const input = iframeNodes.get(13)?.find((n) => n.backendNodeId === 101);
|
const input = iframeNodes.get(13)?.find((n) => n.backendNodeId === 101);
|
||||||
|
|
||||||
expect(input?.localRect).toEqual({ x: 20, y: 20, w: 120, h: 60 });
|
expect(input?.localRect).toEqual({ x: 20, y: 20, w: 120, h: 60 });
|
||||||
expect(input?.rect).toBeNull();
|
expect(input?.rect).toEqual({ x: 120, y: 320, w: 120, h: 60 });
|
||||||
});
|
});
|
||||||
|
|
||||||
it("recursively normalizes nested iframe sub-documents", async () => {
|
it("recursively normalizes nested iframe sub-documents", async () => {
|
||||||
@@ -1097,6 +1175,8 @@ describe("captureViewModel", () => {
|
|||||||
attributes: [[], [], []],
|
attributes: [[], [], []],
|
||||||
contentDocumentIndex: { index: [2], value: [2] },
|
contentDocumentIndex: { index: [2], value: [2] },
|
||||||
},
|
},
|
||||||
|
scrollOffsetX: 0,
|
||||||
|
scrollOffsetY: 0,
|
||||||
layout: {
|
layout: {
|
||||||
nodeIndex: [1, 2],
|
nodeIndex: [1, 2],
|
||||||
styles: [
|
styles: [
|
||||||
@@ -1117,6 +1197,8 @@ describe("captureViewModel", () => {
|
|||||||
backendNodeId: [30, 31],
|
backendNodeId: [30, 31],
|
||||||
attributes: [[], [i("type"), i("text")]],
|
attributes: [[], [i("type"), i("text")]],
|
||||||
},
|
},
|
||||||
|
scrollOffsetX: 0,
|
||||||
|
scrollOffsetY: 0,
|
||||||
layout: {
|
layout: {
|
||||||
nodeIndex: [1],
|
nodeIndex: [1],
|
||||||
styles: [[i("static"), i("auto")]],
|
styles: [[i("static"), i("auto")]],
|
||||||
@@ -1127,16 +1209,45 @@ describe("captureViewModel", () => {
|
|||||||
],
|
],
|
||||||
};
|
};
|
||||||
const cdp = {
|
const cdp = {
|
||||||
send: vi.fn(async (_t: number, method: string) => {
|
send: vi.fn(
|
||||||
|
async (
|
||||||
|
_t: number,
|
||||||
|
method: string,
|
||||||
|
params?: { backendNodeId?: number; objectId?: string },
|
||||||
|
) => {
|
||||||
if (method === "DOMSnapshot.enable") return {};
|
if (method === "DOMSnapshot.enable") return {};
|
||||||
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return {
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 0 },
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
if (method === "DOM.getBoxModel")
|
||||||
|
return {
|
||||||
|
model: {
|
||||||
|
content:
|
||||||
|
params?.backendNodeId === 13
|
||||||
|
? [10, 20, 310, 20, 310, 220, 10, 220]
|
||||||
|
: [15, 26, 115, 26, 115, 106, 15, 106],
|
||||||
|
},
|
||||||
|
};
|
||||||
|
if (method === "DOM.resolveNode")
|
||||||
|
return { object: { objectId: String(params?.backendNodeId) } };
|
||||||
|
if (method === "Runtime.callFunctionOn")
|
||||||
|
return {
|
||||||
|
result: {
|
||||||
|
value:
|
||||||
|
params?.objectId === "13"
|
||||||
|
? { width: 300, height: 200 }
|
||||||
|
: { width: 100, height: 80 },
|
||||||
|
},
|
||||||
|
};
|
||||||
|
if (method === "Runtime.releaseObject") return {};
|
||||||
throw new Error(method);
|
throw new Error(method);
|
||||||
}) as unknown as <T>(tabId: number, method: string, params?: object) => Promise<T>,
|
},
|
||||||
|
) as unknown as <T>(tabId: number, method: string, params?: object) => Promise<T>,
|
||||||
};
|
};
|
||||||
|
|
||||||
const { iframeNodes } = await captureViewModel(cdp, 4);
|
const { iframeNodes } = await captureViewModel(cdp, 4);
|
||||||
@@ -1150,7 +1261,7 @@ describe("captureViewModel", () => {
|
|||||||
expect(input?.rect).toEqual({ x: 16, y: 28, w: 40, h: 20 });
|
expect(input?.rect).toEqual({ x: 16, y: 28, w: 40, h: 20 });
|
||||||
});
|
});
|
||||||
|
|
||||||
it("normalizes bounds then subtracts CSS scroll at dpr>1", async () => {
|
it("subtracts CSS scroll once without dividing snapshot bounds by a metrics ratio", async () => {
|
||||||
const S = ["html", "body", "div", "position", "fixed", "static", "pointer-events", "auto"];
|
const S = ["html", "body", "div", "position", "fixed", "static", "pointer-events", "auto"];
|
||||||
const i = (s: string) => S.indexOf(s);
|
const i = (s: string) => S.indexOf(s);
|
||||||
const snapshot = {
|
const snapshot = {
|
||||||
@@ -1184,6 +1295,8 @@ describe("captureViewModel", () => {
|
|||||||
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return {
|
return {
|
||||||
|
visualViewport: { clientWidth: 2000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 100 },
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800, pageX: 0, pageY: 100 },
|
||||||
layoutViewport: { clientWidth: 2000, clientHeight: 1600 },
|
layoutViewport: { clientWidth: 2000, clientHeight: 1600 },
|
||||||
};
|
};
|
||||||
@@ -1217,3 +1330,200 @@ describe("captureViewModel", () => {
|
|||||||
expect(excluded).toEqual(new Set([200, 201, 202]));
|
expect(excluded).toEqual(new Set([200, 201, 202]));
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Six sibling frames and one nested frame exercise scheduling through the real capture entry.
|
||||||
|
function siblingCaptureFixture(
|
||||||
|
beforeReply: (method: string, params: Record<string, unknown>) => Promise<void> = async () => {},
|
||||||
|
) {
|
||||||
|
const document = (id: number, owners: number[], childIndexes: number[]) => ({
|
||||||
|
scrollOffsetX: 0,
|
||||||
|
scrollOffsetY: 0,
|
||||||
|
frameId: `frame-${id}`,
|
||||||
|
nodes: {
|
||||||
|
parentIndex: [-1, ...owners.map(() => 0)],
|
||||||
|
nodeName: [0, ...owners.map(() => 1)],
|
||||||
|
backendNodeId: [1000 + id, ...owners],
|
||||||
|
attributes: [[], ...owners.map(() => [])],
|
||||||
|
contentDocumentIndex: { index: owners.map((_, i) => i + 1), value: childIndexes },
|
||||||
|
},
|
||||||
|
layout: {
|
||||||
|
nodeIndex: [0, ...owners.map((_, i) => i + 1)],
|
||||||
|
bounds: [[0, 0, 200, 100], ...owners.map(() => [0, 0, 200, 100])],
|
||||||
|
},
|
||||||
|
});
|
||||||
|
const snapshot = {
|
||||||
|
strings: ["body", "iframe"],
|
||||||
|
documents: [
|
||||||
|
document(0, [100, 101, 102, 103, 104, 105], [1, 2, 3, 4, 5, 6]),
|
||||||
|
document(1, [200], [7]),
|
||||||
|
...Array.from({ length: 6 }, (_, i) => document(i + 2, [], [])),
|
||||||
|
],
|
||||||
|
};
|
||||||
|
let active = 0;
|
||||||
|
let peak = 0;
|
||||||
|
const send = vi.fn(async (_tabId: number, method: string, params: object = {}) => {
|
||||||
|
const args = params as Record<string, unknown>;
|
||||||
|
active++;
|
||||||
|
peak = Math.max(peak, active);
|
||||||
|
try {
|
||||||
|
await beforeReply(method, args);
|
||||||
|
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
||||||
|
if (method === "Page.getLayoutMetrics")
|
||||||
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800 },
|
||||||
|
};
|
||||||
|
if (method === "DOM.getBoxModel")
|
||||||
|
return { model: { content: [0, 0, 200, 0, 200, 100, 0, 100] } };
|
||||||
|
if (method === "DOM.resolveNode") return { object: { objectId: String(args.backendNodeId) } };
|
||||||
|
if (method === "Runtime.callFunctionOn")
|
||||||
|
return { result: { value: { width: 200, height: 100 } } };
|
||||||
|
return {};
|
||||||
|
} finally {
|
||||||
|
active--;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return {
|
||||||
|
cdp: { send: send as CdpRunner["send"] },
|
||||||
|
send,
|
||||||
|
peak: () => peak,
|
||||||
|
active: () => active,
|
||||||
|
measured: () =>
|
||||||
|
send.mock.calls
|
||||||
|
.filter(([, method]) => method === "DOM.getBoxModel")
|
||||||
|
.map(([, , params]) => (params as { backendNodeId: number }).backendNodeId),
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
describe("sibling frame measurement scheduling", () => {
|
||||||
|
it("batches same-target owner sizes without changing projected results", async () => {
|
||||||
|
const fixture = siblingCaptureFixture();
|
||||||
|
const original = fixture.cdp.send;
|
||||||
|
const methods: string[] = [];
|
||||||
|
fixture.cdp.send = async (tabId, method, params) => {
|
||||||
|
methods.push(method);
|
||||||
|
if (method === "Runtime.evaluate")
|
||||||
|
return {
|
||||||
|
result: {
|
||||||
|
deepSerializedValue: {
|
||||||
|
type: "array",
|
||||||
|
value: [100, 101, 102, 103, 104, 105, 200].map((backendNodeId) => ({
|
||||||
|
type: "array",
|
||||||
|
value: [
|
||||||
|
{ type: "node", value: { backendNodeId } },
|
||||||
|
{ type: "string", value: JSON.stringify({ width: 200, height: 100 }) },
|
||||||
|
],
|
||||||
|
})),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
} as never;
|
||||||
|
return original(tabId, method, params);
|
||||||
|
};
|
||||||
|
const captured = await captureViewModel(fixture.cdp, 4);
|
||||||
|
expect(captured.frameGeometryIssues).toEqual([]);
|
||||||
|
expect([...captured.iframeNodes.keys()]).toEqual([100, 200, 101, 102, 103, 104, 105]);
|
||||||
|
expect(captured.iframeNodes.get(200)?.[0].rect).toEqual({ x: 0, y: 0, w: 200, h: 100 });
|
||||||
|
expect(methods.filter((method) => method === "DOM.getBoxModel")).toHaveLength(7);
|
||||||
|
expect(methods.filter((method) => method === "Runtime.evaluate")).toHaveLength(1);
|
||||||
|
expect(methods.filter((method) => method === "Runtime.releaseObjectGroup")).toHaveLength(1);
|
||||||
|
expect(methods).not.toContain("DOM.resolveNode");
|
||||||
|
expect(methods).not.toContain("Runtime.callFunctionOn");
|
||||||
|
});
|
||||||
|
|
||||||
|
it("bounds concurrent reads, fills free slots and preserves depth-first output despite reordered replies", async () => {
|
||||||
|
const pending = new Map<number, () => void>();
|
||||||
|
const fixture = siblingCaptureFixture(async (method, params) => {
|
||||||
|
if (method === "DOM.getBoxModel" && Number(params.backendNodeId) < 200)
|
||||||
|
await new Promise<void>((resolve) => pending.set(Number(params.backendNodeId), resolve));
|
||||||
|
});
|
||||||
|
const capture = captureViewModel(fixture.cdp, 4);
|
||||||
|
await vi.waitFor(() => expect(pending.size).toBe(4));
|
||||||
|
expect(fixture.measured()).toEqual([100, 101, 102, 103]);
|
||||||
|
pending.get(103)!();
|
||||||
|
await vi.waitFor(() => expect(pending.has(104)).toBe(true));
|
||||||
|
pending.get(104)!();
|
||||||
|
await vi.waitFor(() => expect(pending.has(105)).toBe(true));
|
||||||
|
expect(fixture.measured()).not.toContain(200);
|
||||||
|
for (const id of [105, 102, 101, 100]) pending.get(id)!();
|
||||||
|
const captured = await capture;
|
||||||
|
expect(captured.frameGeometryIssues).toEqual([]);
|
||||||
|
expect(fixture.peak()).toBe(4);
|
||||||
|
expect(fixture.active()).toBe(0);
|
||||||
|
expect(fixture.measured()).toEqual([100, 101, 102, 103, 104, 105, 200]);
|
||||||
|
expect([...captured.iframeNodes.keys()]).toEqual([100, 200, 101, 102, 103, 104, 105]);
|
||||||
|
expect(captured.iframeNodes.get(200)?.[0].rect).toEqual({ x: 0, y: 0, w: 200, h: 100 });
|
||||||
|
for (const method of [
|
||||||
|
"DOM.getBoxModel",
|
||||||
|
"DOM.resolveNode",
|
||||||
|
"Runtime.callFunctionOn",
|
||||||
|
"Runtime.releaseObject",
|
||||||
|
])
|
||||||
|
expect(fixture.send.mock.calls.filter(([, name]) => name === method)).toHaveLength(7);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("does not measure descendants of a failed owner and retains sibling geometry and local nodes", async () => {
|
||||||
|
const fixture = siblingCaptureFixture(async (method, params) => {
|
||||||
|
if (method === "DOM.resolveNode" && params.backendNodeId === 100)
|
||||||
|
throw new Error("owner replaced");
|
||||||
|
});
|
||||||
|
const captured = await captureViewModel(fixture.cdp, 4);
|
||||||
|
expect(captured.frameGeometryIssues).toEqual([
|
||||||
|
{
|
||||||
|
status: "unavailable",
|
||||||
|
source: { target: { tabId: 4 }, frameId: "frame-1" },
|
||||||
|
ownerBackendNodeId: 100,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
status: "blocked",
|
||||||
|
source: { target: { tabId: 4 }, frameId: "frame-7" },
|
||||||
|
cause: captured.frameGeometryIssues?.[0],
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
expect(fixture.measured()).not.toContain(200);
|
||||||
|
expect(captured.iframeNodes.get(200)?.[0]).toMatchObject({
|
||||||
|
tag: "body",
|
||||||
|
rect: null,
|
||||||
|
localRect: { x: 0, y: 0, w: 200, h: 100 },
|
||||||
|
});
|
||||||
|
expect(captured.iframeNodes.get(101)?.[0].rect).toEqual({ x: 0, y: 0, w: 200, h: 100 });
|
||||||
|
expect([...captured.iframeNodes.keys()]).toEqual([100, 200, 101, 102, 103, 104, 105]);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("stops scheduling on cancellation and waits for resolved objects to be released", async () => {
|
||||||
|
const controller = new AbortController();
|
||||||
|
const resolutions = new Map<string, () => void>();
|
||||||
|
const releases = new Map<string, () => void>();
|
||||||
|
const fixture = siblingCaptureFixture(async (method, params) => {
|
||||||
|
if (method === "DOM.resolveNode")
|
||||||
|
await new Promise<void>((resolve) =>
|
||||||
|
resolutions.set(String(params.backendNodeId), resolve),
|
||||||
|
);
|
||||||
|
if (method === "Runtime.releaseObject")
|
||||||
|
await new Promise<void>((resolve) => releases.set(String(params.objectId), resolve));
|
||||||
|
});
|
||||||
|
let settled = false;
|
||||||
|
const capture = captureViewModel(fixture.cdp, 4, { signal: controller.signal });
|
||||||
|
const rejected = expect(capture).rejects.toMatchObject({ name: "AbortError" });
|
||||||
|
void capture.then(
|
||||||
|
() => {
|
||||||
|
settled = true;
|
||||||
|
},
|
||||||
|
() => {
|
||||||
|
settled = true;
|
||||||
|
},
|
||||||
|
);
|
||||||
|
await vi.waitFor(() => expect(resolutions.size).toBe(4));
|
||||||
|
controller.abort();
|
||||||
|
for (const resolve of resolutions.values()) resolve();
|
||||||
|
await vi.waitFor(() => expect(releases.size).toBe(4));
|
||||||
|
expect(settled).toBe(false);
|
||||||
|
expect(fixture.measured()).toEqual([100, 101, 102, 103]);
|
||||||
|
for (const release of releases.values()) release();
|
||||||
|
await rejected;
|
||||||
|
expect(fixture.active()).toBe(0);
|
||||||
|
expect(fixture.send.mock.calls.some(([, method]) => method === "Runtime.callFunctionOn")).toBe(
|
||||||
|
false,
|
||||||
|
);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|||||||
@@ -25,6 +25,8 @@ function childSnapshot(frameId: string, backendNodeId: number) {
|
|||||||
strings,
|
strings,
|
||||||
documents: [
|
documents: [
|
||||||
{
|
{
|
||||||
|
scrollOffsetX: 0,
|
||||||
|
scrollOffsetY: 0,
|
||||||
frameId,
|
frameId,
|
||||||
nodes: {
|
nodes: {
|
||||||
parentIndex: [-1, 0],
|
parentIndex: [-1, 0],
|
||||||
@@ -50,6 +52,72 @@ function childSnapshot(frameId: string, backendNodeId: number) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
describe("captureFrameData", () => {
|
describe("captureFrameData", () => {
|
||||||
|
it("retains nested owner failures when merging a captured OOPIF", async () => {
|
||||||
|
const owner = ownerNode(10, 50);
|
||||||
|
const captured: CapturedViewModel = {
|
||||||
|
nodes: [owner],
|
||||||
|
viewport: { width: 1000, height: 800 },
|
||||||
|
iframeNodes: new Map(),
|
||||||
|
frameNodes: new Map([["main", [owner]]]),
|
||||||
|
rootFrameId: "main",
|
||||||
|
excludedBackendNodeIds: new Set(),
|
||||||
|
};
|
||||||
|
const child = childSnapshot("child", 101);
|
||||||
|
const nested = childSnapshot("nested", 201);
|
||||||
|
const document = child.documents[0];
|
||||||
|
const snapshot = {
|
||||||
|
strings: child.strings,
|
||||||
|
documents: [
|
||||||
|
{
|
||||||
|
...document,
|
||||||
|
nodes: { ...document.nodes, contentDocumentIndex: { index: [1], value: [1] } },
|
||||||
|
},
|
||||||
|
nested.documents[0],
|
||||||
|
],
|
||||||
|
};
|
||||||
|
const reply = async (_target: unknown, method: string) => {
|
||||||
|
if (method === "Page.getLayoutMetrics")
|
||||||
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
|
cssLayoutViewport: { clientWidth: 300, clientHeight: 200 },
|
||||||
|
};
|
||||||
|
if (method === "DOMSnapshot.captureSnapshot") return snapshot;
|
||||||
|
if (method === "DOM.getBoxModel")
|
||||||
|
return { model: { content: [50, 100, 350, 100, 350, 300, 50, 300] } };
|
||||||
|
if (method === "DOM.resolveNode") throw new Error("nested owner replaced");
|
||||||
|
return {};
|
||||||
|
};
|
||||||
|
const cdp: CdpRunner = {
|
||||||
|
send: vi.fn(reply) as CdpRunner["send"],
|
||||||
|
sendToTarget: vi.fn(reply) as NonNullable<CdpRunner["sendToTarget"]>,
|
||||||
|
getFrameGraph: vi.fn(async () => ({
|
||||||
|
rootFrameId: "main",
|
||||||
|
frames: [
|
||||||
|
{ frameId: "main", target: { tabId: 4 } },
|
||||||
|
{
|
||||||
|
frameId: "child",
|
||||||
|
parentFrameId: "main",
|
||||||
|
ownerBackendNodeId: 10,
|
||||||
|
target: { tabId: 4, sessionId: "child-session" },
|
||||||
|
},
|
||||||
|
],
|
||||||
|
})),
|
||||||
|
};
|
||||||
|
await captureFrameData(cdp, 4, captured);
|
||||||
|
expect(captured.frameGeometryIssues).toEqual([
|
||||||
|
{
|
||||||
|
status: "unavailable",
|
||||||
|
source: { target: { tabId: 4, sessionId: "child-session" }, frameId: "nested" },
|
||||||
|
ownerBackendNodeId: 101,
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
expect(captured.frameNodes?.get("nested")?.[1]).toMatchObject({
|
||||||
|
rect: null,
|
||||||
|
localRect: { x: 10, y: 20, w: 100, h: 40 },
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
it("captures and positions multiple OOPIF documents missing from the root snapshot", async () => {
|
it("captures and positions multiple OOPIF documents missing from the root snapshot", async () => {
|
||||||
const leftOwner = ownerNode(10, 50);
|
const leftOwner = ownerNode(10, 50);
|
||||||
const rightOwner = ownerNode(20, 500);
|
const rightOwner = ownerNode(20, 500);
|
||||||
@@ -64,7 +132,11 @@ describe("captureFrameData", () => {
|
|||||||
};
|
};
|
||||||
const sendToTarget = vi.fn(async (target, method) => {
|
const sendToTarget = vi.fn(async (target, method) => {
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return { cssLayoutViewport: { clientWidth: 300, clientHeight: 200, pageX: 0, pageY: 0 } };
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
|
cssLayoutViewport: { clientWidth: 300, clientHeight: 200, pageX: 0, pageY: 0 },
|
||||||
|
};
|
||||||
}
|
}
|
||||||
if (method === "DOMSnapshot.enable" || method === "Accessibility.enable") return {};
|
if (method === "DOMSnapshot.enable" || method === "Accessibility.enable") return {};
|
||||||
if (method === "DOMSnapshot.captureSnapshot") {
|
if (method === "DOMSnapshot.captureSnapshot") {
|
||||||
@@ -85,7 +157,11 @@ describe("captureFrameData", () => {
|
|||||||
return { model: { content: [x, 100, x + 300, 100, x + 300, 300, x, 300] } };
|
return { model: { content: [x, 100, x + 300, 100, x + 300, 300, x, 300] } };
|
||||||
}
|
}
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return { cssLayoutViewport: { clientWidth: 1000, clientHeight: 800 } };
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800 },
|
||||||
|
};
|
||||||
}
|
}
|
||||||
throw new Error(`unexpected root ${method}`);
|
throw new Error(`unexpected root ${method}`);
|
||||||
}) as CdpRunner["send"],
|
}) as CdpRunner["send"],
|
||||||
@@ -149,7 +225,11 @@ describe("captureFrameData", () => {
|
|||||||
if (method === "Accessibility.getFullAXTree") return { nodes: [] };
|
if (method === "Accessibility.getFullAXTree") return { nodes: [] };
|
||||||
if (method === "DOM.getBoxModel") throw new Error("owner geometry unavailable");
|
if (method === "DOM.getBoxModel") throw new Error("owner geometry unavailable");
|
||||||
if (method === "Page.getLayoutMetrics") {
|
if (method === "Page.getLayoutMetrics") {
|
||||||
return { cssLayoutViewport: { clientWidth: 1000, clientHeight: 800 } };
|
return {
|
||||||
|
visualViewport: { clientWidth: 1000 },
|
||||||
|
cssVisualViewport: { clientWidth: 1000 },
|
||||||
|
cssLayoutViewport: { clientWidth: 1000, clientHeight: 800 },
|
||||||
|
};
|
||||||
}
|
}
|
||||||
throw new Error(`unexpected root ${method}`);
|
throw new Error(`unexpected root ${method}`);
|
||||||
}) as CdpRunner["send"],
|
}) as CdpRunner["send"],
|
||||||
@@ -192,7 +272,12 @@ describe("captureFrameData", () => {
|
|||||||
expect.objectContaining({ backendDOMNodeId: 101, frameId: "child" }),
|
expect.objectContaining({ backendDOMNodeId: 101, frameId: "child" }),
|
||||||
]);
|
]);
|
||||||
expect(childDocument?.domNodes.find((node) => node.backendNodeId === 101)).toEqual(
|
expect(childDocument?.domNodes.find((node) => node.backendNodeId === 101)).toEqual(
|
||||||
expect.objectContaining({ rect: null, localRect: { x: 10, y: 20, w: 100, h: 40 } }),
|
expect.objectContaining({ rect: null, localRect: null, rendered: true }),
|
||||||
);
|
);
|
||||||
|
expect(captured.frameGeometryIssues).toContainEqual({
|
||||||
|
status: "unavailable",
|
||||||
|
source: { target: { tabId: 4, sessionId: "child-session" }, frameId: "child" },
|
||||||
|
reason: "snapshot-coordinates-unavailable",
|
||||||
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -5,9 +5,22 @@
|
|||||||
// STYLE_COL so capture and visibility policy share one explicit contract.
|
// STYLE_COL so capture and visibility policy share one explicit contract.
|
||||||
|
|
||||||
import type { Rect, Viewport } from "@browser-skill/vom";
|
import type { Rect, Viewport } from "@browser-skill/vom";
|
||||||
|
import type { CdpTarget } from "@/browser-driver/frame-graph";
|
||||||
import { evaluateHoverTrigger } from "@/lib/hover-trigger-policy";
|
import { evaluateHoverTrigger } from "@/lib/hover-trigger-policy";
|
||||||
import { isOverlayHostNode, OVERLAY_HOST_SELECTOR } from "../../lib/overlay-bridge";
|
import { isOverlayHostNode, OVERLAY_HOST_SELECTOR } from "../../lib/overlay-bridge";
|
||||||
import { childFrameProjection, type GeometryProjection, projectRectToViewport } from "../geometry";
|
import {
|
||||||
|
type FrameProjectionIssue,
|
||||||
|
type FrameProjectionState,
|
||||||
|
projectSnapshotRect,
|
||||||
|
type SnapshotCoordinates,
|
||||||
|
snapshotCoordinates,
|
||||||
|
snapshotViewportRect,
|
||||||
|
} from "../geometry/coordinate-types";
|
||||||
|
import {
|
||||||
|
GeometryContext,
|
||||||
|
type LayoutMetrics,
|
||||||
|
snapshotLayoutScale,
|
||||||
|
} from "../geometry/frame-context";
|
||||||
import type { CdpRunner } from "../shared";
|
import type { CdpRunner } from "../shared";
|
||||||
import { clearHover, ProbeBudget, waitForHover } from "./hover-perception";
|
import { clearHover, ProbeBudget, waitForHover } from "./hover-perception";
|
||||||
|
|
||||||
@@ -71,12 +84,16 @@ export interface CapturedViewModel {
|
|||||||
/** Explicit DOMSnapshot frame ancestry; never inferred from backend node ids. */
|
/** Explicit DOMSnapshot frame ancestry; never inferred from backend node ids. */
|
||||||
frameParentIds?: Map<string, string>;
|
frameParentIds?: Map<string, string>;
|
||||||
rootFrameId?: string;
|
rootFrameId?: string;
|
||||||
|
/** Failed boundaries and descendants blocked by them; clipping is not a failure. */
|
||||||
|
frameGeometryIssues?: FrameProjectionIssue[];
|
||||||
/** Backend node ids belonging to the agent overlay host + its shadow subtree. */
|
/** Backend node ids belonging to the agent overlay host + its shadow subtree. */
|
||||||
excludedBackendNodeIds: Set<number>;
|
excludedBackendNodeIds: Set<number>;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface CaptureViewModelOptions {
|
export interface CaptureViewModelOptions {
|
||||||
signal?: AbortSignal;
|
signal?: AbortSignal;
|
||||||
|
geometry?: GeometryContext;
|
||||||
|
target?: CdpTarget;
|
||||||
}
|
}
|
||||||
|
|
||||||
function captureAbortError(): Error {
|
function captureAbortError(): Error {
|
||||||
@@ -147,16 +164,6 @@ interface SnapshotReply {
|
|||||||
documents?: SnapshotDocument[];
|
documents?: SnapshotDocument[];
|
||||||
}
|
}
|
||||||
|
|
||||||
interface LayoutMetricsReply {
|
|
||||||
cssLayoutViewport?: {
|
|
||||||
clientWidth?: number;
|
|
||||||
clientHeight?: number;
|
|
||||||
pageX?: number;
|
|
||||||
pageY?: number;
|
|
||||||
};
|
|
||||||
layoutViewport?: { clientWidth?: number; clientHeight?: number; pageX?: number; pageY?: number };
|
|
||||||
}
|
|
||||||
|
|
||||||
function isFormControlTag(tag: string): boolean {
|
function isFormControlTag(tag: string): boolean {
|
||||||
return tag === "input" || tag === "textarea" || tag === "select";
|
return tag === "input" || tag === "textarea" || tag === "select";
|
||||||
}
|
}
|
||||||
@@ -353,9 +360,10 @@ interface ParseDocumentResult {
|
|||||||
interface FrameContext {
|
interface FrameContext {
|
||||||
frameId?: string;
|
frameId?: string;
|
||||||
ownerFrameBackendNodeId: number | null;
|
ownerFrameBackendNodeId: number | null;
|
||||||
projection: GeometryProjection | null;
|
projection: FrameProjectionState;
|
||||||
scrollX: number;
|
target: CdpTarget;
|
||||||
scrollY: number;
|
coordinates: SnapshotCoordinates | null;
|
||||||
|
layoutUnitsPerCssPixel: number | null;
|
||||||
}
|
}
|
||||||
|
|
||||||
function str(strings: string[], idx: number | undefined): string {
|
function str(strings: string[], idx: number | undefined): string {
|
||||||
@@ -363,15 +371,6 @@ function str(strings: string[], idx: number | undefined): string {
|
|||||||
return strings[idx] ?? "";
|
return strings[idx] ?? "";
|
||||||
}
|
}
|
||||||
|
|
||||||
function devicePixelRatio(metrics: LayoutMetricsReply): number {
|
|
||||||
const layoutW = metrics.layoutViewport?.clientWidth ?? 0;
|
|
||||||
const cssW = metrics.cssLayoutViewport?.clientWidth ?? 0;
|
|
||||||
if (!layoutW || !cssW) return 1;
|
|
||||||
const dpr = layoutW / cssW;
|
|
||||||
if (!Number.isFinite(dpr) || dpr <= 0) return 1;
|
|
||||||
return dpr >= 1 ? dpr : 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
function sparseIndexMap(sparse: SparseArray | undefined): Map<number, number> {
|
function sparseIndexMap(sparse: SparseArray | undefined): Map<number, number> {
|
||||||
const out = new Map<number, number>();
|
const out = new Map<number, number>();
|
||||||
if (!sparse?.index || !sparse.value) return out;
|
if (!sparse?.index || !sparse.value) return out;
|
||||||
@@ -797,13 +796,11 @@ export async function collectOverlayExcludedBackendIds(
|
|||||||
*
|
*
|
||||||
* @param doc - the raw DOMSnapshot document object
|
* @param doc - the raw DOMSnapshot document object
|
||||||
* @param strings - the shared string table for the whole snapshot
|
* @param strings - the shared string table for the whole snapshot
|
||||||
* @param dpr - device-pixel-ratio from Page.getLayoutMetrics
|
|
||||||
* @param context - frame coordinate context; output rects are top viewport-relative
|
* @param context - frame coordinate context; output rects are top viewport-relative
|
||||||
*/
|
*/
|
||||||
function parseDocumentNodes(
|
function parseDocumentNodes(
|
||||||
doc: SnapshotDocument,
|
doc: SnapshotDocument,
|
||||||
strings: string[],
|
strings: string[],
|
||||||
dpr: number,
|
|
||||||
context: FrameContext,
|
context: FrameContext,
|
||||||
): ParseDocumentResult {
|
): ParseDocumentResult {
|
||||||
const dn = doc.nodes;
|
const dn = doc.nodes;
|
||||||
@@ -898,14 +895,18 @@ function parseDocumentNodes(
|
|||||||
if (li !== undefined) {
|
if (li !== undefined) {
|
||||||
const b = dl?.bounds?.[li];
|
const b = dl?.bounds?.[li];
|
||||||
if (b && b.length >= 4 && b[2] > 0 && b[3] > 0) {
|
if (b && b.length >= 4 && b[2] > 0 && b[3] > 0) {
|
||||||
localRect = {
|
const input = snapshotViewportRect(
|
||||||
x: b[0] / dpr - context.scrollX,
|
b,
|
||||||
y: b[1] / dpr - context.scrollY,
|
{ target: context.target, frameId: context.frameId },
|
||||||
w: b[2] / dpr,
|
context.coordinates,
|
||||||
h: b[3] / dpr,
|
);
|
||||||
};
|
if (input) {
|
||||||
const bounds = context.projection
|
const { x, y, width: w, height: h } = input.rect;
|
||||||
? projectRectToViewport(localRect, context.projection)
|
localRect = { x, y, w, h };
|
||||||
|
}
|
||||||
|
const bounds =
|
||||||
|
input && context.projection.status === "available"
|
||||||
|
? projectSnapshotRect(input, context.projection.projection)
|
||||||
: null;
|
: null;
|
||||||
rect = bounds ? { x: bounds.x, y: bounds.y, w: bounds.width, h: bounds.height } : null;
|
rect = bounds ? { x: bounds.x, y: bounds.y, w: bounds.width, h: bounds.height } : null;
|
||||||
}
|
}
|
||||||
@@ -917,7 +918,11 @@ function parseDocumentNodes(
|
|||||||
const visibility = str(strings, styleRow[visibilityCol]) || "visible";
|
const visibility = str(strings, styleRow[visibilityCol]) || "visible";
|
||||||
const opacity = str(strings, styleRow[opacityCol]) || "1";
|
const opacity = str(strings, styleRow[opacityCol]) || "1";
|
||||||
rendered =
|
rendered =
|
||||||
localRect !== null &&
|
!!b &&
|
||||||
|
b.length >= 4 &&
|
||||||
|
b.slice(0, 4).every(Number.isFinite) &&
|
||||||
|
b[2] > 0 &&
|
||||||
|
b[3] > 0 &&
|
||||||
visibility !== "hidden" &&
|
visibility !== "hidden" &&
|
||||||
visibility !== "collapse" &&
|
visibility !== "collapse" &&
|
||||||
(Number.parseFloat(opacity) || 0) > 0;
|
(Number.parseFloat(opacity) || 0) > 0;
|
||||||
@@ -974,21 +979,23 @@ function parseDocumentNodes(
|
|||||||
}
|
}
|
||||||
|
|
||||||
interface ParseFrameDocumentsResult {
|
interface ParseFrameDocumentsResult {
|
||||||
|
frameGeometryIssues: FrameProjectionIssue[];
|
||||||
iframeNodes: CapturedIframeNodes;
|
iframeNodes: CapturedIframeNodes;
|
||||||
frameOwnerBackendNodeIds: Map<string, number>;
|
frameOwnerBackendNodeIds: Map<string, number>;
|
||||||
frameParentIds: Map<string, string>;
|
frameParentIds: Map<string, string>;
|
||||||
excludedBackendNodeIds: Set<number>;
|
excludedBackendNodeIds: Set<number>;
|
||||||
}
|
}
|
||||||
|
|
||||||
function parseChildFrameDocuments(
|
async function parseChildFrameDocuments(
|
||||||
documents: SnapshotDocument[],
|
documents: SnapshotDocument[],
|
||||||
strings: string[],
|
strings: string[],
|
||||||
dpr: number,
|
|
||||||
parentDocIndex: number,
|
parentDocIndex: number,
|
||||||
parentNodes: CapturedNode[],
|
|
||||||
parentContext: FrameContext,
|
parentContext: FrameContext,
|
||||||
|
geometry: GeometryContext,
|
||||||
|
signal?: AbortSignal,
|
||||||
visited = new Set<number>(),
|
visited = new Set<number>(),
|
||||||
): ParseFrameDocumentsResult {
|
): Promise<ParseFrameDocumentsResult> {
|
||||||
|
const frameGeometryIssues: FrameProjectionIssue[] = [];
|
||||||
const iframeNodes: CapturedIframeNodes = new Map();
|
const iframeNodes: CapturedIframeNodes = new Map();
|
||||||
const frameOwnerBackendNodeIds = new Map<string, number>();
|
const frameOwnerBackendNodeIds = new Map<string, number>();
|
||||||
const frameParentIds = new Map<string, string>();
|
const frameParentIds = new Map<string, string>();
|
||||||
@@ -996,34 +1003,100 @@ function parseChildFrameDocuments(
|
|||||||
const parentDoc = documents[parentDocIndex];
|
const parentDoc = documents[parentDocIndex];
|
||||||
const cdi = sparseIndexMap(parentDoc?.nodes?.contentDocumentIndex);
|
const cdi = sparseIndexMap(parentDoc?.nodes?.contentDocumentIndex);
|
||||||
if (cdi.size === 0) {
|
if (cdi.size === 0) {
|
||||||
return { iframeNodes, frameOwnerBackendNodeIds, frameParentIds, excludedBackendNodeIds };
|
return {
|
||||||
|
iframeNodes,
|
||||||
|
frameOwnerBackendNodeIds,
|
||||||
|
frameParentIds,
|
||||||
|
excludedBackendNodeIds,
|
||||||
|
frameGeometryIssues,
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
const parentBackendIds = parentDoc?.nodes?.backendNodeId ?? [];
|
const parentBackendIds = parentDoc?.nodes?.backendNodeId ?? [];
|
||||||
const parentNodeByBackendId = new Map(parentNodes.map((node) => [node.backendNodeId, node]));
|
|
||||||
|
|
||||||
for (const [nodeArrayIdx, childDocIndex] of cdi) {
|
const children = [...cdi].flatMap(([nodeArrayIdx, childDocIndex]) => {
|
||||||
if (visited.has(childDocIndex)) continue;
|
|
||||||
const childDoc = documents[childDocIndex];
|
const childDoc = documents[childDocIndex];
|
||||||
if (!childDoc) continue;
|
|
||||||
const iframeBackendId = parentBackendIds[nodeArrayIdx];
|
const iframeBackendId = parentBackendIds[nodeArrayIdx];
|
||||||
if (iframeBackendId === undefined) continue;
|
if (visited.has(childDocIndex) || !childDoc || iframeBackendId === undefined) return [];
|
||||||
const iframeNode = parentNodeByBackendId.get(iframeBackendId);
|
const source = { target: parentContext.target, frameId: snapshotFrameId(childDoc, strings) };
|
||||||
const projection =
|
const coordinates = snapshotCoordinates(childDoc, parentContext.layoutUnitsPerCssPixel);
|
||||||
parentContext.projection && iframeNode?.localRect
|
const parent = parentContext.projection;
|
||||||
? childFrameProjection(parentContext.projection, iframeNode.localRect)
|
const projection: FrameProjectionState =
|
||||||
|
parent.status === "available"
|
||||||
|
? coordinates
|
||||||
|
? { status: "unavailable", source, ownerBackendNodeId: iframeBackendId }
|
||||||
|
: { status: "unavailable", source, reason: "snapshot-coordinates-unavailable" }
|
||||||
|
: { status: "blocked", source, cause: parent.status === "blocked" ? parent.cause : parent };
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
childDocIndex,
|
||||||
|
childDoc,
|
||||||
|
iframeBackendId,
|
||||||
|
source,
|
||||||
|
coordinates,
|
||||||
|
projection: projection as FrameProjectionState,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
});
|
||||||
|
const parentProjection =
|
||||||
|
parentContext.projection.status === "available"
|
||||||
|
? parentContext.projection.projection.geometry
|
||||||
: null;
|
: null;
|
||||||
|
if (parentProjection) {
|
||||||
|
// Measure only direct siblings. Recursion starts after these workers finish,
|
||||||
|
// so descendants never hold or recursively acquire a measurement slot.
|
||||||
|
const edge = parentProjection.edges[0];
|
||||||
|
const clips = edge
|
||||||
|
? [edge.destinationQuad, ...(edge.destinationClips ?? [])]
|
||||||
|
: parentProjection.sourceClips;
|
||||||
|
let cursor = 0;
|
||||||
|
let failure: unknown;
|
||||||
|
await Promise.all(
|
||||||
|
Array.from({ length: Math.min(4, children.length) }, async () => {
|
||||||
|
while (cursor < children.length && !signal?.aborted && !failure) {
|
||||||
|
const child = children[cursor++];
|
||||||
|
if (!child.coordinates) continue;
|
||||||
|
try {
|
||||||
|
// Owner quads are target-relative; do not apply the parent transform twice.
|
||||||
|
child.projection = await geometry.snapshotProjection(
|
||||||
|
child.source,
|
||||||
|
child.iframeBackendId,
|
||||||
|
clips,
|
||||||
|
parentProjection.topViewport,
|
||||||
|
);
|
||||||
|
} catch (error) {
|
||||||
|
failure ??= error;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}),
|
||||||
|
);
|
||||||
|
// Join all active reads, including object cleanup, before propagating abort.
|
||||||
|
if (failure) throw failure;
|
||||||
|
}
|
||||||
|
throwIfAborted(signal);
|
||||||
|
|
||||||
|
// Completion order must not change document traversal or result insertion order.
|
||||||
|
for (const {
|
||||||
|
childDocIndex,
|
||||||
|
childDoc,
|
||||||
|
iframeBackendId,
|
||||||
|
source,
|
||||||
|
projection,
|
||||||
|
coordinates,
|
||||||
|
} of children) {
|
||||||
|
throwIfAborted(signal);
|
||||||
|
if (projection.status !== "available") frameGeometryIssues.push(projection);
|
||||||
const childContext: FrameContext = {
|
const childContext: FrameContext = {
|
||||||
frameId: snapshotFrameId(childDoc, strings),
|
frameId: source.frameId,
|
||||||
|
target: source.target,
|
||||||
ownerFrameBackendNodeId: iframeBackendId,
|
ownerFrameBackendNodeId: iframeBackendId,
|
||||||
projection,
|
projection,
|
||||||
scrollX: childDoc.scrollOffsetX ?? 0,
|
coordinates,
|
||||||
scrollY: childDoc.scrollOffsetY ?? 0,
|
layoutUnitsPerCssPixel: parentContext.layoutUnitsPerCssPixel,
|
||||||
};
|
};
|
||||||
const nextVisited = new Set(visited);
|
const nextVisited = new Set(visited);
|
||||||
nextVisited.add(childDocIndex);
|
nextVisited.add(childDocIndex);
|
||||||
const parsed = parseDocumentNodes(childDoc, strings, dpr, childContext);
|
const parsed = parseDocumentNodes(childDoc, strings, childContext);
|
||||||
iframeNodes.set(iframeBackendId, parsed.nodes);
|
iframeNodes.set(iframeBackendId, parsed.nodes);
|
||||||
if (childContext.frameId) {
|
if (childContext.frameId) {
|
||||||
frameOwnerBackendNodeIds.set(childContext.frameId, iframeBackendId);
|
frameOwnerBackendNodeIds.set(childContext.frameId, iframeBackendId);
|
||||||
@@ -1031,15 +1104,16 @@ function parseChildFrameDocuments(
|
|||||||
}
|
}
|
||||||
for (const id of parsed.excludedBackendNodeIds) excludedBackendNodeIds.add(id);
|
for (const id of parsed.excludedBackendNodeIds) excludedBackendNodeIds.add(id);
|
||||||
|
|
||||||
const nested = parseChildFrameDocuments(
|
const nested = await parseChildFrameDocuments(
|
||||||
documents,
|
documents,
|
||||||
strings,
|
strings,
|
||||||
dpr,
|
|
||||||
childDocIndex,
|
childDocIndex,
|
||||||
parsed.nodes,
|
|
||||||
childContext,
|
childContext,
|
||||||
|
geometry,
|
||||||
|
signal,
|
||||||
nextVisited,
|
nextVisited,
|
||||||
);
|
);
|
||||||
|
frameGeometryIssues.push(...nested.frameGeometryIssues);
|
||||||
for (const [nestedFrameId, nestedNodes] of nested.iframeNodes) {
|
for (const [nestedFrameId, nestedNodes] of nested.iframeNodes) {
|
||||||
iframeNodes.set(nestedFrameId, nestedNodes);
|
iframeNodes.set(nestedFrameId, nestedNodes);
|
||||||
}
|
}
|
||||||
@@ -1052,7 +1126,13 @@ function parseChildFrameDocuments(
|
|||||||
for (const id of nested.excludedBackendNodeIds) excludedBackendNodeIds.add(id);
|
for (const id of nested.excludedBackendNodeIds) excludedBackendNodeIds.add(id);
|
||||||
}
|
}
|
||||||
|
|
||||||
return { iframeNodes, frameOwnerBackendNodeIds, frameParentIds, excludedBackendNodeIds };
|
return {
|
||||||
|
iframeNodes,
|
||||||
|
frameOwnerBackendNodeIds,
|
||||||
|
frameParentIds,
|
||||||
|
excludedBackendNodeIds,
|
||||||
|
frameGeometryIssues,
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function captureViewModel(
|
export async function captureViewModel(
|
||||||
@@ -1061,22 +1141,21 @@ export async function captureViewModel(
|
|||||||
options: CaptureViewModelOptions = {},
|
options: CaptureViewModelOptions = {},
|
||||||
): Promise<CapturedViewModel> {
|
): Promise<CapturedViewModel> {
|
||||||
throwIfAborted(options.signal);
|
throwIfAborted(options.signal);
|
||||||
let metrics: LayoutMetricsReply = {};
|
const target = options.target ?? { tabId };
|
||||||
|
const geometry = options.geometry ?? new GeometryContext(cdp, tabId, undefined, options.signal);
|
||||||
|
let metrics: LayoutMetrics = {};
|
||||||
try {
|
try {
|
||||||
metrics = await cdp.send<LayoutMetricsReply>(tabId, "Page.getLayoutMetrics", {});
|
metrics = await geometry.layoutMetrics(target);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
if (isAbortError(error)) throw error;
|
if (isAbortError(error)) throw error;
|
||||||
console.debug("[bsk capture] layout metrics unavailable", error);
|
console.debug("[bsk capture] layout metrics unavailable", error);
|
||||||
}
|
}
|
||||||
throwIfAborted(options.signal);
|
throwIfAborted(options.signal);
|
||||||
const dpr = devicePixelRatio(metrics);
|
|
||||||
const vpSrc = metrics.cssLayoutViewport ?? metrics.layoutViewport ?? {};
|
|
||||||
const viewport: Viewport = {
|
const viewport: Viewport = {
|
||||||
width: vpSrc.clientWidth ?? 0,
|
width: metrics.cssLayoutViewport?.clientWidth ?? 0,
|
||||||
height: vpSrc.clientHeight ?? 0,
|
height: metrics.cssLayoutViewport?.clientHeight ?? 0,
|
||||||
};
|
};
|
||||||
const scrollX = vpSrc.pageX ?? 0;
|
const layoutUnitsPerCssPixel = snapshotLayoutScale(metrics);
|
||||||
const scrollY = vpSrc.pageY ?? 0;
|
|
||||||
|
|
||||||
await cdp.send(tabId, "DOMSnapshot.enable", {});
|
await cdp.send(tabId, "DOMSnapshot.enable", {});
|
||||||
throwIfAborted(options.signal);
|
throwIfAborted(options.signal);
|
||||||
@@ -1099,22 +1178,49 @@ export async function captureViewModel(
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const source = { target, frameId: snapshotFrameId(doc0, strings) };
|
||||||
|
const coordinates = snapshotCoordinates(doc0, layoutUnitsPerCssPixel, {
|
||||||
|
x: metrics.cssLayoutViewport?.pageX,
|
||||||
|
y: metrics.cssLayoutViewport?.pageY,
|
||||||
|
});
|
||||||
const topContext: FrameContext = {
|
const topContext: FrameContext = {
|
||||||
frameId: snapshotFrameId(doc0, strings),
|
frameId: snapshotFrameId(doc0, strings),
|
||||||
ownerFrameBackendNodeId: null,
|
ownerFrameBackendNodeId: null,
|
||||||
|
target,
|
||||||
|
projection:
|
||||||
|
coordinates &&
|
||||||
|
[viewport.width, viewport.height].every((size) => Number.isFinite(size) && size > 0)
|
||||||
|
? {
|
||||||
|
status: "available",
|
||||||
projection: {
|
projection: {
|
||||||
sourceClips: [],
|
source,
|
||||||
edges: [],
|
geometry: { sourceClips: [], edges: [], topViewport: viewport },
|
||||||
topViewport: viewport,
|
|
||||||
},
|
},
|
||||||
scrollX,
|
}
|
||||||
scrollY,
|
: { status: "unavailable", source, reason: "snapshot-coordinates-unavailable" },
|
||||||
|
coordinates,
|
||||||
|
layoutUnitsPerCssPixel,
|
||||||
};
|
};
|
||||||
const mainParsed = parseDocumentNodes(doc0, strings, dpr, topContext);
|
const mainParsed = parseDocumentNodes(doc0, strings, topContext);
|
||||||
const nodes = mainParsed.nodes;
|
const nodes = mainParsed.nodes;
|
||||||
const excludedBackendNodeIds = new Set(mainParsed.excludedBackendNodeIds);
|
const excludedBackendNodeIds = new Set(mainParsed.excludedBackendNodeIds);
|
||||||
|
|
||||||
const frameParsed = parseChildFrameDocuments(documents, strings, dpr, 0, nodes, topContext);
|
const ownerIds = new Set<number>();
|
||||||
|
for (const document of documents) {
|
||||||
|
for (const index of document.nodes?.contentDocumentIndex?.index ?? []) {
|
||||||
|
const id = document.nodes?.backendNodeId?.[index];
|
||||||
|
if (id !== undefined) ownerIds.add(id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
geometry.registerSnapshotOwners(target, ownerIds);
|
||||||
|
const frameParsed = await parseChildFrameDocuments(
|
||||||
|
documents,
|
||||||
|
strings,
|
||||||
|
0,
|
||||||
|
topContext,
|
||||||
|
geometry,
|
||||||
|
options.signal,
|
||||||
|
);
|
||||||
const iframeNodes = frameParsed.iframeNodes;
|
const iframeNodes = frameParsed.iframeNodes;
|
||||||
for (const id of frameParsed.excludedBackendNodeIds) {
|
for (const id of frameParsed.excludedBackendNodeIds) {
|
||||||
excludedBackendNodeIds.add(id);
|
excludedBackendNodeIds.add(id);
|
||||||
@@ -1140,6 +1246,10 @@ export async function captureViewModel(
|
|||||||
viewport,
|
viewport,
|
||||||
iframeNodes,
|
iframeNodes,
|
||||||
frameNodes,
|
frameNodes,
|
||||||
|
frameGeometryIssues: [
|
||||||
|
...(topContext.projection.status === "available" ? [] : [topContext.projection]),
|
||||||
|
...frameParsed.frameGeometryIssues,
|
||||||
|
],
|
||||||
frameOwnerBackendNodeIds: frameParsed.frameOwnerBackendNodeIds,
|
frameOwnerBackendNodeIds: frameParsed.frameOwnerBackendNodeIds,
|
||||||
frameParentIds: frameParsed.frameParentIds,
|
frameParentIds: frameParsed.frameParentIds,
|
||||||
...(topContext.frameId ? { rootFrameId: topContext.frameId } : {}),
|
...(topContext.frameId ? { rootFrameId: topContext.frameId } : {}),
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import type { CdpFrame, CdpFrameGraph } from "@/browser-driver/frame-graph";
|
import type { CdpFrame, CdpFrameGraph } from "@/browser-driver/frame-graph";
|
||||||
import { resolveFrameProjection } from "../frame-geometry";
|
|
||||||
import { type GeometryProjection, projectRectToViewport } from "../geometry";
|
import { type GeometryProjection, projectRectToViewport } from "../geometry";
|
||||||
|
import { GeometryContext } from "../geometry/frame-context";
|
||||||
import { type CdpRunner, cdpRunnerForTarget, sendToCdpTarget } from "../shared";
|
import { type CdpRunner, cdpRunnerForTarget, sendToCdpTarget } from "../shared";
|
||||||
import { type CapturedNode, type CapturedViewModel, captureViewModel } from "./capture";
|
import { type CapturedNode, type CapturedViewModel, captureViewModel } from "./capture";
|
||||||
import {
|
import {
|
||||||
@@ -21,16 +21,6 @@ function isAbortError(err: unknown): boolean {
|
|||||||
return err instanceof Error && err.name === "AbortError";
|
return err instanceof Error && err.name === "AbortError";
|
||||||
}
|
}
|
||||||
|
|
||||||
async function discoverFrameGraph(cdp: CdpRunner, tabId: number): Promise<CdpFrameGraph | null> {
|
|
||||||
if (!cdp.getFrameGraph) return null;
|
|
||||||
try {
|
|
||||||
return await cdp.getFrameGraph(tabId);
|
|
||||||
} catch (err) {
|
|
||||||
console.debug("[bsk observation] frame graph capture failed", err);
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function transformFrameNodes(
|
function transformFrameNodes(
|
||||||
nodes: CapturedNode[],
|
nodes: CapturedNode[],
|
||||||
projection: GeometryProjection | null,
|
projection: GeometryProjection | null,
|
||||||
@@ -51,6 +41,7 @@ async function captureMissingFrameDocuments(
|
|||||||
tabId: number,
|
tabId: number,
|
||||||
graph: CdpFrameGraph,
|
graph: CdpFrameGraph,
|
||||||
captured: CapturedViewModel,
|
captured: CapturedViewModel,
|
||||||
|
geometry: GeometryContext,
|
||||||
signal?: AbortSignal,
|
signal?: AbortSignal,
|
||||||
): Promise<void> {
|
): Promise<void> {
|
||||||
if (!captured.frameNodes) captured.frameNodes = new Map();
|
if (!captured.frameNodes) captured.frameNodes = new Map();
|
||||||
@@ -62,10 +53,15 @@ async function captureMissingFrameDocuments(
|
|||||||
try {
|
try {
|
||||||
const child = await captureViewModel(cdpRunnerForTarget(cdp, frame.target), tabId, {
|
const child = await captureViewModel(cdpRunnerForTarget(cdp, frame.target), tabId, {
|
||||||
signal,
|
signal,
|
||||||
|
geometry,
|
||||||
|
target: frame.target,
|
||||||
});
|
});
|
||||||
|
if (child.frameGeometryIssues?.length) {
|
||||||
|
(captured.frameGeometryIssues ??= []).push(...child.frameGeometryIssues);
|
||||||
|
}
|
||||||
let projection: GeometryProjection | null = null;
|
let projection: GeometryProjection | null = null;
|
||||||
try {
|
try {
|
||||||
projection = await resolveFrameProjection(cdp, graph, frame.frameId);
|
projection = await geometry.targetProjection(frame.frameId);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
if (isAbortError(err)) throw err;
|
if (isAbortError(err)) throw err;
|
||||||
console.debug("[bsk observation] child frame geometry projection failed", {
|
console.debug("[bsk observation] child frame geometry projection failed", {
|
||||||
@@ -171,10 +167,11 @@ export async function captureFrameData<T extends FrameAxNode>(
|
|||||||
tabId: number,
|
tabId: number,
|
||||||
captured: CapturedViewModel,
|
captured: CapturedViewModel,
|
||||||
signal?: AbortSignal,
|
signal?: AbortSignal,
|
||||||
|
geometry = new GeometryContext(cdp, tabId, undefined, signal),
|
||||||
): Promise<CapturedFrameDocument<T>[]> {
|
): Promise<CapturedFrameDocument<T>[]> {
|
||||||
const graph = await discoverFrameGraph(cdp, tabId);
|
const graph = await geometry.graph();
|
||||||
const frames = graph?.frames ?? [];
|
const frames = graph?.frames ?? [];
|
||||||
if (graph) await captureMissingFrameDocuments(cdp, tabId, graph, captured, signal);
|
if (graph) await captureMissingFrameDocuments(cdp, tabId, graph, captured, geometry, signal);
|
||||||
throwIfAborted(signal);
|
throwIfAborted(signal);
|
||||||
const batches = await captureAxTrees<T>(cdp, tabId, frames, captured, signal);
|
const batches = await captureAxTrees<T>(cdp, tabId, frames, captured, signal);
|
||||||
return buildFrameDocuments(graph, batches, captured);
|
return buildFrameDocuments(graph, batches, captured);
|
||||||
|
|||||||
@@ -73,6 +73,14 @@ where
|
|||||||
P: Serialize + Send + 'static,
|
P: Serialize + Send + 'static,
|
||||||
R: DeserializeOwned + Send + 'static,
|
R: DeserializeOwned + Send + 'static,
|
||||||
{
|
{
|
||||||
|
let parent_cancel = stdin_cancellation();
|
||||||
|
if parent_cancel.as_ref().is_some_and(|rx| *rx.borrow()) {
|
||||||
|
return Err(CliError::from_rpc(RpcError {
|
||||||
|
code: ErrorCode::Cancelled,
|
||||||
|
message: "parent closed the cancellation pipe".into(),
|
||||||
|
data: Some(serde_json::json!({"reason": "cancelled_before_dispatch"})),
|
||||||
|
}));
|
||||||
|
}
|
||||||
let rpc_id: RpcId = format!("{}-{}", rpc_id_prefix, random_short_id());
|
let rpc_id: RpcId = format!("{}-{}", rpc_id_prefix, random_short_id());
|
||||||
let mut client = IpcClient::connect(sock.clone()).await?;
|
let mut client = IpcClient::connect(sock.clone()).await?;
|
||||||
let rpc_id_for_call = rpc_id.clone();
|
let rpc_id_for_call = rpc_id.clone();
|
||||||
@@ -88,16 +96,16 @@ where
|
|||||||
let outcome = tokio::select! {
|
let outcome = tokio::select! {
|
||||||
biased;
|
biased;
|
||||||
res = &mut main_fut => res?,
|
res = &mut main_fut => res?,
|
||||||
sig = wait_for_sigint() => {
|
sig = wait_for_cancel(parent_cancel) => {
|
||||||
sig.context("install SIGINT handler").map_err(CliError::Local)?;
|
sig.context("wait for cancellation").map_err(CliError::Local)?;
|
||||||
debug!(rpc_id = %rpc_id_for_cancel, "SIGINT: forwarding cancel to daemon");
|
debug!(rpc_id = %rpc_id_for_cancel, "forwarding cancel to daemon");
|
||||||
let _ = send_cancel(&sock, &rpc_id_for_cancel).await;
|
let _ = send_cancel(&sock, &rpc_id_for_cancel).await;
|
||||||
match tokio::time::timeout(CANCEL_RESPONSE_GRACE, &mut main_fut).await {
|
match tokio::time::timeout(CANCEL_RESPONSE_GRACE, &mut main_fut).await {
|
||||||
Ok(res) => res?,
|
Ok(res) => res?,
|
||||||
Err(_) => {
|
Err(_) => {
|
||||||
debug!(
|
debug!(
|
||||||
rpc_id = %rpc_id_for_cancel,
|
rpc_id = %rpc_id_for_cancel,
|
||||||
"SIGINT: cancel grace elapsed; synthesising cancelled error"
|
"cancel grace elapsed; synthesising cancelled error"
|
||||||
);
|
);
|
||||||
return Err(CliError::from_rpc(RpcError {
|
return Err(CliError::from_rpc(RpcError {
|
||||||
code: ErrorCode::Cancelled,
|
code: ErrorCode::Cancelled,
|
||||||
@@ -112,6 +120,46 @@ where
|
|||||||
outcome.map_err(CliError::from_rpc)
|
outcome.map_err(CliError::from_rpc)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/// Release caller-owned staging even after cancellation. This deliberately
|
||||||
|
/// exposes only transfer.release, not a general bypass for business RPCs.
|
||||||
|
/// The entire batch, including connection setup, shares one bounded budget.
|
||||||
|
pub fn release_transfers<'a>(
|
||||||
|
sock: &Path,
|
||||||
|
transfer_ids: impl IntoIterator<Item = &'a str>,
|
||||||
|
) -> Result<(), CliError> {
|
||||||
|
use bsk_protocol::tools::{TransferIdParams, TransferReleaseResult};
|
||||||
|
const CLEANUP_TIMEOUT: Duration = Duration::from_secs(5);
|
||||||
|
let ids: Vec<_> = transfer_ids.into_iter().collect();
|
||||||
|
if ids.is_empty() {
|
||||||
|
return Ok(());
|
||||||
|
}
|
||||||
|
let rt = tokio::runtime::Builder::new_current_thread()
|
||||||
|
.enable_all()
|
||||||
|
.build()
|
||||||
|
.context("build runtime for transfer cleanup")?;
|
||||||
|
rt.block_on(async {
|
||||||
|
tokio::time::timeout(CLEANUP_TIMEOUT, async {
|
||||||
|
let mut client = IpcClient::connect(sock).await?;
|
||||||
|
for id in ids {
|
||||||
|
client
|
||||||
|
.call::<_, TransferReleaseResult>(
|
||||||
|
"transfer-release",
|
||||||
|
Method::TransferRelease,
|
||||||
|
Some(TransferIdParams {
|
||||||
|
transfer_id: id.to_string(),
|
||||||
|
}),
|
||||||
|
CLEANUP_TIMEOUT,
|
||||||
|
)
|
||||||
|
.await?
|
||||||
|
.map_err(CliError::from_rpc)?;
|
||||||
|
}
|
||||||
|
Ok::<_, CliError>(())
|
||||||
|
})
|
||||||
|
.await
|
||||||
|
.context("transfer cleanup exceeded its total time budget")?
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
/// Send a `cancel { rpc_id }` frame over a fresh connection so it
|
/// Send a `cancel { rpc_id }` frame over a fresh connection so it
|
||||||
/// lands on the daemon while the original call is still parked.
|
/// lands on the daemon while the original call is still parked.
|
||||||
///
|
///
|
||||||
@@ -146,8 +194,57 @@ fn random_short_id() -> String {
|
|||||||
bytes.iter().map(|b| format!("{b:02x}")).collect()
|
bytes.iter().map(|b| format!("{b:02x}")).collect()
|
||||||
}
|
}
|
||||||
|
|
||||||
/// Wait for either Ctrl-C or process SIGTERM. Returning here means
|
/// Opt-in control pipe for parent processes that cannot send Ctrl-C (Node on
|
||||||
/// the user has asked us to stop.
|
/// Windows). One reader survives the short-lived runtimes used by multi-RPC
|
||||||
|
/// commands such as upload. Ordinary CLI stdin and terminal Ctrl-C are unchanged.
|
||||||
|
fn stdin_cancellation() -> Option<tokio::sync::watch::Receiver<bool>> {
|
||||||
|
if std::env::var("BSK_CANCEL_ON_STDIN_CLOSE").as_deref() != Ok("1") {
|
||||||
|
return None;
|
||||||
|
}
|
||||||
|
static CANCEL: std::sync::OnceLock<tokio::sync::watch::Receiver<bool>> =
|
||||||
|
std::sync::OnceLock::new();
|
||||||
|
Some(
|
||||||
|
CANCEL
|
||||||
|
.get_or_init(|| {
|
||||||
|
let (tx, rx) = tokio::sync::watch::channel(false);
|
||||||
|
std::thread::spawn(move || {
|
||||||
|
use std::io::Read;
|
||||||
|
let mut stdin = std::io::stdin().lock();
|
||||||
|
let mut buf = [0; 64];
|
||||||
|
loop {
|
||||||
|
match stdin.read(&mut buf) {
|
||||||
|
Ok(0) => break,
|
||||||
|
Ok(_) => {}
|
||||||
|
Err(err) if err.kind() == std::io::ErrorKind::Interrupted => continue,
|
||||||
|
Err(_) => break,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
let _ = tx.send(true);
|
||||||
|
});
|
||||||
|
rx
|
||||||
|
})
|
||||||
|
.clone(),
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
async fn wait_for_cancel(
|
||||||
|
parent_cancel: Option<tokio::sync::watch::Receiver<bool>>,
|
||||||
|
) -> anyhow::Result<()> {
|
||||||
|
let parent_closed = async move {
|
||||||
|
match parent_cancel {
|
||||||
|
Some(mut rx) => {
|
||||||
|
let _ = rx.wait_for(|closed| *closed).await;
|
||||||
|
}
|
||||||
|
None => std::future::pending::<()>().await,
|
||||||
|
}
|
||||||
|
};
|
||||||
|
tokio::select! {
|
||||||
|
result = wait_for_sigint() => result,
|
||||||
|
_ = parent_closed => Ok(()),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/// Wait for terminal Ctrl-C.
|
||||||
async fn wait_for_sigint() -> anyhow::Result<()> {
|
async fn wait_for_sigint() -> anyhow::Result<()> {
|
||||||
tokio::signal::ctrl_c().await.context("listen for SIGINT")?;
|
tokio::signal::ctrl_c().await.context("listen for SIGINT")?;
|
||||||
Ok(())
|
Ok(())
|
||||||
|
|||||||
@@ -9,8 +9,7 @@ use anyhow::Context;
|
|||||||
use base64::Engine;
|
use base64::Engine;
|
||||||
use bsk_protocol::Method;
|
use bsk_protocol::Method;
|
||||||
use bsk_protocol::tools::{
|
use bsk_protocol::tools::{
|
||||||
DownloadParams, DownloadResult, TransferChunkParams, TransferChunkResult, TransferIdParams,
|
DownloadParams, DownloadResult, TransferChunkParams, TransferChunkResult,
|
||||||
TransferReleaseResult,
|
|
||||||
};
|
};
|
||||||
use clap::Args;
|
use clap::Args;
|
||||||
use uuid::Uuid;
|
use uuid::Uuid;
|
||||||
@@ -70,13 +69,7 @@ pub fn dispatch(args: DownloadArgs, format: Format) -> Result<(), CliError> {
|
|||||||
CliError::Local(anyhow::anyhow!("daemon returned no download transfer id"))
|
CliError::Local(anyhow::anyhow!("daemon returned no download transfer id"))
|
||||||
})?;
|
})?;
|
||||||
let write_result = write_transfer(&info.sock_path, &transfer_id, &args.out, args.overwrite);
|
let write_result = write_transfer(&info.sock_path, &transfer_id, &args.out, args.overwrite);
|
||||||
let _: Result<TransferReleaseResult, CliError> = crate::cli::business_rpc::call(
|
let _ = crate::cli::business_rpc::release_transfers(&info.sock_path, [transfer_id.as_str()]);
|
||||||
info.sock_path,
|
|
||||||
"transfer-release",
|
|
||||||
Method::TransferRelease,
|
|
||||||
Some(TransferIdParams { transfer_id }),
|
|
||||||
Duration::from_secs(5),
|
|
||||||
);
|
|
||||||
write_result?;
|
write_result?;
|
||||||
match format {
|
match format {
|
||||||
Format::Json => {
|
Format::Json => {
|
||||||
|
|||||||
@@ -10,8 +10,7 @@ use base64::Engine;
|
|||||||
use bsk_protocol::Method;
|
use bsk_protocol::Method;
|
||||||
use bsk_protocol::tools::{
|
use bsk_protocol::tools::{
|
||||||
TransferBeginParams, TransferBeginResult, TransferChunkParams, TransferChunkResult,
|
TransferBeginParams, TransferBeginResult, TransferChunkParams, TransferChunkResult,
|
||||||
TransferIdParams, TransferReadyResult, TransferReleaseResult, UploadFile, UploadMode,
|
TransferIdParams, TransferReadyResult, UploadFile, UploadMode, UploadParams, UploadResult,
|
||||||
UploadParams, UploadResult,
|
|
||||||
};
|
};
|
||||||
use clap::{Args, ValueEnum};
|
use clap::{Args, ValueEnum};
|
||||||
|
|
||||||
@@ -69,16 +68,14 @@ pub fn dispatch(args: UploadArgs, format: Format) -> Result<(), CliError> {
|
|||||||
let (ref_, selector) = split_target(args.target, args.ref_, args.selector)?;
|
let (ref_, selector) = split_target(args.target, args.ref_, args.selector)?;
|
||||||
let mut staged = Vec::new();
|
let mut staged = Vec::new();
|
||||||
for path in &args.files {
|
for path in &args.files {
|
||||||
match stage_file(&info.sock_path, &args.session, path) {
|
if let Err(err) = stage_file(&info.sock_path, &args.session, path, &mut staged) {
|
||||||
Ok(file) => staged.push(file),
|
let _ = crate::cli::business_rpc::release_transfers(
|
||||||
Err(err) => {
|
&info.sock_path,
|
||||||
for (id, _) in &staged {
|
staged.iter().map(|(id, _)| id.as_str()),
|
||||||
let _ = release(&info.sock_path, id);
|
);
|
||||||
}
|
|
||||||
return Err(err);
|
return Err(err);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
let params = UploadParams {
|
let params = UploadParams {
|
||||||
session_id: args.session,
|
session_id: args.session,
|
||||||
ref_,
|
ref_,
|
||||||
@@ -102,6 +99,17 @@ pub fn dispatch(args: UploadArgs, format: Format) -> Result<(), CliError> {
|
|||||||
Some(params),
|
Some(params),
|
||||||
ipc_timeout(args.timeout),
|
ipc_timeout(args.timeout),
|
||||||
);
|
);
|
||||||
|
// The helper can reject cancellation before handing any request to the
|
||||||
|
// daemon. In that case staging still belongs to this CLI.
|
||||||
|
if result.as_ref().is_err_and(|err| {
|
||||||
|
err.data()
|
||||||
|
.is_some_and(|data| data["reason"] == "cancelled_before_dispatch")
|
||||||
|
}) {
|
||||||
|
let _ = crate::cli::business_rpc::release_transfers(
|
||||||
|
&info.sock_path,
|
||||||
|
staged.iter().map(|(id, _)| id.as_str()),
|
||||||
|
);
|
||||||
|
}
|
||||||
// Once tool.upload is dispatched, staging ownership belongs to the
|
// Once tool.upload is dispatched, staging ownership belongs to the
|
||||||
// session. A transport timeout cannot prove that Chrome did not attach
|
// session. A transport timeout cannot prove that Chrome did not attach
|
||||||
// the file, so releasing here could invalidate a late successful attach.
|
// the file, so releasing here could invalidate a late successful attach.
|
||||||
@@ -118,7 +126,12 @@ pub fn dispatch(args: UploadArgs, format: Format) -> Result<(), CliError> {
|
|||||||
Ok(())
|
Ok(())
|
||||||
}
|
}
|
||||||
|
|
||||||
fn stage_file(sock: &Path, session: &str, path: &PathBuf) -> Result<(String, String), CliError> {
|
fn stage_file(
|
||||||
|
sock: &Path,
|
||||||
|
session: &str,
|
||||||
|
path: &PathBuf,
|
||||||
|
staged: &mut Vec<(String, String)>,
|
||||||
|
) -> Result<(), CliError> {
|
||||||
let mut file = File::open(path)
|
let mut file = File::open(path)
|
||||||
.with_context(|| format!("open upload file {}", path.display()))
|
.with_context(|| format!("open upload file {}", path.display()))
|
||||||
.map_err(CliError::Local)?;
|
.map_err(CliError::Local)?;
|
||||||
@@ -149,7 +162,9 @@ fn stage_file(sock: &Path, session: &str, path: &PathBuf) -> Result<(String, Str
|
|||||||
}),
|
}),
|
||||||
Duration::from_secs(10),
|
Duration::from_secs(10),
|
||||||
)?;
|
)?;
|
||||||
let staged = (|| {
|
// Record ownership immediately so one error path releases both completed
|
||||||
|
// files and the current partially staged file.
|
||||||
|
staged.push((begin.transfer_id.clone(), name));
|
||||||
let mut offset = 0u64;
|
let mut offset = 0u64;
|
||||||
let mut buf = vec![0u8; begin.chunk_size as usize];
|
let mut buf = vec![0u8; begin.chunk_size as usize];
|
||||||
loop {
|
loop {
|
||||||
@@ -179,25 +194,7 @@ fn stage_file(sock: &Path, session: &str, path: &PathBuf) -> Result<(String, Str
|
|||||||
}),
|
}),
|
||||||
Duration::from_secs(10),
|
Duration::from_secs(10),
|
||||||
)?;
|
)?;
|
||||||
Ok::<_, CliError>(())
|
Ok(())
|
||||||
})();
|
|
||||||
if let Err(err) = staged {
|
|
||||||
let _ = release(sock, &begin.transfer_id);
|
|
||||||
return Err(err);
|
|
||||||
}
|
|
||||||
Ok((begin.transfer_id, name))
|
|
||||||
}
|
|
||||||
|
|
||||||
fn release(sock: &Path, id: &str) -> Result<TransferReleaseResult, CliError> {
|
|
||||||
crate::cli::business_rpc::call(
|
|
||||||
sock.to_path_buf(),
|
|
||||||
"transfer-release",
|
|
||||||
Method::TransferRelease,
|
|
||||||
Some(TransferIdParams {
|
|
||||||
transfer_id: id.to_string(),
|
|
||||||
}),
|
|
||||||
Duration::from_secs(5),
|
|
||||||
)
|
|
||||||
}
|
}
|
||||||
|
|
||||||
fn ipc_timeout(timeout_ms: u32) -> Duration {
|
fn ipc_timeout(timeout_ms: u32) -> Duration {
|
||||||
|
|||||||
@@ -0,0 +1,342 @@
|
|||||||
|
//! Real Windows CLI cancellation, including caller-owned transfer cleanup.
|
||||||
|
#![cfg(windows)]
|
||||||
|
|
||||||
|
use std::path::Path;
|
||||||
|
use std::sync::{Arc, Mutex};
|
||||||
|
use std::time::{Duration, Instant};
|
||||||
|
|
||||||
|
use bsk::daemon::{file_transfer::TransferRegistry, info::DaemonInfo};
|
||||||
|
use bsk_protocol::tools::{TransferBeginParams, TransferIdParams};
|
||||||
|
use bsk_protocol::{ErrorCode, Frame, Method, ResponseBody, ResponseFrame, RpcError};
|
||||||
|
use serde_json::json;
|
||||||
|
use tokio::io::{AsyncBufReadExt, AsyncWriteExt, BufReader};
|
||||||
|
use tokio::net::windows::named_pipe::ServerOptions;
|
||||||
|
use tokio::process::Command;
|
||||||
|
use tokio::sync::{Notify, watch};
|
||||||
|
|
||||||
|
fn response<T: serde::Serialize>(result: Result<T, RpcError>) -> ResponseBody {
|
||||||
|
match result {
|
||||||
|
Ok(value) => ResponseBody::Ok(serde_json::to_value(value).unwrap()),
|
||||||
|
Err(err) => ResponseBody::Err(err),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#[test]
|
||||||
|
fn stdin_close_cancels_business_but_releases_resources_with_a_bounded_budget() {
|
||||||
|
// Resolve the production registry's root before starting any runtime threads.
|
||||||
|
let registry_home = tempfile::tempdir().unwrap();
|
||||||
|
let original_home = std::env::var_os("BSK_HOME");
|
||||||
|
unsafe {
|
||||||
|
std::env::set_var("BSK_HOME", registry_home.path());
|
||||||
|
}
|
||||||
|
let transfers = Arc::new(TransferRegistry::new().unwrap());
|
||||||
|
unsafe {
|
||||||
|
match original_home {
|
||||||
|
Some(value) => std::env::set_var("BSK_HOME", value),
|
||||||
|
None => std::env::remove_var("BSK_HOME"),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
transfers.initialize().unwrap();
|
||||||
|
tokio::runtime::Builder::new_current_thread()
|
||||||
|
.enable_all()
|
||||||
|
.build()
|
||||||
|
.unwrap()
|
||||||
|
.block_on(exercise(
|
||||||
|
transfers,
|
||||||
|
®istry_home.path().join("run/transfers"),
|
||||||
|
));
|
||||||
|
}
|
||||||
|
|
||||||
|
async fn exercise(transfers: Arc<TransferRegistry>, staging_root: &Path) {
|
||||||
|
for mode in [
|
||||||
|
"wait",
|
||||||
|
"upload",
|
||||||
|
"upload-multi",
|
||||||
|
"upload-before-dispatch",
|
||||||
|
"download",
|
||||||
|
"upload-multi-stall",
|
||||||
|
"ordinary",
|
||||||
|
] {
|
||||||
|
let home = tempfile::tempdir().unwrap();
|
||||||
|
let pipe_name = format!(r"\\.\pipe\bsk-parent-cancel-{}", uuid::Uuid::new_v4());
|
||||||
|
let info = DaemonInfo::now(std::process::id(), (&pipe_name).into(), 0, "0.2.0");
|
||||||
|
std::fs::write(
|
||||||
|
home.path().join("daemon.json"),
|
||||||
|
serde_json::to_vec(&info).unwrap(),
|
||||||
|
)
|
||||||
|
.unwrap();
|
||||||
|
let mut pipe = ServerOptions::new()
|
||||||
|
.first_pipe_instance(true)
|
||||||
|
.create(&pipe_name)
|
||||||
|
.unwrap();
|
||||||
|
let registered = Arc::new(Notify::new());
|
||||||
|
let pending = Arc::new(Mutex::new(None::<String>));
|
||||||
|
let ids = Arc::new(Mutex::new(Vec::<String>::new()));
|
||||||
|
let released = Arc::new(Mutex::new(Vec::<String>::new()));
|
||||||
|
let received = Arc::new(Mutex::new(Vec::<Method>::new()));
|
||||||
|
let download_id = if mode == "download" {
|
||||||
|
let staging = transfers.begin_download("fixture").unwrap();
|
||||||
|
let browser_dir = home.path().join("BrowserSkill").join(&staging.transfer_id);
|
||||||
|
std::fs::create_dir_all(&browser_dir).unwrap();
|
||||||
|
let file = browser_dir.join("download.txt");
|
||||||
|
std::fs::write(&file, b"download fixture").unwrap();
|
||||||
|
transfers
|
||||||
|
.import_download(&staging.transfer_id, &file)
|
||||||
|
.unwrap();
|
||||||
|
ids.lock().unwrap().push(staging.transfer_id.clone());
|
||||||
|
Some(staging.transfer_id)
|
||||||
|
} else {
|
||||||
|
None
|
||||||
|
};
|
||||||
|
let (cancel, cancelled) = watch::channel(false);
|
||||||
|
let ready = Arc::clone(®istered);
|
||||||
|
let name = pipe_name.clone();
|
||||||
|
let registry = Arc::clone(&transfers);
|
||||||
|
let server_ids = Arc::clone(&ids);
|
||||||
|
let server_released = Arc::clone(&released);
|
||||||
|
let server_received = Arc::clone(&received);
|
||||||
|
let server = tokio::spawn(async move {
|
||||||
|
let mut connections = tokio::task::JoinSet::new();
|
||||||
|
loop {
|
||||||
|
pipe.connect().await.unwrap();
|
||||||
|
let next = ServerOptions::new().create(&name).unwrap();
|
||||||
|
let connection = std::mem::replace(&mut pipe, next);
|
||||||
|
let ready = Arc::clone(&ready);
|
||||||
|
let pending = Arc::clone(&pending);
|
||||||
|
let cancel = cancel.clone();
|
||||||
|
let mut cancelled = cancelled.clone();
|
||||||
|
let name = name.clone();
|
||||||
|
let registry = Arc::clone(®istry);
|
||||||
|
let ids = Arc::clone(&server_ids);
|
||||||
|
let released = Arc::clone(&server_released);
|
||||||
|
let received = Arc::clone(&server_received);
|
||||||
|
let download_id = download_id.clone();
|
||||||
|
connections.spawn(async move {
|
||||||
|
let (read, mut write) = tokio::io::split(connection);
|
||||||
|
let mut reader = BufReader::new(read);
|
||||||
|
let mut line = String::new();
|
||||||
|
while reader.read_line(&mut line).await.unwrap_or(0) > 0 {
|
||||||
|
let Frame::Request(req) = serde_json::from_str::<Frame>(&line).unwrap()
|
||||||
|
else {
|
||||||
|
panic!("expected request");
|
||||||
|
};
|
||||||
|
line.clear();
|
||||||
|
received.lock().unwrap().push(req.method.clone());
|
||||||
|
let params = req.params.clone().unwrap_or_default();
|
||||||
|
let body = match req.method {
|
||||||
|
Method::SystemStatus => ResponseBody::Ok(json!({
|
||||||
|
"daemon_version": "0.2.0", "protocol_version": "1.1",
|
||||||
|
"pid": std::process::id(), "uptime_secs": 0,
|
||||||
|
"ws_port": 0, "sock_path": name,
|
||||||
|
"browsers": [], "sessions": [], "version_skew_browsers": []
|
||||||
|
})),
|
||||||
|
Method::TransferBegin => {
|
||||||
|
let begin = registry
|
||||||
|
.begin_upload(serde_json::from_value(params).unwrap())
|
||||||
|
.unwrap();
|
||||||
|
ids.lock().unwrap().push(begin.transfer_id.clone());
|
||||||
|
response(Ok(begin))
|
||||||
|
}
|
||||||
|
Method::ToolDownload => ResponseBody::Ok(json!({
|
||||||
|
"tab_id": 1, "suggested_filename": "download.txt",
|
||||||
|
"byte_size": 16, "transfer_id": download_id,
|
||||||
|
})),
|
||||||
|
Method::ToolWaitMs if mode == "ordinary" => {
|
||||||
|
ResponseBody::Ok(json!({"waited_ms": 1}))
|
||||||
|
}
|
||||||
|
Method::TransferChunk
|
||||||
|
if mode == "upload-before-dispatch"
|
||||||
|
|| (mode.contains("multi")
|
||||||
|
&& ids.lock().unwrap().len() == 1) =>
|
||||||
|
{
|
||||||
|
response(
|
||||||
|
registry.write_chunk(serde_json::from_value(params).unwrap()),
|
||||||
|
)
|
||||||
|
}
|
||||||
|
Method::TransferFinish if mode != "upload-before-dispatch" => response(
|
||||||
|
registry.finish_upload(serde_json::from_value(params).unwrap()),
|
||||||
|
),
|
||||||
|
Method::ToolWaitMs
|
||||||
|
| Method::TransferChunk
|
||||||
|
| Method::TransferRead
|
||||||
|
| Method::TransferFinish => {
|
||||||
|
*pending.lock().unwrap() = Some(req.id.clone());
|
||||||
|
ready.notify_one();
|
||||||
|
cancelled.wait_for(|value| *value).await.unwrap();
|
||||||
|
if mode == "upload-before-dispatch" {
|
||||||
|
// Finish won the race with cancellation, but tool.upload must
|
||||||
|
// not be dispatched and the CLI still owns the staging.
|
||||||
|
response(
|
||||||
|
registry
|
||||||
|
.finish_upload(serde_json::from_value(params).unwrap()),
|
||||||
|
)
|
||||||
|
} else {
|
||||||
|
ResponseBody::Err(RpcError {
|
||||||
|
code: ErrorCode::Cancelled,
|
||||||
|
message: "parent cancellation reached daemon".into(),
|
||||||
|
data: None,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Method::Cancel => {
|
||||||
|
let target = params["rpc_id"].as_str().unwrap();
|
||||||
|
assert_eq!(pending.lock().unwrap().as_deref(), Some(target));
|
||||||
|
cancel.send(true).unwrap();
|
||||||
|
ResponseBody::Ok(json!({"cancelled": true}))
|
||||||
|
}
|
||||||
|
Method::TransferRelease => {
|
||||||
|
let params: TransferIdParams =
|
||||||
|
serde_json::from_value(params).unwrap();
|
||||||
|
released.lock().unwrap().push(params.transfer_id.clone());
|
||||||
|
if mode.contains("stall") {
|
||||||
|
std::future::pending::<()>().await;
|
||||||
|
}
|
||||||
|
response(Ok(registry.release(params)))
|
||||||
|
}
|
||||||
|
other => panic!("unexpected request after cancellation: {other:?}"),
|
||||||
|
};
|
||||||
|
let response = Frame::Response(ResponseFrame { id: req.id, body });
|
||||||
|
let mut bytes = serde_json::to_vec(&response).unwrap();
|
||||||
|
bytes.push(b'\n');
|
||||||
|
if write.write_all(&bytes).await.is_err() {
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
let mut cmd = Command::new(env!("CARGO_BIN_EXE_bsk"));
|
||||||
|
cmd.env("BSK_HOME", home.path())
|
||||||
|
.env("BSK_AUTO_UPDATE", "off")
|
||||||
|
.env_remove("BSK_CANCEL_ON_STDIN_CLOSE")
|
||||||
|
.stdout(std::process::Stdio::piped())
|
||||||
|
.stderr(std::process::Stdio::piped())
|
||||||
|
.creation_flags(0x0800_0000)
|
||||||
|
.kill_on_drop(true);
|
||||||
|
if mode.starts_with("upload") {
|
||||||
|
let source = home.path().join("upload.txt");
|
||||||
|
// Declare 300 MiB without allocating or transferring that much data.
|
||||||
|
std::fs::File::create(&source)
|
||||||
|
.unwrap()
|
||||||
|
.set_len(if mode == "upload-before-dispatch" {
|
||||||
|
16
|
||||||
|
} else {
|
||||||
|
300 * 1024 * 1024
|
||||||
|
})
|
||||||
|
.unwrap();
|
||||||
|
cmd.args(["upload", "--session", "fixture", "--selector", "input"]);
|
||||||
|
if mode.contains("multi") {
|
||||||
|
let first = home.path().join("first.txt");
|
||||||
|
std::fs::write(&first, b"first file").unwrap();
|
||||||
|
cmd.arg("--file").arg(first);
|
||||||
|
}
|
||||||
|
cmd.arg("--file").arg(source);
|
||||||
|
} else if mode == "download" {
|
||||||
|
let out = home.path().join("out.txt");
|
||||||
|
std::fs::write(&out, b"existing output").unwrap();
|
||||||
|
cmd.args([
|
||||||
|
"download",
|
||||||
|
"--session",
|
||||||
|
"fixture",
|
||||||
|
"--selector",
|
||||||
|
"a",
|
||||||
|
"--overwrite",
|
||||||
|
"--out",
|
||||||
|
])
|
||||||
|
.arg(out);
|
||||||
|
} else {
|
||||||
|
cmd.args(["wait-ms", if mode == "ordinary" { "1ms" } else { "60s" }]);
|
||||||
|
}
|
||||||
|
cmd.arg("--json");
|
||||||
|
if mode == "ordinary" {
|
||||||
|
cmd.stdin(std::process::Stdio::null());
|
||||||
|
} else {
|
||||||
|
cmd.env("BSK_CANCEL_ON_STDIN_CLOSE", "1")
|
||||||
|
.stdin(std::process::Stdio::piped());
|
||||||
|
}
|
||||||
|
let mut child = cmd.spawn().unwrap();
|
||||||
|
if mode != "ordinary" {
|
||||||
|
tokio::time::timeout(Duration::from_secs(10), registered.notified())
|
||||||
|
.await
|
||||||
|
.expect("CLI registered business RPC");
|
||||||
|
child
|
||||||
|
.stdin
|
||||||
|
.as_mut()
|
||||||
|
.unwrap()
|
||||||
|
.write_all(b"still connected")
|
||||||
|
.await
|
||||||
|
.unwrap();
|
||||||
|
drop(child.stdin.take());
|
||||||
|
}
|
||||||
|
let start = Instant::now();
|
||||||
|
let output = tokio::time::timeout(Duration::from_secs(8), child.wait_with_output())
|
||||||
|
.await
|
||||||
|
.expect("CLI must settle promptly, including cleanup")
|
||||||
|
.unwrap();
|
||||||
|
server.abort();
|
||||||
|
let _ = server.await;
|
||||||
|
assert_eq!(
|
||||||
|
output.status.code(),
|
||||||
|
Some(if mode == "ordinary" { 0 } else { 2 }),
|
||||||
|
"{mode}: stdout={} stderr={}",
|
||||||
|
String::from_utf8_lossy(&output.stdout),
|
||||||
|
String::from_utf8_lossy(&output.stderr)
|
||||||
|
);
|
||||||
|
if mode != "ordinary" {
|
||||||
|
let body: serde_json::Value = serde_json::from_slice(&output.stdout).unwrap();
|
||||||
|
assert_eq!(body["code"], "cancelled");
|
||||||
|
if mode != "upload-before-dispatch" {
|
||||||
|
assert_eq!(body["message"], "parent cancellation reached daemon");
|
||||||
|
}
|
||||||
|
let received = received.lock().unwrap();
|
||||||
|
let cancel = received.iter().position(|m| *m == Method::Cancel).unwrap();
|
||||||
|
assert!(
|
||||||
|
received[cancel + 1..]
|
||||||
|
.iter()
|
||||||
|
.all(|m| *m == Method::TransferRelease),
|
||||||
|
"only cleanup may follow cancellation: {received:?}"
|
||||||
|
);
|
||||||
|
}
|
||||||
|
let ids = ids.lock().unwrap();
|
||||||
|
if mode.contains("stall") {
|
||||||
|
assert_eq!(released.lock().unwrap().len(), 1);
|
||||||
|
assert!(start.elapsed() >= Duration::from_secs(4));
|
||||||
|
// The CLI cannot force an unresponsive daemon to clean up.
|
||||||
|
transfers.release_session("fixture");
|
||||||
|
} else {
|
||||||
|
assert_eq!(
|
||||||
|
*released.lock().unwrap(),
|
||||||
|
*ids,
|
||||||
|
"{mode}: every allocation must be released"
|
||||||
|
);
|
||||||
|
for id in ids.iter() {
|
||||||
|
assert!(!staging_root.join(id).exists(), "staging leaked: {id}");
|
||||||
|
}
|
||||||
|
if mode.starts_with("upload") {
|
||||||
|
let retry = transfers
|
||||||
|
.begin_upload(TransferBeginParams {
|
||||||
|
session_id: "fixture".into(),
|
||||||
|
name: "retry.txt".into(),
|
||||||
|
byte_size: 300 * 1024 * 1024,
|
||||||
|
})
|
||||||
|
.expect("same session must have room for another 300 MiB upload");
|
||||||
|
transfers.release(TransferIdParams {
|
||||||
|
transfer_id: retry.transfer_id,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if mode == "download" {
|
||||||
|
assert_eq!(
|
||||||
|
std::fs::read(home.path().join("out.txt")).unwrap(),
|
||||||
|
b"existing output"
|
||||||
|
);
|
||||||
|
assert!(
|
||||||
|
!std::fs::read_dir(home.path())
|
||||||
|
.unwrap()
|
||||||
|
.flatten()
|
||||||
|
.any(|entry| entry.file_name().to_string_lossy().ends_with(".part"))
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,44 @@
|
|||||||
|
# DOMSnapshot layout-unit regression (#195)
|
||||||
|
|
||||||
|
Source: https://github.com/Tencent/BrowserSkill/pull/195
|
||||||
|
|
||||||
|
DOMSnapshot bounds and document scroll offsets retain Blink layout units. Treating them as CSS
|
||||||
|
pixels changes both positions and sizes under device scaling/browser zoom, before iframe
|
||||||
|
projection or viewport clipping even starts.
|
||||||
|
|
||||||
|
The fixture contains a scrolled root, a scrolled same-process iframe, an OOPIF served from the
|
||||||
|
other loopback hostname, and a nested iframe in each. Owners have borders, padding and CSS
|
||||||
|
transforms. The geometry test compares the production capture's local and top-level rectangles
|
||||||
|
against independent DOM border boxes, with at most 2 CSS pixels of layout rounding. It also
|
||||||
|
checks that each target reads layout metrics only once. No credentials or personal tabs are used.
|
||||||
|
|
||||||
|
Run the geometric assertions with Node 22+ and a local Chrome executable:
|
||||||
|
|
||||||
|
```sh
|
||||||
|
BSK_GEOMETRY_CHROME=/path/to/chrome pnpm --filter @browser-skill/extension exec vitest run \
|
||||||
|
src/tools/__tests__/snapshot-coordinates.browser.test.ts
|
||||||
|
```
|
||||||
|
|
||||||
|
The test launches and cleans up its own headless Chrome profiles. It explicitly verifies the
|
||||||
|
requested browser zoom and OOPIF topology, so unsupported setups fail rather than silently
|
||||||
|
testing a different configuration. It is skipped in ordinary unit runs unless the executable
|
||||||
|
is specified. No browser download or new package dependency is required.
|
||||||
|
|
||||||
|
The corpus smoke case checks fixture readiness and observable semantics through the real CLI:
|
||||||
|
|
||||||
|
```sh
|
||||||
|
BSK_AUTO_UPDATE=off pnpm eval:browser smoke --case snapshot-coordinates --bsk ./target/debug/bsk
|
||||||
|
```
|
||||||
|
|
||||||
|
Smoke alone does **not** certify coordinate accuracy; CLI observations do not expose raw boxes.
|
||||||
|
Use the geometric test above for the regression's numeric assertions.
|
||||||
|
|
||||||
|
## Separate existing boundary
|
||||||
|
|
||||||
|
The OOPIF root uses non-occupying scrollbars in the unit-conversion regression. Root and
|
||||||
|
same-process frames retain normal scrollbars. Append `&classic-scrollbars` to the fixture URL
|
||||||
|
to reproduce the separate existing OOPIF projection issue: `targetProjection()` maps the CSS
|
||||||
|
layout viewport (which excludes occupying scrollbars) onto the entire owner content quad.
|
||||||
|
This inflates the projected coordinates when scrollbars occupy space. Main already has that
|
||||||
|
mapping; fixing it also changes shared live geometry and is outside this snapshot-unit fix.
|
||||||
|
The test does not relax its numeric tolerance to absorb that error.
|
||||||
@@ -0,0 +1,99 @@
|
|||||||
|
import { spawn } from "node:child_process";
|
||||||
|
import { once } from "node:events";
|
||||||
|
import { mkdir, mkdtemp, rm, writeFile } from "node:fs/promises";
|
||||||
|
import { tmpdir } from "node:os";
|
||||||
|
import { join } from "node:path";
|
||||||
|
|
||||||
|
// This regression owns its browser/profile. It never attaches to a user's Chrome.
|
||||||
|
export async function withChrome({ executable, deviceScale, zoom }, run) {
|
||||||
|
const profile = await mkdtemp(join(tmpdir(), "bsk-snapshot-coordinates-"));
|
||||||
|
let chrome;
|
||||||
|
let socket;
|
||||||
|
const pending = new Map();
|
||||||
|
try {
|
||||||
|
await mkdir(join(profile, "Default"));
|
||||||
|
await writeFile(
|
||||||
|
join(profile, "Default", "Preferences"),
|
||||||
|
JSON.stringify({
|
||||||
|
partition: { default_zoom_level: { x: Math.log(zoom) / Math.log(1.2) } },
|
||||||
|
}),
|
||||||
|
);
|
||||||
|
chrome = spawn(
|
||||||
|
executable,
|
||||||
|
[
|
||||||
|
"--headless=new",
|
||||||
|
"--no-first-run",
|
||||||
|
"--no-default-browser-check",
|
||||||
|
"--disable-extensions",
|
||||||
|
"--site-per-process",
|
||||||
|
"--remote-debugging-port=0",
|
||||||
|
"--window-size=1600,1200",
|
||||||
|
`--force-device-scale-factor=${deviceScale}`,
|
||||||
|
`--user-data-dir=${profile}`,
|
||||||
|
"about:blank",
|
||||||
|
],
|
||||||
|
{ stdio: ["ignore", "ignore", "pipe"] },
|
||||||
|
);
|
||||||
|
const endpoint = await new Promise((resolve, reject) => {
|
||||||
|
let output = "";
|
||||||
|
const timeout = setTimeout(
|
||||||
|
() => reject(new Error(`Chrome startup timed out: ${output}`)),
|
||||||
|
15_000,
|
||||||
|
);
|
||||||
|
const fail = (error) => {
|
||||||
|
clearTimeout(timeout);
|
||||||
|
reject(error);
|
||||||
|
};
|
||||||
|
chrome.once("error", fail);
|
||||||
|
chrome.once("exit", (code) => fail(new Error(`Chrome exited (${code}): ${output}`)));
|
||||||
|
chrome.stderr.on("data", (chunk) => {
|
||||||
|
output += chunk;
|
||||||
|
const match = output.match(/DevTools listening on (ws:\/\/\S+)/);
|
||||||
|
if (match) {
|
||||||
|
clearTimeout(timeout);
|
||||||
|
resolve(match[1]);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
socket = new WebSocket(endpoint);
|
||||||
|
await new Promise((resolve, reject) => {
|
||||||
|
socket.addEventListener("open", resolve, { once: true });
|
||||||
|
socket.addEventListener("error", reject, { once: true });
|
||||||
|
});
|
||||||
|
socket.addEventListener("message", ({ data }) => {
|
||||||
|
const reply = JSON.parse(data);
|
||||||
|
const request = pending.get(reply.id);
|
||||||
|
if (!request) return;
|
||||||
|
clearTimeout(request.timeout);
|
||||||
|
pending.delete(reply.id);
|
||||||
|
if (reply.error) request.reject(new Error(JSON.stringify(reply.error)));
|
||||||
|
else request.resolve(reply.result);
|
||||||
|
});
|
||||||
|
let sequence = 0;
|
||||||
|
const send = (method, params = {}, sessionId) =>
|
||||||
|
new Promise((resolve, reject) => {
|
||||||
|
const id = ++sequence;
|
||||||
|
const timeout = setTimeout(() => {
|
||||||
|
pending.delete(id);
|
||||||
|
reject(new Error(`CDP timed out: ${method}`));
|
||||||
|
}, 10_000);
|
||||||
|
pending.set(id, { resolve, reject, timeout });
|
||||||
|
socket.send(JSON.stringify({ id, method, params, sessionId }));
|
||||||
|
});
|
||||||
|
await run(send);
|
||||||
|
} finally {
|
||||||
|
for (const request of pending.values()) {
|
||||||
|
clearTimeout(request.timeout);
|
||||||
|
request.reject(new Error("regression browser closed"));
|
||||||
|
}
|
||||||
|
socket?.close();
|
||||||
|
if (chrome && chrome.exitCode === null && chrome.signalCode === null) {
|
||||||
|
const exited = once(chrome, "exit");
|
||||||
|
const timeout = setTimeout(() => chrome.kill("SIGKILL"), 5_000);
|
||||||
|
chrome.kill();
|
||||||
|
await exited;
|
||||||
|
clearTimeout(timeout);
|
||||||
|
}
|
||||||
|
await rm(profile, { recursive: true, force: true });
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,33 @@
|
|||||||
|
{
|
||||||
|
"$schema": "../../../schemas/case.schema.json",
|
||||||
|
"schemaVersion": 1,
|
||||||
|
"id": "snapshot-coordinates",
|
||||||
|
"title": "Scrolled and nested frame coordinate fixture",
|
||||||
|
"suite": "regression",
|
||||||
|
"tags": ["geometry", "iframe", "scroll"],
|
||||||
|
"fixture": { "startPath": "/snapshot-coordinates" },
|
||||||
|
"prompts": {
|
||||||
|
"en": "Open {url}, observe the page and its frames, report the GEOMETRY marker, then close the session.",
|
||||||
|
"zh-CN": "打开 {url},观察页面及其 iframe,报告 GEOMETRY 标记,然后关闭会话。"
|
||||||
|
},
|
||||||
|
"coverage": ["session.start", "session.stop", "page.navigate", "inspect.observe"],
|
||||||
|
"assertions": {
|
||||||
|
"site": [
|
||||||
|
{
|
||||||
|
"label": "root fixture scrolled and settled",
|
||||||
|
"type": "geometry.ready",
|
||||||
|
"where": { "data.root": true },
|
||||||
|
"minCount": 1
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"response": [{ "label": "observed the fixture marker", "includes": "GEOMETRY-195" }],
|
||||||
|
"adapter": [{ "label": "browser session was closed", "key": "sessionStopped" }]
|
||||||
|
},
|
||||||
|
"smoke": {
|
||||||
|
"steps": [
|
||||||
|
{ "action": "navigate" },
|
||||||
|
{ "action": "wait-site-event", "type": "geometry.ready", "where": { "root": true } },
|
||||||
|
{ "action": "observe" }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,52 @@
|
|||||||
|
import { page, withRun } from "../../../lib/fixtures.mjs";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
id: "snapshot-coordinates",
|
||||||
|
routes: ["/snapshot-coordinates", "/snapshot-coordinates/frame", "/snapshot-coordinates/nested"],
|
||||||
|
render({ pathname, runId, query }) {
|
||||||
|
const root = pathname === "/snapshot-coordinates";
|
||||||
|
const nested = pathname.endsWith("/nested");
|
||||||
|
return page({
|
||||||
|
title: "Snapshot coordinate regression",
|
||||||
|
body: `
|
||||||
|
<style>
|
||||||
|
main { margin: 0; width: auto; }
|
||||||
|
body { width: 2000px; height: 2400px; }
|
||||||
|
html { overflow-anchor: none; }
|
||||||
|
${query.get("scrollbars") === "none" ? "html { scrollbar-width: none; }" : ""}
|
||||||
|
button { position: absolute; box-sizing: border-box; padding: 0; border: 2px solid black; border-radius: 0; }
|
||||||
|
#probe { left: ${root ? 180 : 100}px; top: ${root ? 360 : 160}px; width: 120px; height: 40px; }
|
||||||
|
iframe { position: absolute; box-sizing: content-box; width: 320px; height: 220px;
|
||||||
|
border: 6px solid black; padding: 8px; transform: scale(1.25); transform-origin: 0 0; }
|
||||||
|
#same { left: 340px; top: 400px; }
|
||||||
|
#cross { left: 820px; top: 400px; }
|
||||||
|
#nested { left: 150px; top: 210px; width: 130px; height: 70px; border-width: 2px; padding: 4px; transform: scale(0.8); }
|
||||||
|
${nested ? "#probe { left: 30px; top: 40px; width: 60px; height: 20px; }" : ""}
|
||||||
|
</style>
|
||||||
|
<button id="probe" data-geometry-probe>GEOMETRY-195</button>
|
||||||
|
${root ? `<iframe id="same" name="same" title="same-process frame" src="${withRun("/snapshot-coordinates/frame", runId)}"></iframe><iframe id="cross" name="cross" title="cross-site frame"></iframe>` : ""}
|
||||||
|
${!root && !nested ? `<iframe id="nested" name="nested" title="nested frame" src="${withRun("/snapshot-coordinates/nested", runId)}"></iframe>` : ""}
|
||||||
|
`,
|
||||||
|
script: `
|
||||||
|
history.scrollRestoration = "manual";
|
||||||
|
const cross = document.querySelector("#cross");
|
||||||
|
if (cross) {
|
||||||
|
const url = new URL(${JSON.stringify(withRun("/snapshot-coordinates/frame", runId))}, location.href);
|
||||||
|
url.hostname = location.hostname === "127.0.0.1" ? "localhost" : "127.0.0.1";
|
||||||
|
// Isolate unit conversion from the pre-existing OOPIF scrollbar-width
|
||||||
|
// projection issue. ?classic-scrollbars retains that separate reproduction.
|
||||||
|
if (!new URLSearchParams(location.search).has("classic-scrollbars")) url.searchParams.set("scrollbars", "none");
|
||||||
|
cross.src = url.href;
|
||||||
|
}
|
||||||
|
window.addEventListener("load", () => {
|
||||||
|
scrollTo(${root ? "80, 240" : nested ? "10, 20" : "40, 100"});
|
||||||
|
requestAnimationFrame(() => requestAnimationFrame(() => {
|
||||||
|
window.geometryReady = true;
|
||||||
|
document.documentElement.dataset.geometryReady = "true";
|
||||||
|
browserEval.send("geometry.ready", { root: ${root} });
|
||||||
|
}));
|
||||||
|
});
|
||||||
|
`,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
};
|
||||||
@@ -41,17 +41,22 @@ test("case manifests are discovered, ordered, and grouped into suites", () => {
|
|||||||
"diagnostics",
|
"diagnostics",
|
||||||
"mobile-emulation",
|
"mobile-emulation",
|
||||||
"generated-form",
|
"generated-form",
|
||||||
|
"snapshot-coordinates",
|
||||||
],
|
],
|
||||||
);
|
);
|
||||||
assert.deepEqual(repositorySummary(cases, fixtureRegistry).suites, { core: 6, matrix: 1 });
|
assert.deepEqual(repositorySummary(cases, fixtureRegistry).suites, {
|
||||||
|
core: 6,
|
||||||
|
matrix: 1,
|
||||||
|
regression: 1,
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
test("repository validation links every case to a fixture and valid workflow evidence", () => {
|
test("repository validation links every case to a fixture and valid workflow evidence", () => {
|
||||||
assert.deepEqual(validateRepositoryCases(cases, fixtureRegistry), []);
|
assert.deepEqual(validateRepositoryCases(cases, fixtureRegistry), []);
|
||||||
const summary = repositorySummary(cases, fixtureRegistry);
|
const summary = repositorySummary(cases, fixtureRegistry);
|
||||||
assert.equal(summary.cases, 7);
|
assert.equal(summary.cases, 8);
|
||||||
assert.equal(summary.fixtureModules, 8);
|
assert.equal(summary.fixtureModules, 9);
|
||||||
assert.equal(summary.fixtureRoutes, 12);
|
assert.equal(summary.fixtureRoutes, 15);
|
||||||
});
|
});
|
||||||
|
|
||||||
test("manifest validation rejects unknown operations and incomplete workflow steps", () => {
|
test("manifest validation rejects unknown operations and incomplete workflow steps", () => {
|
||||||
|
|||||||
+41
-15
@@ -21,6 +21,7 @@ $ErrorActionPreference = "Stop"
|
|||||||
|
|
||||||
$Repo = if ($env:BSK_REPO) { $env:BSK_REPO } else { "Tencent/BrowserSkill" }
|
$Repo = if ($env:BSK_REPO) { $env:BSK_REPO } else { "Tencent/BrowserSkill" }
|
||||||
$InstallDir = if ($env:BSK_INSTALL_DIR) { $env:BSK_INSTALL_DIR } else { Join-Path $HOME ".local\bin" }
|
$InstallDir = if ($env:BSK_INSTALL_DIR) { $env:BSK_INSTALL_DIR } else { Join-Path $HOME ".local\bin" }
|
||||||
|
$InstallDir = $ExecutionContext.SessionState.Path.GetUnresolvedProviderPathFromPSPath($InstallDir)
|
||||||
$GitHub = "https://github.com/${Repo}"
|
$GitHub = "https://github.com/${Repo}"
|
||||||
|
|
||||||
function Write-Log {
|
function Write-Log {
|
||||||
@@ -64,7 +65,7 @@ function Get-PlatformTriple {
|
|||||||
function Add-ToUserPath {
|
function Add-ToUserPath {
|
||||||
param([string]$Dir)
|
param([string]$Dir)
|
||||||
|
|
||||||
$currentUserPath = [Environment]::GetEnvironmentVariable("PATH", "User") -split ";" | Where-Object { $_ }
|
$currentUserPath = @([Environment]::GetEnvironmentVariable("PATH", "User") -split ";" | Where-Object { $_ })
|
||||||
|
|
||||||
if ($currentUserPath -contains $Dir) {
|
if ($currentUserPath -contains $Dir) {
|
||||||
Write-Log "$Dir is already in your user PATH"
|
Write-Log "$Dir is already in your user PATH"
|
||||||
@@ -90,30 +91,59 @@ function Add-ToSessionPath {
|
|||||||
# ── Git Bash (bash environment) PATH helper ──────────────────────────────────
|
# ── Git Bash (bash environment) PATH helper ──────────────────────────────────
|
||||||
|
|
||||||
function Add-ToBashProfile {
|
function Add-ToBashProfile {
|
||||||
param([string]$Dir)
|
param([string]$Dir, [string]$BashRc = (Join-Path $HOME ".bashrc"))
|
||||||
|
|
||||||
# Convert Windows path (e.g. C:\Users\foo\.local\bin) to Git-Bash Unix-style (/c/Users/foo/.local/bin)
|
# Convert Windows path (e.g. C:\Users\foo\.local\bin) to Git-Bash Unix-style (/c/Users/foo/.local/bin)
|
||||||
$unixPath = $Dir -replace '\\', '/'
|
$unixPath = $Dir -replace '\\', '/'
|
||||||
if ($unixPath -match '^([A-Z]):(.*)$') {
|
if ($unixPath -match '^([A-Z]):(.*)$') {
|
||||||
$unixPath = '/' + $matches[1].ToLower() + $matches[2]
|
$unixPath = '/' + $matches[1].ToLower() + $matches[2]
|
||||||
}
|
}
|
||||||
$bashRc = Join-Path $HOME ".bashrc"
|
# Single-quote the literal directory; only the existing PATH is expanded.
|
||||||
$exportLine = "export PATH=""${unixPath}:`$PATH"" # bsk CLI"
|
$shellQuote = "'" + [char]34 + "'" + [char]34 + "'"
|
||||||
|
$quotedPath = "'" + $unixPath.Replace("'", $shellQuote) + "'"
|
||||||
|
$exportLine = "export PATH=${quotedPath}:`"`$PATH`" # bsk CLI"
|
||||||
|
|
||||||
if (Test-Path $bashRc) {
|
if (Test-Path -LiteralPath $BashRc) {
|
||||||
$content = Get-Content $bashRc -Raw -ErrorAction SilentlyContinue
|
$content = [System.IO.File]::ReadAllText($BashRc)
|
||||||
if ($content -match [regex]::Escape($unixPath)) {
|
if ($content.Contains($exportLine)) {
|
||||||
Write-Log "$unixPath is already in ~/.bashrc"
|
Write-Log "$unixPath is already in ~/.bashrc"
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Add-Content $bashRc "`n$exportLine" -Encoding ASCII
|
# Explicit BOM-less UTF-8 also works in Windows PowerShell 5.1.
|
||||||
|
[System.IO.File]::AppendAllText($BashRc, "`n$exportLine`n", (New-Object System.Text.UTF8Encoding($false)))
|
||||||
Write-Log "added ${unixPath} to ~/.bashrc"
|
Write-Log "added ${unixPath} to ~/.bashrc"
|
||||||
}
|
}
|
||||||
|
|
||||||
# ── Main ──────────────────────────────────────────────────────────────────────
|
# ── Main ──────────────────────────────────────────────────────────────────────
|
||||||
|
|
||||||
|
# Stage on the destination volume before stopping the daemon. Never truncate
|
||||||
|
# the installed executable: failed replacement must leave it usable.
|
||||||
|
function Install-Binary {
|
||||||
|
param([string]$Source, [string]$Target)
|
||||||
|
|
||||||
|
$staged = "$Target.install-$([Guid]::NewGuid().ToString('N'))"
|
||||||
|
try {
|
||||||
|
[System.IO.File]::Copy($Source, $staged)
|
||||||
|
if ([System.IO.File]::Exists($Target)) {
|
||||||
|
# Use the downloaded CLI: older versions have broken Windows
|
||||||
|
# liveness checks. Stop verifies daemon identity before terminating it.
|
||||||
|
& $Source daemon stop
|
||||||
|
if ($LASTEXITCODE -ne 0) { throw "could not stop bsk daemon; existing installation was not replaced" }
|
||||||
|
# PowerShell 5.1 converts $null to an empty path for string parameters.
|
||||||
|
[System.IO.File]::Replace($staged, $Target, [NullString]::Value)
|
||||||
|
Write-Log "daemon will restart automatically on the next browser command"
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
[System.IO.File]::Move($staged, $Target)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
finally {
|
||||||
|
if ([System.IO.File]::Exists($staged)) { [System.IO.File]::Delete($staged) }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function Main {
|
function Main {
|
||||||
$platform = Get-PlatformTriple
|
$platform = Get-PlatformTriple
|
||||||
|
|
||||||
@@ -184,7 +214,7 @@ function Main {
|
|||||||
New-Item -ItemType Directory -Path $InstallDir -Force | Out-Null
|
New-Item -ItemType Directory -Path $InstallDir -Force | Out-Null
|
||||||
}
|
}
|
||||||
|
|
||||||
Copy-Item -Path (Join-Path $tempDir "bsk.exe") -Destination (Join-Path $InstallDir "bsk.exe") -Force
|
Install-Binary -Source (Join-Path $tempDir "bsk.exe") -Target (Join-Path $InstallDir "bsk.exe")
|
||||||
|
|
||||||
Write-Log "installed bsk to $InstallDir\bsk.exe"
|
Write-Log "installed bsk to $InstallDir\bsk.exe"
|
||||||
|
|
||||||
@@ -199,12 +229,8 @@ function Main {
|
|||||||
|
|
||||||
# Verify
|
# Verify
|
||||||
$bskPath = Join-Path $InstallDir "bsk.exe"
|
$bskPath = Join-Path $InstallDir "bsk.exe"
|
||||||
if (Get-Command bsk -ErrorAction SilentlyContinue) {
|
& $bskPath --version
|
||||||
& bsk --version
|
if ($LASTEXITCODE -ne 0) { throw "installed bsk failed verification" }
|
||||||
}
|
|
||||||
else {
|
|
||||||
Write-Log "verify install: & ""$bskPath"" --version"
|
|
||||||
}
|
|
||||||
|
|
||||||
Write-Log "done"
|
Write-Log "done"
|
||||||
Write-Host ""
|
Write-Host ""
|
||||||
|
|||||||
@@ -1,13 +1,51 @@
|
|||||||
# dsh-plugin-browserskill
|
# BrowserSkill for DeepSeek Harness
|
||||||
|
|
||||||
npm: [`@wxg-prc-cpg/browser-skill-dsh-plugin`](https://www.npmjs.com/package/@wxg-prc-cpg/browser-skill-dsh-plugin)
|
[](https://www.npmjs.com/package/@wxg-prc-cpg/browser-skill-dsh-plugin)
|
||||||
|
|
||||||
A [DeepSeek Harness](https://github.com/deepseek-ai/deepseek-harness) (dsh) tool plugin that exposes
|
Use [BrowserSkill](https://github.com/Tencent/BrowserSkill) in
|
||||||
[BrowserSkill](https://github.com/Tencent/BrowserSkill) (`bsk`) browser automation to the model.
|
[DeepSeek Harness](https://github.com/deepseek-ai/deepseek-harness) (`dsh`) to browse
|
||||||
|
websites, fill forms, and capture screenshots through native `browser_*` tools.
|
||||||
|
Browser tasks run in Agent Windows, with a live view in the dsh Web UI.
|
||||||
|
|
||||||
Each action maps to one `bsk <cmd> --json` invocation: the plugin spawns the bsk CLI, parses its
|
## Installation
|
||||||
structured JSON output, and returns a canonical typed value. The bsk daemon, browser, and browser
|
|
||||||
extension keep owning the actual browser control — this package is a thin, well-typed bridge.
|
Before installing the plugin:
|
||||||
|
|
||||||
|
- Install [DeepSeek Harness](https://github.com/deepseek-ai/deepseek-harness) and
|
||||||
|
[pnpm](https://pnpm.io/installation), which dsh uses to manage plugins.
|
||||||
|
- Install the `bsk` CLI and connect the BrowserSkill extension in Chrome or Edge.
|
||||||
|
Follow the [BrowserSkill setup guide](https://github.com/Tencent/BrowserSkill#quick-start).
|
||||||
|
- Make sure `bsk` is on the `PATH` used to start dsh, or set `bskPath` in the plugin configuration.
|
||||||
|
|
||||||
|
Install the plugin into the `web` profile, then start it:
|
||||||
|
|
||||||
|
```sh
|
||||||
|
dsh plugin --profile web add @wxg-prc-cpg/browser-skill-dsh-plugin
|
||||||
|
dsh --profile web
|
||||||
|
```
|
||||||
|
|
||||||
|
Replace `web` with your profile name if you use a different profile. The plugin
|
||||||
|
includes the `browser-skill` skill; no separate `bsk install-skill` step is needed.
|
||||||
|
|
||||||
|
In a conversation, try:
|
||||||
|
|
||||||
|
```text
|
||||||
|
/browser-skill open example.com and summarize the page.
|
||||||
|
```
|
||||||
|
|
||||||
|
By default, the browser tools become available when the skill is invoked.
|
||||||
|
|
||||||
|
## Updating
|
||||||
|
|
||||||
|
Installed plugins do not update automatically. To upgrade this plugin to npm's
|
||||||
|
`latest` version, including versions outside the profile's saved dependency range:
|
||||||
|
|
||||||
|
```sh
|
||||||
|
dsh plugin --profile web update @wxg-prc-cpg/browser-skill-dsh-plugin --latest
|
||||||
|
```
|
||||||
|
|
||||||
|
Restart that dsh profile after upgrading. This command updates the plugin; update
|
||||||
|
the `bsk` CLI and browser extension separately when a release requires it.
|
||||||
|
|
||||||
## Tools
|
## Tools
|
||||||
|
|
||||||
@@ -20,23 +58,7 @@ extension keep owning the actual browser control — this package is a thin, wel
|
|||||||
| `browser_tabs` | `list`, `create`, `select`, `close`, `borrow`, `return` | Manage Agent Window tabs and temporarily borrow user tabs. |
|
| `browser_tabs` | `list`, `create`, `select`, `close`, `borrow`, `return` | Manage Agent Window tabs and temporarily borrow user tabs. |
|
||||||
| `browser_assist` | `resize`, `emulate`, `request-help` | Resize or emulate the browser and pause for human-only steps. |
|
| `browser_assist` | `resize`, `emulate`, `request-help` | Resize or emulate the browser and pause for human-only steps. |
|
||||||
|
|
||||||
`bsk evaluate` and `bsk record` are intentionally not exposed by this plugin: arbitrary page
|
Arbitrary page-script evaluation and interaction recording are not supported.
|
||||||
evaluation is a higher-risk capability, while recording is long-running and needs a dedicated
|
|
||||||
DeepSeek Harness lifecycle before it can be added safely.
|
|
||||||
|
|
||||||
## Agent skill (progressive disclosure)
|
|
||||||
|
|
||||||
Beyond the tools, the plugin publishes the **`browser-skill` agent skill** through the harness's
|
|
||||||
official skill seam (`ctx.skills.register`): the catalog entry (name + routing description) is
|
|
||||||
resident in `<available_skills>`, and the body is loaded only when the model invokes the `skill`
|
|
||||||
tool. Its single source is the DSH-specific `skill/SKILL.md`, which documents only structured
|
|
||||||
`browser_*` calls and their plugin semantics. The repository-root CLI skill is intentionally not
|
|
||||||
concatenated: its command examples belong to a different execution interface and would bypass
|
|
||||||
the plugin's ownership, live observation UI, cancellation, and cleanup path if followed directly.
|
|
||||||
The build rejects internal CLI-name leakage, command-line code blocks, unknown browser tools, and
|
|
||||||
missing supported browser tools before embedding the Markdown. Registration and every pre-step
|
|
||||||
catalog snapshot are pure in-memory reads (no disk/process/daemon); compositions without the skill
|
|
||||||
seam degrade silently.
|
|
||||||
|
|
||||||
## Multi-session model
|
## Multi-session model
|
||||||
|
|
||||||
@@ -55,136 +77,73 @@ an explicit `session` argument naming a foreign or unknown id is rejected, the `
|
|||||||
`browser_session` shows plugin-created sessions only (no daemon-wide view), and stop/unload cleanup
|
`browser_session` shows plugin-created sessions only (no daemon-wide view), and stop/unload cleanup
|
||||||
can never touch a session owned by another program.
|
can never touch a session owned by another program.
|
||||||
|
|
||||||
## Installation
|
|
||||||
|
|
||||||
The plugin follows the standard dsh bundle layout (`dsh.bundle` manifest + `cordis.patch.yml`):
|
|
||||||
|
|
||||||
```sh
|
|
||||||
dsh plugin --profile <name> add @wxg-prc-cpg/browser-skill-dsh-plugin
|
|
||||||
dsh --profile <name>
|
|
||||||
```
|
|
||||||
|
|
||||||
Prerequisite: the `bsk` CLI must be installed and on `PATH`, and the BrowserSkill browser extension
|
|
||||||
(Chrome or Edge) must be connected — see the
|
|
||||||
[BrowserSkill README](https://github.com/Tencent/BrowserSkill). When bsk is missing, tool calls fail
|
|
||||||
with install guidance instead of a bare spawn error.
|
|
||||||
|
|
||||||
## Configuration
|
## Configuration
|
||||||
|
|
||||||
All fields are optional and validated through the plugin's Schemastery `Config`:
|
After installing the plugin, edit your profile's `cordis.patch.yml`. For the `web`
|
||||||
|
profile, the default location is `~/.dsh/profiles/web/cordis.patch.yml`. If you set
|
||||||
|
`DSH_HOME`, use `$DSH_HOME/profiles/web/cordis.patch.yml` instead. Replace `web` with
|
||||||
|
your profile name as needed.
|
||||||
|
|
||||||
|
If the file contains only comments and `[]`, keep the comments and replace `[]`
|
||||||
|
with the YAML below. If it already contains patch entries, add this entry to the
|
||||||
|
existing list or edit its existing `id: browserskill` entry. Keep a single
|
||||||
|
top-level YAML list. This overrides the plugin registered by the installed bundle:
|
||||||
|
|
||||||
```yaml
|
```yaml
|
||||||
# cordis.patch.yml override example
|
- id: browserskill
|
||||||
- insert:
|
|
||||||
- id: browserskill
|
|
||||||
name: "@wxg-prc-cpg/browser-skill-dsh-plugin"
|
|
||||||
config:
|
config:
|
||||||
bskPath: bsk # path to the bsk binary (default: resolve from PATH)
|
bskPath: bsk
|
||||||
defaultTimeoutMs: 120000
|
defaultTimeoutMs: 120000
|
||||||
maxSessions: 5
|
maxSessions: 5
|
||||||
# observationEnabled: true # live PiP/overlay observation (below)
|
observationEnabled: true
|
||||||
# thumbnailIntervalMs: 1500 # frame cadence while a session is active
|
thumbnailIntervalMs: 1500
|
||||||
# idleIntervalMs: 8000 # idle cadence / recent-activity window
|
idleIntervalMs: 8000
|
||||||
# lazyTools: true # reveal browser_* tools only after the skill is invoked
|
lazyTools: true
|
||||||
```
|
```
|
||||||
|
|
||||||
- **`lazyTools` (default `true`)** — the final progressive-disclosure stage: the six
|
Change `bskPath` to the full path of your CLI binary if it is not on dsh's `PATH`.
|
||||||
`browser_*` tool schemas stay OUT of the system prompt (zero schema tokens) until the
|
A patch replaces the entry's entire `config` object, so keep all overrides you need
|
||||||
`browser-skill` skill is actually invoked — the skill catalog entry is the only
|
together in that object.
|
||||||
advertisement. One successful invocation (model tool call, or a `/browser-skill` user
|
|
||||||
gesture) registers the whole suite for the rest of the process; repeated invocations are
|
|
||||||
no-ops, and sessions resumed with a past invocation in their durable log reveal the suite
|
|
||||||
on entry. Set `false` for the legacy always-on registration.
|
|
||||||
|
|
||||||
## Observation overlay (PiP mini-window)
|
Configuration changes follow `dsh.profile.patchReload` in the profile's
|
||||||
|
`package.json`: `live` (the default for `web`) applies changes when you save the
|
||||||
|
patch file; `startup` requires restarting the profile. Restart after upgrading
|
||||||
|
the plugin in either case.
|
||||||
|
|
||||||
When the plugin runs inside the dsh Web UI, an **observation overlay** floats over the app
|
All fields are optional; omitted fields use the defaults below:
|
||||||
(registered into the `shell.overlay` seat): a breathing thumbnail per owned session plus its
|
|
||||||
current action and elapsed time. The card docks at the top-right of the content area (clear of
|
|
||||||
the composer and the shell's header controls) and wears the **BrowserSkill product family's own
|
|
||||||
look**: the overlay reuses `@browser-skill/ui` components (`Button`, `cn`) and its oklch design
|
|
||||||
tokens (`--card`, `--primary`, `--destructive`, `--ring`, …), status dots spec'd after the
|
|
||||||
extension popup's connection indicator, and Remix icons. The BSK utility sheet is compiled
|
|
||||||
scoped under the `.bsk-obs` root class (`scripts/build-client-css.mjs`), so the overlay looks
|
|
||||||
like the BrowserSkill extension without leaking a single selector into the host shell — and the
|
|
||||||
shell's theme cannot bleed back in.
|
|
||||||
|
|
||||||
- **Lifecycle**: hidden while the plugin owns no sessions; appears on the first
|
| Option | Default | Purpose |
|
||||||
`browser_session` start action; disappears when all sessions stop (or the plugin unloads).
|
| --- | --- | --- |
|
||||||
- **Focus view**: status row (green/idle/red dot + session + action + mm:ss), the latest page
|
| `bskPath` | `bsk` | Path to the CLI binary. |
|
||||||
frame (while viewed, refreshes every ~1.5s while active, ~8s when idle; the last good frame stays on
|
| `defaultTimeoutMs` | `120000` | Default command timeout in milliseconds. |
|
||||||
stage while the next one loads, and is kept on errors so the card does not flash),
|
| `maxSessions` | `5` | Maximum concurrent sessions started by this plugin. |
|
||||||
and a compact icon toolbar (Interrupt + Pop out, hover for the label).
|
| `observationEnabled` | `true` | Enable live browser observation. |
|
||||||
- **Interrupt**: one click kills the in-flight bsk command of the focus session (same semantics
|
| `thumbnailIntervalMs` | `1500` | Screenshot interval for active sessions, in milliseconds. |
|
||||||
as the chat Stop button — the current action fails, the agent run may continue). Strip items
|
| `idleIntervalMs` | `8000` | Screenshot interval for idle sessions and the recent-activity window, in milliseconds. |
|
||||||
carry their own hover interrupt button.
|
| `lazyTools` | `true` | Reveal the browser tools when the skill is invoked. Set `false` to register them at startup. |
|
||||||
- **Multi-session strip**: every session gets a tile (mini frame + id + status dot); focus
|
|
||||||
auto-follows the most recently active session; clicking a tile pins focus (pin badge, click
|
|
||||||
again to release); errored sessions get a red edge without stealing focus; sessions the daemon
|
|
||||||
lost are greyed out; prolonged daemon/browser outage shows "browser unavailable" and greys
|
|
||||||
the interrupt button until captures recover.
|
|
||||||
- **Drag & resize**: drag the header to move the card; drag any of the four
|
|
||||||
corners to resize (min 240×180, max 80% of the viewport; no visible grip).
|
|
||||||
Both are remembered for the page lifetime.
|
|
||||||
- **Pop out (PiP)**: upgrades the card into a native Document PiP window (requires a user
|
|
||||||
gesture, per browser rules), sized from the current card; closing the PiP falls back to the
|
|
||||||
in-page card with state intact. Browsers without Document PiP simply hide the button.
|
|
||||||
- **Screenshot demand**: the client requests periodic screenshots while an observation view is
|
|
||||||
visible, using the PiP document's visibility when popped out. Hidden or collapsed views can
|
|
||||||
keep subscribing to state without requesting screenshots. The first screenshot subscriber
|
|
||||||
starts capture scheduling; the last one's departure cancels timers and skips queued captures.
|
|
||||||
An already running capture may finish. Demand applies to the service's owned sessions, not just
|
|
||||||
the selected session.
|
|
||||||
- **Wire**: `GET /bsk-observation/events` is the live synchronization channel (SSE). Every connection,
|
|
||||||
including reconnects, starts with `{ type: "snapshot", sessions, available }`, followed by
|
|
||||||
`upsert`, `remove`, `reset`, and `availability` events on the same stream. Replace local state
|
|
||||||
with each snapshot before applying subsequent events. Use `?thumbnails=0` for state-only
|
|
||||||
subscriptions or `?thumbnails=1` to request screenshots; omitting the parameter defaults to
|
|
||||||
requesting screenshots for compatibility. Closing the stream releases its screenshot demand.
|
|
||||||
`GET /bsk-observation/state` remains a one-time `{ sessions, available }` read and does not
|
|
||||||
request screenshots. It has no ordering guarantee relative to a separate SSE connection;
|
|
||||||
live clients should initialize and resynchronize from the stream's snapshot instead.
|
|
||||||
The host also serves `POST /bsk-observation/interrupt`, `POST /bsk-observation/stop`, and
|
|
||||||
`GET /bsk-observation/thumbnail/<attachmentId>` through the dsh `webServer` route seam
|
|
||||||
(dsh 0.1's Typert Remote pipeline is closed to out-of-tree packages). All commands for one
|
|
||||||
session — tool calls and frame captures alike — run through a per-session FIFO, because the
|
|
||||||
daemon accepts only one unfinished command per session.
|
|
||||||
- **Programmatic subscription**: `ObservationService.subscribe(listener, { thumbnails: false })`
|
|
||||||
subscribes to state without requesting screenshots. On an active service, the listener receives
|
|
||||||
the initial `snapshot` synchronously, before `subscribe` returns, then receives subsequent
|
|
||||||
changes. `thumbnails` defaults to `true`, so callers should choose it explicitly. The returned
|
|
||||||
unsubscribe function is safe to call repeatedly and releases this subscription's screenshot
|
|
||||||
demand. Subscribing after service disposal is a no-op.
|
|
||||||
- **Trust model**: these routes expose live screenshots (and an interrupt write), so they
|
|
||||||
replicate the browser-trust fence dsh applies to its own `/api` routes: the request Host
|
|
||||||
must be a loopback authority (`localhost`, `127.0.0.0/8`, `[::1]`), a present Origin must
|
|
||||||
match the Host, `sec-fetch-site: cross-site` is refused, and POST requires an
|
|
||||||
`application/json` body (cross-site simple requests can never satisfy that). The channel is
|
|
||||||
therefore built for **loopback-only serving** — binding the dsh web server to `0.0.0.0` and
|
|
||||||
reaching it through a LAN address will (deliberately) fail the fence; do not put these
|
|
||||||
routes behind a non-loopback reverse proxy without adding your own authentication.
|
|
||||||
- Configure with `observationEnabled` / `thumbnailIntervalMs` / `idleIntervalMs`.
|
|
||||||
|
|
||||||
## Behavior notes
|
With `lazyTools: true`, only the skill's catalog entry is initially advertised to
|
||||||
|
the model. The six `browser_*` tool schemas are added to the system prompt after
|
||||||
|
the `browser-skill` skill is successfully invoked, either by the model or through
|
||||||
|
`/browser-skill`. Set `lazyTools: false` to make the tools available immediately.
|
||||||
|
|
||||||
- **Cancellation**: aborting a tool call (`exec.signal`) kills the underlying bsk child process,
|
## Live browser view
|
||||||
matching BrowserSkill's cooperative tool-cancellation model.
|
|
||||||
- **UI cards**: calls render as terminal cards (command line as title, output as the completed
|
The dsh Web UI shows the plugin's browser sessions in a floating panel. If your
|
||||||
card). Screenshots additionally attach the image itself when the host mounts an attachment store
|
profile provides the `dsh-better-sidebar` integration, the view appears in a
|
||||||
and the active model route declares image input; otherwise the PNG path is returned.
|
**Browser Skill** sidebar tab instead.
|
||||||
- **Web UI toolview (browser half)**: the package is dual-face. `dsh.client` (platform `web`) ships
|
|
||||||
`lib/client.cjs`, which registers a keyed `tool.call.toolview` view for `browser_inspect`. The
|
- See the current action, elapsed time, and recent screenshot for each session.
|
||||||
custom view keeps a terminal block for every inspect action and, when a screenshot result carries
|
- Select a session to focus on it. The sidebar view follows the current conversation.
|
||||||
an image block, resolves the durable attachment through the client session's authorized
|
- Use **Interrupt** to cancel the current browser command. The agent may continue
|
||||||
`readAttachment` RPC and renders it with the shared `MessageImage` thumbnail/lightbox atoms.
|
with another action afterward.
|
||||||
The other five tools keep the stock terminal card. The bundle follows the dsh client
|
- Drag or resize the floating panel, or use **Pop out** to open a Picture-in-Picture
|
||||||
contract: a CJS closure factory handed to `window.__ModuleLoader__.load`, platform modules
|
window in browsers that support it.
|
||||||
(`react`, `dsh-client-ui-*`) external, everything else inlined, CSS Modules compiled by
|
- Periodic screenshots are requested while a browser observation view is visible.
|
||||||
lightningcss.
|
Configure the active and idle intervals with the options above.
|
||||||
- **Errors**: non-zero bsk exits surface the CLI's JSON error envelope (`code`, `message`, `hint`)
|
|
||||||
so the model gets the daemon's actionable guidance.
|
The observation endpoints require a loopback address such as `localhost` or
|
||||||
- **Long-running work** (e.g. `bsk record`) is not backgrounded via `ctx.jobs` yet — tracked as a
|
`127.0.0.1`. Access through a LAN hostname or non-loopback reverse proxy is not supported.
|
||||||
follow-up.
|
|
||||||
|
|
||||||
## Development
|
## Development
|
||||||
|
|
||||||
@@ -195,22 +154,47 @@ pnpm --filter @wxg-prc-cpg/browser-skill-dsh-plugin test # unit tests mock b
|
|||||||
pnpm --filter @wxg-prc-cpg/browser-skill-dsh-plugin build # tsdown -> lib/
|
pnpm --filter @wxg-prc-cpg/browser-skill-dsh-plugin build # tsdown -> lib/
|
||||||
```
|
```
|
||||||
|
|
||||||
|
See the [development notes](https://github.com/Tencent/BrowserSkill/blob/main/packages/dsh-plugin-browserskill/docs/development.md)
|
||||||
|
for skill registration, tool results, and observation APIs in the current source.
|
||||||
|
|
||||||
## Publishing
|
## Publishing
|
||||||
|
|
||||||
The GitHub Actions workflow **Release dsh plugin** publishes this package to npm
|
The [Release dsh plugin workflow](https://github.com/Tencent/BrowserSkill/blob/main/.github/workflows/release-dsh-plugin.yml)
|
||||||
as `@wxg-prc-cpg/browser-skill-dsh-plugin`. The Cordis plugin id, client
|
publishes the package and this README to npm. Pushing a `dsh-plugin-vX.Y.Z` tag
|
||||||
bundle registration, and `cordis.patch.yml` name are the same specifier so
|
triggers it; ordinary commits to `main` do not.
|
||||||
dsh can import and materialize the plugin without a ModuleLoader id mismatch.
|
|
||||||
|
|
||||||
Trigger it by pushing a tag that matches `package.json`'s `version`:
|
1. Commit this README and any other changes intended for the release.
|
||||||
|
2. From the repository root, run the
|
||||||
|
[release script](https://github.com/Tencent/BrowserSkill/blob/main/scripts/release.mjs)
|
||||||
|
with a new stable version, replacing `<version>` below. The script updates the
|
||||||
|
CLI, extension, and DSH plugin versions, commits the version changes, and creates
|
||||||
|
their release tags:
|
||||||
|
|
||||||
```sh
|
```sh
|
||||||
git tag dsh-plugin-v0.1.2
|
node scripts/release.mjs <version>
|
||||||
git push origin dsh-plugin-v0.1.2
|
```
|
||||||
```
|
|
||||||
|
|
||||||
Or run the workflow from the Actions tab (`workflow_dispatch`). The job reads the
|
3. Push the version commit to the release branch, then push the DSH plugin tag
|
||||||
`NPM_TOKEN` secret from the `npm-publish` GitHub Environment.
|
created by the script, using the same `<version>`:
|
||||||
|
|
||||||
|
```sh
|
||||||
|
git push origin HEAD
|
||||||
|
git push origin dsh-plugin-v<version>
|
||||||
|
```
|
||||||
|
|
||||||
|
This publishes the DSH plugin. Push the CLI and extension tags separately when
|
||||||
|
those components are ready for release.
|
||||||
|
|
||||||
|
The workflow checks the version, runs typechecks and tests, builds the package,
|
||||||
|
and publishes it to npm.
|
||||||
|
|
||||||
|
You can also run the workflow manually from GitHub Actions on the intended release
|
||||||
|
ref. Both triggers require an unpublished version and the `NPM_TOKEN` secret in the
|
||||||
|
`npm-publish` GitHub Environment.
|
||||||
|
|
||||||
|
npm updates the package README only when a new version is published, including
|
||||||
|
for documentation-only changes. Published versions cannot be overwritten. See
|
||||||
|
[npm's README update rules](https://docs.npmjs.com/about-package-readme-files/).
|
||||||
|
|
||||||
## License
|
## License
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,90 @@
|
|||||||
|
# DSH plugin development notes
|
||||||
|
|
||||||
|
For installation, usage, and configuration, see the [plugin README](../README.md).
|
||||||
|
These notes describe the current source on this branch; a published npm version may
|
||||||
|
not include later changes.
|
||||||
|
|
||||||
|
## Tool execution
|
||||||
|
|
||||||
|
The plugin runs the `bsk` CLI and parses its JSON output. The daemon and browser
|
||||||
|
extension perform the browser operations. The published package name is also the
|
||||||
|
Cordis plugin id, client bundle registration id, and `cordis.patch.yml` plugin name.
|
||||||
|
Keep these identifiers aligned so dsh can load both halves of the plugin.
|
||||||
|
|
||||||
|
## Agent skill
|
||||||
|
|
||||||
|
Beyond the tools, the plugin publishes the **`browser-skill` agent skill** through the harness's
|
||||||
|
official skill seam (`ctx.skills.register`): the catalog entry (name + routing description) is
|
||||||
|
resident in `<available_skills>`, and the body is loaded only when the model invokes the `skill`
|
||||||
|
tool. Its single source is the DSH-specific `skill/SKILL.md`, which documents only structured
|
||||||
|
`browser_*` calls and their plugin semantics. The repository-root CLI skill is intentionally not
|
||||||
|
concatenated: its command examples belong to a different execution interface and would bypass
|
||||||
|
the plugin's ownership, live observation UI, cancellation, and cleanup path if followed directly.
|
||||||
|
The build rejects internal CLI-name leakage, command-line code blocks, unknown browser tools, and
|
||||||
|
missing supported browser tools before embedding the Markdown. Registration and every pre-step
|
||||||
|
catalog snapshot are pure in-memory reads (no disk/process/daemon); compositions without the skill
|
||||||
|
seam degrade silently.
|
||||||
|
|
||||||
|
With `lazyTools: true`, the six tool schemas stay out of the system prompt until
|
||||||
|
the skill is successfully invoked. Registration happens once and lasts until the
|
||||||
|
plugin is unloaded. Repeated invocations do not register duplicate tools. Entering
|
||||||
|
a resumed conversation whose history contains a successful skill invocation also
|
||||||
|
registers the tools. Setting `lazyTools: false` registers them at plugin startup.
|
||||||
|
|
||||||
|
## Observation subscriptions and routes
|
||||||
|
|
||||||
|
- **Screenshot demand**: the client requests periodic screenshots while an observation view is
|
||||||
|
visible, using the PiP document's visibility when popped out. Hidden or collapsed views can
|
||||||
|
keep subscribing to state without requesting screenshots. The first screenshot subscriber
|
||||||
|
starts capture scheduling; the last one's departure cancels timers and skips queued captures.
|
||||||
|
An already running capture may finish. Demand applies to the service's owned sessions, not just
|
||||||
|
the selected session.
|
||||||
|
- **Wire**: `GET /bsk-observation/events` is the live synchronization channel (SSE). Every connection,
|
||||||
|
including reconnects, starts with `{ type: "snapshot", sessions, available }`, followed by
|
||||||
|
`upsert`, `remove`, `reset`, and `availability` events on the same stream. Replace local state
|
||||||
|
with each snapshot before applying subsequent events. Use `?thumbnails=0` for state-only
|
||||||
|
subscriptions or `?thumbnails=1` to request screenshots; omitting the parameter defaults to
|
||||||
|
requesting screenshots for compatibility. Closing the stream releases its screenshot demand.
|
||||||
|
`GET /bsk-observation/state` remains a one-time `{ sessions, available }` read and does not
|
||||||
|
request screenshots. It has no ordering guarantee relative to a separate SSE connection;
|
||||||
|
live clients should initialize and resynchronize from the stream's snapshot instead.
|
||||||
|
The host also serves `POST /bsk-observation/interrupt`, `POST /bsk-observation/stop`, and
|
||||||
|
`GET /bsk-observation/thumbnail/<attachmentId>` through the dsh `webServer` route seam
|
||||||
|
(dsh 0.1's Typert Remote pipeline is closed to out-of-tree packages). All commands for one
|
||||||
|
session — tool calls and frame captures alike — run through a per-session FIFO, because the
|
||||||
|
daemon accepts only one unfinished command per session.
|
||||||
|
- **Programmatic subscription**: `ObservationService.subscribe(listener, { thumbnails: false })`
|
||||||
|
subscribes to state without requesting screenshots. On an active service, the listener receives
|
||||||
|
the initial `snapshot` synchronously, before `subscribe` returns, then receives subsequent
|
||||||
|
changes. `thumbnails` defaults to `true`, so callers should choose it explicitly. The returned
|
||||||
|
unsubscribe function is safe to call repeatedly and releases this subscription's screenshot
|
||||||
|
demand. Subscribing after service disposal is a no-op.
|
||||||
|
- **Trust model**: these routes expose live screenshots (and an interrupt write), so they
|
||||||
|
replicate the browser-trust fence dsh applies to its own `/api` routes: the request Host
|
||||||
|
must be a loopback authority (`localhost`, `127.0.0.0/8`, `[::1]`), a present Origin must
|
||||||
|
match the Host, `sec-fetch-site: cross-site` is refused, and POST requires an
|
||||||
|
`application/json` body (cross-site simple requests can never satisfy that). The channel is
|
||||||
|
therefore built for **loopback-only serving** — binding the dsh web server to `0.0.0.0` and
|
||||||
|
reaching it through a LAN address will (deliberately) fail the fence; do not put these
|
||||||
|
routes behind a non-loopback reverse proxy without adding your own authentication.
|
||||||
|
|
||||||
|
## Tool results and cancellation
|
||||||
|
|
||||||
|
- **Cancellation**: aborting a tool call (`exec.signal`) kills the underlying bsk child process,
|
||||||
|
matching BrowserSkill's cooperative tool-cancellation model.
|
||||||
|
- **UI cards**: calls render as terminal cards (command line as title, output as the completed
|
||||||
|
card). Screenshots additionally attach the image itself when the host mounts an attachment store
|
||||||
|
and the active model route declares image input; otherwise the PNG path is returned.
|
||||||
|
- **Web UI toolview (browser half)**: the package is dual-face. `dsh.client` (platform `web`) ships
|
||||||
|
`lib/client.cjs`, which registers a keyed `tool.call.toolview` view for `browser_inspect`. The
|
||||||
|
custom view keeps a terminal block for every inspect action and, when a screenshot result carries
|
||||||
|
an image block, resolves the durable attachment through the client session's authorized
|
||||||
|
`readAttachment` RPC and renders it with the shared `MessageImage` thumbnail/lightbox atoms.
|
||||||
|
The other five tools keep the stock terminal card. The bundle follows the dsh client
|
||||||
|
contract: a CJS closure factory handed to `window.__ModuleLoader__.load`, platform modules
|
||||||
|
(`react`, `dsh-client-ui-*`) external, everything else inlined, CSS Modules compiled by
|
||||||
|
lightningcss.
|
||||||
|
- **Errors**: non-zero bsk exits surface the CLI's JSON error envelope (`code`, `message`, `hint`)
|
||||||
|
so the model gets the daemon's actionable guidance.
|
||||||
|
- **Long-running work** (e.g. `bsk record`) is not backgrounded via `ctx.jobs` yet — tracked as a
|
||||||
|
follow-up.
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"name": "@wxg-prc-cpg/browser-skill-dsh-plugin",
|
"name": "@wxg-prc-cpg/browser-skill-dsh-plugin",
|
||||||
"description": "DeepSeek Harness tool plugin that exposes BrowserSkill browser automation (browser_* tools) to the model",
|
"description": "DeepSeek Harness tool plugin that exposes BrowserSkill browser automation (browser_* tools) to the model",
|
||||||
"version": "0.2.0",
|
"version": "0.2.1",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"publishConfig": {
|
"publishConfig": {
|
||||||
"access": "public",
|
"access": "public",
|
||||||
|
|||||||
@@ -5,7 +5,7 @@
|
|||||||
* map the CLI's JSON error envelope onto a thrown `BskError`.
|
* map the CLI's JSON error envelope onto a thrown `BskError`.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import { type ChildProcess, spawn } from "node:child_process";
|
import { type ChildProcess, type SpawnOptionsWithoutStdio, spawn } from "node:child_process";
|
||||||
|
|
||||||
/** Shape of the JSON error envelope `bsk --json` prints on failure. */
|
/** Shape of the JSON error envelope `bsk --json` prints on failure. */
|
||||||
export interface BskErrorBody {
|
export interface BskErrorBody {
|
||||||
@@ -53,7 +53,11 @@ export interface BskRunOptions {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/** Minimal spawn signature so tests can substitute a fake child process. */
|
/** Minimal spawn signature so tests can substitute a fake child process. */
|
||||||
export type SpawnImpl = (command: string, args: string[]) => ChildProcess;
|
export type SpawnImpl = (
|
||||||
|
command: string,
|
||||||
|
args: string[],
|
||||||
|
options?: SpawnOptionsWithoutStdio,
|
||||||
|
) => ChildProcess;
|
||||||
|
|
||||||
export interface BskRunner {
|
export interface BskRunner {
|
||||||
/** Run `bsk <args...> --json` and collect its output. */
|
/** Run `bsk <args...> --json` and collect its output. */
|
||||||
@@ -64,29 +68,66 @@ export interface BskRunner {
|
|||||||
killFor(tag: string): number;
|
killFor(tag: string): number;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Business RPCs translate SIGINT into the daemon's cancel(rpc_id) protocol.
|
// Business RPCs translate Ctrl-C / opt-in stdin EOF into cancel(rpc_id).
|
||||||
// Give that bounded reconciliation path time to settle before the hard kill.
|
// Allow reconciliation before hard-killing an old or unresponsive CLI.
|
||||||
const KILL_GRACE_MS = 3000;
|
const KILL_GRACE_MS = 3000;
|
||||||
|
// Windows IPC may spend 5s connecting, 2s cancelling, 2s settling,
|
||||||
|
// and up to 5s releasing the entire batch of caller-owned transfers.
|
||||||
|
const WINDOWS_KILL_GRACE_MS = 15_000;
|
||||||
const SESSION_BUSY_RETRY_DELAY_MS = 100;
|
const SESSION_BUSY_RETRY_DELAY_MS = 100;
|
||||||
|
|
||||||
export function createBskRunner(bskPath: string, spawnImpl: SpawnImpl = spawn): BskRunner {
|
export function createBskRunner(bskPath: string, spawnImpl: SpawnImpl = spawn): BskRunner {
|
||||||
const live = new Map<ChildProcess, string | undefined>();
|
const live = new Map<ChildProcess, string | undefined>();
|
||||||
|
const windows = process.platform === "win32";
|
||||||
|
const cancelling = new Set<ChildProcess>();
|
||||||
|
|
||||||
function killChild(child: ChildProcess): void {
|
function killChild(child: ChildProcess): void {
|
||||||
if (child.exitCode !== null || child.signalCode !== null) return;
|
if (child.exitCode !== null || child.signalCode !== null || cancelling.has(child)) return;
|
||||||
child.kill("SIGINT");
|
cancelling.add(child);
|
||||||
const force = setTimeout(() => {
|
// Node kills Windows children outright for SIGINT. EOF asks the CLI to
|
||||||
|
// send its existing cancel RPC and wait for browser reconciliation.
|
||||||
|
if (windows && child.stdin) child.stdin.end();
|
||||||
|
else child.kill("SIGINT");
|
||||||
|
const force = setTimeout(
|
||||||
|
() => {
|
||||||
if (child.exitCode === null && child.signalCode === null) child.kill("SIGKILL");
|
if (child.exitCode === null && child.signalCode === null) child.kill("SIGKILL");
|
||||||
}, KILL_GRACE_MS);
|
},
|
||||||
|
windows ? WINDOWS_KILL_GRACE_MS : KILL_GRACE_MS,
|
||||||
|
);
|
||||||
force.unref();
|
force.unref();
|
||||||
|
child.once("close", () => {
|
||||||
|
clearTimeout(force);
|
||||||
|
cancelling.delete(child);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
run(args, options = {}) {
|
run(args, options = {}) {
|
||||||
|
if (options.signal?.aborted) {
|
||||||
|
return Promise.resolve({
|
||||||
|
code: null,
|
||||||
|
stdout: "",
|
||||||
|
stderr: "",
|
||||||
|
timedOut: false,
|
||||||
|
aborted: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
return new Promise<BskRunResult>((resolve, reject) => {
|
return new Promise<BskRunResult>((resolve, reject) => {
|
||||||
let child: ChildProcess;
|
let child: ChildProcess;
|
||||||
try {
|
try {
|
||||||
child = spawnImpl(bskPath, [...args, "--json"]);
|
child = spawnImpl(
|
||||||
|
bskPath,
|
||||||
|
[...args, "--json"],
|
||||||
|
windows
|
||||||
|
? {
|
||||||
|
windowsHide: true,
|
||||||
|
env: { ...process.env, BSK_CANCEL_ON_STDIN_CLOSE: "1" },
|
||||||
|
}
|
||||||
|
: undefined,
|
||||||
|
);
|
||||||
|
// A child exiting while cancellation closes stdin may report EPIPE.
|
||||||
|
// Its close/error event remains the authority for the run result.
|
||||||
|
child.stdin?.on("error", () => {});
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
reject(error);
|
reject(error);
|
||||||
return;
|
return;
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
import type { ChildProcess } from "node:child_process";
|
import type { ChildProcess } from "node:child_process";
|
||||||
import { EventEmitter } from "node:events";
|
import { EventEmitter } from "node:events";
|
||||||
import { describe, expect, it } from "vitest";
|
import { PassThrough } from "node:stream";
|
||||||
|
import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
|
||||||
import {
|
import {
|
||||||
type BskRunResult,
|
type BskRunResult,
|
||||||
createBskRunner,
|
createBskRunner,
|
||||||
@@ -92,6 +93,77 @@ describe("createBskRunner", () => {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe("Windows parent cancellation", () => {
|
||||||
|
const originalPlatform = Object.getOwnPropertyDescriptor(process, "platform")!;
|
||||||
|
beforeEach(() => Object.defineProperty(process, "platform", { value: "win32" }));
|
||||||
|
afterEach(() => {
|
||||||
|
Object.defineProperty(process, "platform", originalPlatform);
|
||||||
|
vi.useRealTimers();
|
||||||
|
});
|
||||||
|
|
||||||
|
it("opts in to stdin cancellation and waits for CLI reconciliation", async () => {
|
||||||
|
const child = Object.assign(new FakeChild(), { stdin: new PassThrough() });
|
||||||
|
const spawn = vi.fn(() => child as unknown as ChildProcess);
|
||||||
|
const runner = createBskRunner("bsk", spawn);
|
||||||
|
const abort = new AbortController();
|
||||||
|
const result = runner.run(["snapshot"], { signal: abort.signal });
|
||||||
|
expect(spawn.mock.calls[0]).toEqual([
|
||||||
|
"bsk",
|
||||||
|
["snapshot", "--json"],
|
||||||
|
{
|
||||||
|
windowsHide: true,
|
||||||
|
env: { ...process.env, BSK_CANCEL_ON_STDIN_CLOSE: "1" },
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
abort.abort();
|
||||||
|
expect(child.stdin.writableEnded).toBe(true);
|
||||||
|
expect(child.killedWith).toEqual([]);
|
||||||
|
// Closing an already-exited child's pipe must not crash the host.
|
||||||
|
child.stdin.emit("error", Object.assign(new Error("closed"), { code: "EPIPE" }));
|
||||||
|
child.finish(2, '{"code":"cancelled"}');
|
||||||
|
expect(await result).toMatchObject({ code: 2, aborted: true });
|
||||||
|
});
|
||||||
|
|
||||||
|
it("bounds cancellation of an old or unresponsive CLI", async () => {
|
||||||
|
vi.useFakeTimers();
|
||||||
|
const child = Object.assign(new FakeChild(), { stdin: new PassThrough() });
|
||||||
|
const runner = createBskRunner("bsk", fakeSpawn([child]));
|
||||||
|
const result = runner.run(["snapshot"], { timeoutMs: 5 });
|
||||||
|
await vi.advanceTimersByTimeAsync(5);
|
||||||
|
expect(child.stdin.writableEnded).toBe(true);
|
||||||
|
expect(child.killedWith).toEqual([]);
|
||||||
|
await vi.advanceTimersByTimeAsync(10_000);
|
||||||
|
expect(child.killedWith).toEqual([]);
|
||||||
|
await vi.advanceTimersByTimeAsync(5_000);
|
||||||
|
expect(child.killedWith).toEqual(["SIGKILL"]);
|
||||||
|
expect(await result).toMatchObject({ timedOut: true });
|
||||||
|
});
|
||||||
|
|
||||||
|
it("cancels only the requested tag and clears the fallback after exit", async () => {
|
||||||
|
vi.useFakeTimers();
|
||||||
|
const a = Object.assign(new FakeChild(), { stdin: new PassThrough() });
|
||||||
|
const b = Object.assign(new FakeChild(), { stdin: new PassThrough() });
|
||||||
|
const runner = createBskRunner("bsk", fakeSpawn([a, b]));
|
||||||
|
const first = runner.run(["snapshot"], { tag: "a" });
|
||||||
|
const second = runner.run(["snapshot"], { tag: "b" });
|
||||||
|
expect(runner.killFor("a")).toBe(1);
|
||||||
|
expect(a.stdin.writableEnded).toBe(true);
|
||||||
|
expect(b.stdin.writableEnded).toBe(false);
|
||||||
|
a.finish(2);
|
||||||
|
b.finish(0);
|
||||||
|
await Promise.all([first, second]);
|
||||||
|
expect(vi.getTimerCount()).toBe(0);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("does not start work for an already-aborted call", async () => {
|
||||||
|
const spawn = vi.fn();
|
||||||
|
const runner = createBskRunner("bsk", spawn);
|
||||||
|
const signal = AbortSignal.abort();
|
||||||
|
expect(await runner.run(["snapshot"], { signal })).toMatchObject({ aborted: true });
|
||||||
|
expect(spawn).not.toHaveBeenCalled();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
describe("parseBskJson", () => {
|
describe("parseBskJson", () => {
|
||||||
const base: BskRunResult = { code: 0, stdout: "", stderr: "", timedOut: false, aborted: false };
|
const base: BskRunResult = { code: 0, stdout: "", stderr: "", timedOut: false, aborted: false };
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,135 @@
|
|||||||
|
#Requires -Version 5.1
|
||||||
|
param([string]$BskPath = (Join-Path $PSScriptRoot "../target/debug/bsk.exe"))
|
||||||
|
$ErrorActionPreference = "Stop"
|
||||||
|
|
||||||
|
# Load definitions, never Main: no downloads or changes to the real user PATH.
|
||||||
|
$installer = Join-Path $PSScriptRoot "../install.ps1"
|
||||||
|
$tokens = $null
|
||||||
|
$errors = $null
|
||||||
|
$ast = [System.Management.Automation.Language.Parser]::ParseFile($installer, [ref]$tokens, [ref]$errors)
|
||||||
|
if ($errors.Count) { throw ($errors | Out-String) }
|
||||||
|
foreach ($statement in $ast.EndBlock.Statements) {
|
||||||
|
if ($statement -is [System.Management.Automation.Language.FunctionDefinitionAst]) {
|
||||||
|
$definition = $statement.Extent.Text
|
||||||
|
if ($statement.Name -eq "Add-ToUserPath") {
|
||||||
|
$definition = $definition.Replace('[Environment]::GetEnvironmentVariable("PATH", "User")', '$script:UserPath')
|
||||||
|
$definition = $definition.Replace('[Environment]::SetEnvironmentVariable("PATH", $newUserPath, "User")', '$script:UserPath = $newUserPath')
|
||||||
|
}
|
||||||
|
Invoke-Expression $definition
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function Assert-Equal($Actual, $Expected) {
|
||||||
|
if ($Actual -cne $Expected) { throw "expected [$Expected], got [$Actual]" }
|
||||||
|
}
|
||||||
|
function Assert-Fails([scriptblock]$Action) {
|
||||||
|
$failed = $false
|
||||||
|
try { & $Action } catch { $failed = $true }
|
||||||
|
if (-not $failed) { throw "expected failure" }
|
||||||
|
}
|
||||||
|
|
||||||
|
$dir = 'C:\Users\Alice\.local\bin'
|
||||||
|
foreach ($existing in @('', 'C:\WindowsApps', 'C:\A;C:\B')) {
|
||||||
|
$script:UserPath = $existing
|
||||||
|
Add-ToUserPath $dir
|
||||||
|
$expected = if ($existing) { "$existing;$dir" } else { $dir }
|
||||||
|
Assert-Equal $script:UserPath $expected
|
||||||
|
Add-ToUserPath $dir
|
||||||
|
Assert-Equal $script:UserPath $expected
|
||||||
|
}
|
||||||
|
|
||||||
|
$root = Join-Path ([IO.Path]::GetTempPath()) ("bsk-install-test-" + [Guid]::NewGuid().ToString('N'))
|
||||||
|
[IO.Directory]::CreateDirectory($root) | Out-Null
|
||||||
|
$oldBskHome = $env:BSK_HOME
|
||||||
|
$oldAutoUpdate = $env:BSK_AUTO_UPDATE
|
||||||
|
$daemon = $null
|
||||||
|
try {
|
||||||
|
$utf8 = New-Object System.Text.UTF8Encoding($false)
|
||||||
|
$bashRc = Join-Path $root ".bashrc"
|
||||||
|
$existing = "# existing 中文 configuration" + [char]10
|
||||||
|
[IO.File]::WriteAllText($bashRc, $existing, $utf8)
|
||||||
|
$special = 'C:\Users\张三 space $HOME $(echo unsafe) ! & [x] O''Brien\.local\bin'
|
||||||
|
Add-ToBashProfile $special $bashRc
|
||||||
|
$first = [IO.File]::ReadAllText($bashRc)
|
||||||
|
if (-not $first.StartsWith($existing)) { throw "existing bashrc content changed" }
|
||||||
|
if (-not $first.Contains('张三')) { throw "Unicode path was lost" }
|
||||||
|
Add-ToBashProfile $special $bashRc
|
||||||
|
Assert-Equal ([IO.File]::ReadAllText($bashRc)) $first
|
||||||
|
$bytes = [IO.File]::ReadAllBytes($bashRc)
|
||||||
|
if ($bytes[0] -eq 0xEF) { throw "unexpected UTF-8 BOM" }
|
||||||
|
|
||||||
|
$bash = [IO.Path]::GetFullPath((Join-Path (Split-Path (Get-Command git).Source -Parent) "../bin/bash.exe"))
|
||||||
|
if (-not (Test-Path -LiteralPath $bash)) { throw "Git Bash is required for quoting regression" }
|
||||||
|
$env:BSK_TEST_RC = $bashRc
|
||||||
|
$probe = Join-Path $root 'probe.sh'
|
||||||
|
[IO.File]::WriteAllText($probe, 'source "$BSK_TEST_RC"; printf "%s\n" "${PATH%%:*}"', $utf8)
|
||||||
|
$actual = & $bash --noprofile --norc $probe
|
||||||
|
if ($LASTEXITCODE -ne 0) { throw "Git Bash failed" }
|
||||||
|
Assert-Equal $actual ('/c' + $special.Substring(2).Replace('\', '/'))
|
||||||
|
|
||||||
|
$env:BSK_HOME = Join-Path $root "home"
|
||||||
|
$env:BSK_AUTO_UPDATE = "off"
|
||||||
|
[IO.Directory]::CreateDirectory($env:BSK_HOME) | Out-Null
|
||||||
|
$sourceDir = Join-Path $root "download"
|
||||||
|
[IO.Directory]::CreateDirectory($sourceDir) | Out-Null
|
||||||
|
$source = Join-Path $sourceDir "bsk.exe"
|
||||||
|
[IO.File]::Copy((Resolve-Path -LiteralPath $BskPath).Path, $source)
|
||||||
|
$targetDir = Join-Path $root "中文 space [x] & install"
|
||||||
|
[IO.Directory]::CreateDirectory($targetDir) | Out-Null
|
||||||
|
$target = Join-Path $targetDir "bsk.exe"
|
||||||
|
Install-Binary $source $target
|
||||||
|
Assert-Equal (Get-FileHash -LiteralPath $target).Hash (Get-FileHash -LiteralPath $source).Hash
|
||||||
|
|
||||||
|
$daemon = Start-Process -FilePath $target -ArgumentList @('daemon', 'start', '--foreground', '--port', '0') -WindowStyle Hidden -PassThru
|
||||||
|
$infoPath = Join-Path $env:BSK_HOME "daemon.json"
|
||||||
|
$deadline = [DateTime]::UtcNow.AddSeconds(15)
|
||||||
|
while (-not [IO.File]::Exists($infoPath)) {
|
||||||
|
if ($daemon.HasExited -or [DateTime]::UtcNow -gt $deadline) { throw "daemon failed to start" }
|
||||||
|
Start-Sleep -Milliseconds 50
|
||||||
|
}
|
||||||
|
# PE overlays distinguish old/new executables without another build.
|
||||||
|
$stream = [IO.File]::OpenWrite($source)
|
||||||
|
try {
|
||||||
|
$stream.Seek(0, [IO.SeekOrigin]::End) | Out-Null
|
||||||
|
$marker = $utf8.GetBytes("installer replacement regression")
|
||||||
|
$stream.Write($marker, 0, $marker.Length)
|
||||||
|
} finally { $stream.Dispose() }
|
||||||
|
Install-Binary $source $target
|
||||||
|
if (-not $daemon.WaitForExit(5000)) { throw "old daemon still running" }
|
||||||
|
Assert-Equal (Get-FileHash -LiteralPath $target).Hash (Get-FileHash -LiteralPath $source).Hash
|
||||||
|
& $target --version
|
||||||
|
if ($LASTEXITCODE -ne 0) { throw "replacement is not executable" }
|
||||||
|
|
||||||
|
# Refuse replacement when daemon identity cannot be verified.
|
||||||
|
[IO.File]::WriteAllText($infoPath, 'invalid daemon metadata')
|
||||||
|
$before = (Get-FileHash -LiteralPath $target).Hash
|
||||||
|
Assert-Fails { Install-Binary $source $target }
|
||||||
|
Assert-Equal (Get-FileHash -LiteralPath $target).Hash $before
|
||||||
|
[IO.File]::Delete($infoPath)
|
||||||
|
|
||||||
|
# A remaining lock must fail without truncation or staging debris.
|
||||||
|
$lock = [IO.File]::Open($target, [IO.FileMode]::Open, [IO.FileAccess]::Read, [IO.FileShare]::None)
|
||||||
|
try { Assert-Fails { Install-Binary $source $target } } finally { $lock.Dispose() }
|
||||||
|
Assert-Equal (Get-FileHash -LiteralPath $target).Hash $before
|
||||||
|
if (@(Get-ChildItem -LiteralPath $targetDir -Filter "*.install-*").Count) { throw "staging files leaked" }
|
||||||
|
Write-Host "Windows installer regressions passed ($($PSVersionTable.PSVersion))"
|
||||||
|
}
|
||||||
|
catch {
|
||||||
|
Write-Host ($_ | Out-String)
|
||||||
|
Write-Host $_.ScriptStackTrace
|
||||||
|
throw
|
||||||
|
}
|
||||||
|
finally {
|
||||||
|
if ($daemon -and -not $daemon.HasExited) {
|
||||||
|
Stop-Process -Id $daemon.Id -Force
|
||||||
|
$daemon.WaitForExit(5000) | Out-Null
|
||||||
|
}
|
||||||
|
$env:BSK_HOME = $oldBskHome
|
||||||
|
$env:BSK_AUTO_UPDATE = $oldAutoUpdate
|
||||||
|
Remove-Item Env:BSK_TEST_RC -ErrorAction SilentlyContinue
|
||||||
|
# Resolve and verify before recursive cleanup; only this fixture is removed.
|
||||||
|
$resolvedRoot = [IO.Path]::GetFullPath($root)
|
||||||
|
$tempRoot = [IO.Path]::GetFullPath([IO.Path]::GetTempPath()).TrimEnd('\') + '\'
|
||||||
|
if (-not $resolvedRoot.StartsWith($tempRoot, [StringComparison]::OrdinalIgnoreCase) -or
|
||||||
|
-not ([IO.Path]::GetFileName($resolvedRoot)).StartsWith('bsk-install-test-')) { throw "invalid cleanup path" }
|
||||||
|
Remove-Item -LiteralPath $resolvedRoot -Recurse -Force
|
||||||
|
}
|
||||||
+9
-3
@@ -174,16 +174,22 @@ function updateChangelog(version) {
|
|||||||
|
|
||||||
const today = new Date().toISOString().slice(0, 10);
|
const today = new Date().toISOString().slice(0, 10);
|
||||||
const escapedVer = version.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
|
const escapedVer = version.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
|
||||||
|
const versionHeading = new RegExp(`^## \\[${escapedVer}\\](?:\\s|$)`, "m");
|
||||||
|
|
||||||
// First: fill in any date-placeholder line for this version (e.g. "## [0.2.0] - 2026-09-XX")
|
// First: fill in any date-placeholder line for this version (e.g. "## [0.2.0] - 2026-09-XX")
|
||||||
const versionPlaceholder = new RegExp(`^## \\[${escapedVer}\\]\\s*-\\s*\\d{4}-\\d{2}-XX`, "m");
|
const versionPlaceholder = new RegExp(`^## \\[${escapedVer}\\]\\s*-\\s*\\d{4}-\\d{2}-XX`, "m");
|
||||||
if (versionPlaceholder.test(content)) {
|
if (versionPlaceholder.test(content)) {
|
||||||
content = content.replace(versionPlaceholder, `## [${version}] - ${today}`);
|
content = content.replace(versionPlaceholder, `## [${version}] - ${today}`);
|
||||||
} else {
|
} else if (!versionHeading.test(content)) {
|
||||||
// Otherwise: insert a new section after [Unreleased]
|
// Preserve prepared release entries; new versions go before the release history.
|
||||||
|
const heading = `## [${version}] - ${today}`;
|
||||||
const unreleased = /^## \[Unreleased\]/m;
|
const unreleased = /^## \[Unreleased\]/m;
|
||||||
if (unreleased.test(content)) {
|
if (unreleased.test(content)) {
|
||||||
content = content.replace(unreleased, `## [Unreleased]\n\n## [${version}] - ${today}`);
|
content = content.replace(unreleased, `## [Unreleased]\n\n${heading}`);
|
||||||
|
} else if (/^## /m.test(content)) {
|
||||||
|
content = content.replace(/^## /m, `${heading}\n\n## `);
|
||||||
|
} else {
|
||||||
|
content = `${content.trimEnd()}\n\n${heading}\n`;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user