@browserbasehq/orca 3.2.0-preview.3 → 3.2.0-preview.4

package/dist/cjs/tests/integration/flowLogger.spec.js

@@ -0,0 +1,714 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const test_1 = require("@playwright/test");
+const zod_1 = require("zod");
+const EventSink_js_1 = require("../../lib/v3/flowlogger/EventSink.js");
+const FlowLogger_js_1 = require("../../lib/v3/flowlogger/FlowLogger.js");
+const actHandlerUtils_js_1 = require("../../lib/v3/handlers/handlerUtils/actHandlerUtils.js");
+const v3_js_1 = require("../../lib/v3/v3.js");
+const testUtils_js_1 = require("./testUtils.js");
+const v3_config_js_1 = require("./v3.config.js");
+function encodeHtml(html) {
+    return `data:text/html,${encodeURIComponent(html)}`;
+}
+function createRecordedFlowLoggerV3(overrides = {}) {
+    const v3 = new v3_js_1.V3((0, v3_config_js_1.getV3TestConfig)(overrides));
+    const sink = new EventSink_js_1.InMemoryEventSink();
+    v3.bus.on("*", (event) => {
+        if (event instanceof FlowLogger_js_1.FlowEvent) {
+            void sink.emit(event);
+        }
+    });
+    v3.eventStore.query = (query) => sink.query({ ...query, sessionId: v3.eventStore.sessionId });
+    return v3;
+}
+async function listRecordedFlowEvents(v3) {
+    return v3.eventStore.query({});
+}
+async function captureFlowEventBaseline(v3) {
+    const events = await listRecordedFlowEvents(v3);
+    return new Set(events.map((event) => event.eventId));
+}
+async function listRecordedFlowEventsSince(v3, baseline) {
+    const events = await listRecordedFlowEvents(v3);
+    return events.filter((event) => !baseline.has(event.eventId));
+}
+function eventsOfType(events, eventType) {
+    return events.filter((event) => event.eventType === eventType);
+}
+function requireSingleEvent(events, eventType) {
+    const matches = eventsOfType(events, eventType);
+    (0, test_1.expect)(matches, `expected a single ${eventType}`).toHaveLength(1);
+    return matches[0];
+}
+function expectRootEvent(event) {
+    (0, test_1.expect)(event.eventParentIds).toEqual([]);
+}
+function expectDirectParent(child, parent) {
+    (0, test_1.expect)(child.eventParentIds).toEqual([
+        ...parent.eventParentIds,
+        parent.eventId,
+    ]);
+}
+function assertAllParentIdsResolve(events) {
+    const eventIds = new Set(events.map((event) => event.eventId));
+    for (const event of events) {
+        for (const parentId of event.eventParentIds) {
+            (0, test_1.expect)(eventIds.has(parentId), `${event.eventType} references missing parent ${parentId}`).toBe(true);
+        }
+    }
+}
+function assertSessionIds(events, sessionId) {
+    for (const event of events) {
+        (0, test_1.expect)(event.sessionId).toBe(sessionId);
+    }
+}
+function directChildrenOfType(events, parent, eventType) {
+    const expectedParentIds = [...parent.eventParentIds, parent.eventId];
+    return events.filter((event) => event.eventType === eventType &&
+        JSON.stringify(event.eventParentIds) ===
+            JSON.stringify(expectedParentIds));
+}
+function assertCompletedEnvelope(events, eventType, completedEventType = `${eventType.replace(/Event$/, "")}CompletedEvent`) {
+    const root = requireSingleEvent(events, eventType);
+    const completed = requireSingleEvent(events, completedEventType);
+    expectDirectParent(completed, root);
+    return root;
+}
+function assertNoFloatingLlmEvents(events) {
+    const llmEvents = events.filter((event) => event.eventType === "LlmRequestEvent" ||
+        event.eventType === "LlmResponseEvent");
+    const byId = new Map(events.map((event) => [event.eventId, event]));
+    (0, test_1.expect)(llmEvents.length).toBeGreaterThan(0);
+    for (const event of llmEvents) {
+        (0, test_1.expect)(event.eventParentIds.length, `${event.eventType} is floating`).toBeGreaterThan(0);
+        const lastParentId = event.eventParentIds.at(-1);
+        const lastParent = lastParentId ? byId.get(lastParentId) : undefined;
+        (0, test_1.expect)(lastParent, `${event.eventType} has no resolved parent`).toBeDefined();
+        (0, test_1.expect)(lastParent?.eventType.startsWith("Llm")).toBe(false);
+    }
+}
+function assertNoFloatingCdpEvents(events) {
+    const cdpEvents = events.filter((event) => event.eventType.startsWith("Cdp"));
+    const byId = new Map(events.map((event) => [event.eventId, event]));
+    (0, test_1.expect)(cdpEvents.length).toBeGreaterThan(0);
+    for (const event of cdpEvents) {
+        (0, test_1.expect)(event.eventParentIds.length, `${event.eventType} is floating`).toBeGreaterThan(0);
+        const lastParentId = event.eventParentIds.at(-1);
+        const lastParent = lastParentId ? byId.get(lastParentId) : undefined;
+        (0, test_1.expect)(lastParent, `${event.eventType} has no resolved parent`).toBeDefined();
+        if (event.eventType === "CdpCallEvent") {
+            (0, test_1.expect)(lastParent?.eventType.startsWith("Cdp")).toBe(false);
+        }
+        else {
+            (0, test_1.expect)(lastParent?.eventType).toBe("CdpCallEvent");
+        }
+    }
+}
+function assertDirectRootCdpEvents(events, sessionId) {
+    const call = requireSingleEvent(events, "CdpCallEvent");
+    const responseTypes = ["CdpResponseEvent", "CdpResponseErrorEvent"];
+    const response = events.find((event) => responseTypes.includes(event.eventType));
+    (0, test_1.expect)(response, "expected a direct CDP response event").toBeDefined();
+    assertSessionIds(events, sessionId);
+    expectRootEvent(call);
+    (0, test_1.expect)(response?.eventParentIds).toEqual([call.eventId]);
+}
+function sortCountRecord(input) {
+    return Object.fromEntries(Object.entries(input).sort(([left], [right]) => left.localeCompare(right)));
+}
+function assertNonCdpEventCounts(events, expected) {
+    const actual = events.reduce((counts, event) => {
+        if (event.eventType.startsWith("Cdp")) {
+            return counts;
+        }
+        counts[event.eventType] = (counts[event.eventType] ?? 0) + 1;
+        return counts;
+    }, {});
+    (0, test_1.expect)(sortCountRecord(actual)).toEqual(sortCountRecord(expected));
+}
+test_1.test.describe("flow logger integration", () => {
+    test_1.test.describe.configure({ mode: "serial" });
+    (0, test_1.test)("act emits a rooted tree with nested understudy, llm, and cdp events", async () => {
+        const buttonText = "Flow Logger Act Button";
+        const llmClient = (0, testUtils_js_1.createScriptedAisdkTestLlmClient)({
+            jsonResponses: {
+                act: (options) => ({
+                    elementId: (0, testUtils_js_1.findLastEncodedId)(options),
+                    description: `click ${buttonText}`,
+                    method: "click",
+                    arguments: [],
+                    twoStep: false,
+                }),
+            },
+        });
+        const v3 = createRecordedFlowLoggerV3({
+            llmClient,
+        });
+        await v3.init();
+        try {
+            const page = v3.context.pages()[0];
+            await page.goto(encodeHtml(`
+          <!doctype html>
+          <html>
+            <body>
+              <button
+                id="act-target"
+                onclick="document.body.dataset.clicked='true'"
+              >
+                ${buttonText}
+              </button>
+            </body>
+          </html>
+        `));
+            const baseline = await captureFlowEventBaseline(v3);
+            const result = await v3.act(`Click the ${buttonText}`);
+            const events = await listRecordedFlowEventsSince(v3, baseline);
+            (0, test_1.expect)(result.success).toBe(true);
+            (0, test_1.expect)(await page.evaluate(() => document.body.dataset.clicked ?? "")).toBe("true");
+            const root = requireSingleEvent(events, "StagehandActEvent");
+            const completed = requireSingleEvent(events, "StagehandActCompletedEvent");
+            const llmRequest = requireSingleEvent(events, "LlmRequestEvent");
+            const llmResponse = requireSingleEvent(events, "LlmResponseEvent");
+            const understudy = requireSingleEvent(events, "UnderstudyClickEvent");
+            const understudyCompleted = requireSingleEvent(events, "UnderstudyClickCompletedEvent");
+            assertAllParentIdsResolve(events);
+            assertNonCdpEventCounts(events, {
+                LlmRequestEvent: 1,
+                LlmResponseEvent: 1,
+                StagehandActCompletedEvent: 1,
+                StagehandActEvent: 1,
+                UnderstudyClickCompletedEvent: 1,
+                UnderstudyClickEvent: 1,
+            });
+            assertSessionIds(events, v3.flowLoggerContext.sessionId);
+            expectRootEvent(root);
+            expectDirectParent(completed, root);
+            (0, test_1.expect)(llmRequest.eventParentIds).toEqual([root.eventId]);
+            (0, test_1.expect)(llmResponse.eventParentIds).toEqual([root.eventId]);
+            (0, test_1.expect)(understudy.eventParentIds).toEqual([root.eventId]);
+            expectDirectParent(understudyCompleted, understudy);
+            assertNoFloatingLlmEvents(events);
+            assertNoFloatingCdpEvents(events);
+        }
+        finally {
+            await (0, testUtils_js_1.closeV3)(v3);
+        }
+    });
+    (0, test_1.test)("observe and extract emit rooted trees with complete nested llm and cdp events", async () => {
+        const observeText = "Flow Logger Observe Button";
+        const extractTitle = "Flow Logger Extract Title";
+        const llmClient = (0, testUtils_js_1.createScriptedAisdkTestLlmClient)({
+            jsonResponses: {
+                Observation: (options) => ({
+                    elements: [
+                        {
+                            elementId: (0, testUtils_js_1.findLastEncodedId)(options),
+                            description: observeText,
+                            method: "click",
+                            arguments: [],
+                        },
+                    ],
+                }),
+                Extraction: {
+                    title: extractTitle,
+                },
+                Metadata: {
+                    completed: true,
+                    progress: "done",
+                },
+            },
+        });
+        const v3 = createRecordedFlowLoggerV3({
+            llmClient,
+        });
+        await v3.init();
+        try {
+            const page = v3.context.pages()[0];
+            await page.goto(encodeHtml(`
+          <!doctype html>
+          <html>
+            <body>
+              <button id="observe-target">${observeText}</button>
+              <h1>${extractTitle}</h1>
+            </body>
+          </html>
+        `));
+            const observeBaseline = await captureFlowEventBaseline(v3);
+            const observeResult = await v3.observe(`Find the ${observeText}`);
+            (0, test_1.expect)(observeResult).toHaveLength(1);
+            (0, test_1.expect)(observeResult[0].method).toBe("click");
+            const observeEvents = await listRecordedFlowEventsSince(v3, observeBaseline);
+            const observeRoot = requireSingleEvent(observeEvents, "StagehandObserveEvent");
+            const observeCompleted = requireSingleEvent(observeEvents, "StagehandObserveCompletedEvent");
+            const observeLlmRequests = eventsOfType(observeEvents, "LlmRequestEvent");
+            const observeLlmResponses = eventsOfType(observeEvents, "LlmResponseEvent");
+            assertAllParentIdsResolve(observeEvents);
+            assertNonCdpEventCounts(observeEvents, {
+                LlmRequestEvent: 1,
+                LlmResponseEvent: 1,
+                StagehandObserveCompletedEvent: 1,
+                StagehandObserveEvent: 1,
+            });
+            assertSessionIds(observeEvents, v3.flowLoggerContext.sessionId);
+            expectRootEvent(observeRoot);
+            expectDirectParent(observeCompleted, observeRoot);
+            (0, test_1.expect)(observeLlmRequests).toHaveLength(1);
+            (0, test_1.expect)(observeLlmResponses).toHaveLength(1);
+            (0, test_1.expect)(observeLlmRequests[0].eventParentIds).toEqual([
+                observeRoot.eventId,
+            ]);
+            (0, test_1.expect)(observeLlmResponses[0].eventParentIds).toEqual([
+                observeRoot.eventId,
+            ]);
+            assertNoFloatingLlmEvents(observeEvents);
+            assertNoFloatingCdpEvents(observeEvents);
+            const extractBaseline = await captureFlowEventBaseline(v3);
+            const extractResult = await v3.extract("Extract the title", zod_1.z.object({ title: zod_1.z.string() }));
+            (0, test_1.expect)(extractResult).toEqual({ title: extractTitle });
+            const extractEvents = await listRecordedFlowEventsSince(v3, extractBaseline);
+            const extractRoot = requireSingleEvent(extractEvents, "StagehandExtractEvent");
+            const extractCompleted = requireSingleEvent(extractEvents, "StagehandExtractCompletedEvent");
+            const extractLlmRequests = eventsOfType(extractEvents, "LlmRequestEvent");
+            const extractLlmResponses = eventsOfType(extractEvents, "LlmResponseEvent");
+            assertAllParentIdsResolve(extractEvents);
+            assertNonCdpEventCounts(extractEvents, {
+                LlmRequestEvent: 2,
+                LlmResponseEvent: 2,
+                StagehandExtractCompletedEvent: 1,
+                StagehandExtractEvent: 1,
+            });
+            assertSessionIds(extractEvents, v3.flowLoggerContext.sessionId);
+            expectRootEvent(extractRoot);
+            expectDirectParent(extractCompleted, extractRoot);
+            (0, test_1.expect)(extractLlmRequests).toHaveLength(2);
+            (0, test_1.expect)(extractLlmResponses).toHaveLength(2);
+            for (const event of [...extractLlmRequests, ...extractLlmResponses]) {
+                (0, test_1.expect)(event.eventParentIds).toEqual([extractRoot.eventId]);
+            }
+            assertNoFloatingLlmEvents(extractEvents);
+            assertNoFloatingCdpEvents(extractEvents);
+        }
+        finally {
+            await (0, testUtils_js_1.closeV3)(v3);
+        }
+    });
+    (0, test_1.test)("agent.execute -> act carries the full agent -> stagehand -> understudy -> cdp + llm hierarchy", async () => {
+        const buttonText = "Agent Act Button";
+        const llmClient = (0, testUtils_js_1.createScriptedAisdkTestLlmClient)({
+            jsonResponses: {
+                act: (options) => ({
+                    elementId: (0, testUtils_js_1.findLastEncodedId)(options),
+                    description: `click ${buttonText}`,
+                    method: "click",
+                    arguments: [],
+                    twoStep: false,
+                }),
+            },
+            generateResponses: [
+                (0, testUtils_js_1.toolCallResponse)("act", { action: `click the ${buttonText}` }, "act-1"),
+                (0, testUtils_js_1.doneToolResponse)("finished", true, "done-1"),
+            ],
+        });
+        const v3 = createRecordedFlowLoggerV3({
+            experimental: true,
+            llmClient,
+        });
+        await v3.init();
+        try {
+            const page = v3.context.pages()[0];
+            await page.goto(encodeHtml(`
+          <!doctype html>
+          <html>
+            <body>
+              <button
+                id="agent-act-target"
+                onclick="document.body.dataset.agentAct='true'"
+              >
+                ${buttonText}
+              </button>
+            </body>
+          </html>
+        `));
+            const baseline = await captureFlowEventBaseline(v3);
+            const result = await v3.agent().execute({
+                instruction: `Click the ${buttonText} and finish.`,
+                maxSteps: 2,
+            });
+            const events = await listRecordedFlowEventsSince(v3, baseline);
+            (0, test_1.expect)(result.success).toBe(true);
+            (0, test_1.expect)(await page.evaluate(() => document.body.dataset.agentAct ?? "")).toBe("true");
+            const agentRoot = assertCompletedEnvelope(events, "AgentExecuteEvent");
+            const actRoot = requireSingleEvent(events, "StagehandActEvent");
+            const actCompleted = requireSingleEvent(events, "StagehandActCompletedEvent");
+            const understudy = requireSingleEvent(events, "UnderstudyClickEvent");
+            const understudyCompleted = requireSingleEvent(events, "UnderstudyClickCompletedEvent");
+            assertAllParentIdsResolve(events);
+            assertNonCdpEventCounts(events, {
+                AgentExecuteCompletedEvent: 1,
+                AgentExecuteEvent: 1,
+                LlmRequestEvent: 3,
+                LlmResponseEvent: 3,
+                StagehandActCompletedEvent: 1,
+                StagehandActEvent: 1,
+                UnderstudyClickCompletedEvent: 1,
+                UnderstudyClickEvent: 1,
+            });
+            assertSessionIds(events, v3.flowLoggerContext.sessionId);
+            expectRootEvent(agentRoot);
+            (0, test_1.expect)(actRoot.eventParentIds).toEqual([agentRoot.eventId]);
+            expectDirectParent(actCompleted, actRoot);
+            expectDirectParent(understudy, actRoot);
+            expectDirectParent(understudyCompleted, understudy);
+            (0, test_1.expect)(directChildrenOfType(events, agentRoot, "LlmRequestEvent")).toHaveLength(2);
+            (0, test_1.expect)(directChildrenOfType(events, agentRoot, "LlmResponseEvent")).toHaveLength(2);
+            (0, test_1.expect)(directChildrenOfType(events, actRoot, "LlmRequestEvent")).toHaveLength(1);
+            (0, test_1.expect)(directChildrenOfType(events, actRoot, "LlmResponseEvent")).toHaveLength(1);
+            assertNoFloatingLlmEvents(events);
+            assertNoFloatingCdpEvents(events);
+        }
+        finally {
+            await (0, testUtils_js_1.closeV3)(v3);
+        }
+    });
+    (0, test_1.test)("agent.execute -> fillForm carries the observe -> act -> understudy hierarchy with no missing layers", async () => {
+        const llmClient = (0, testUtils_js_1.createScriptedAisdkTestLlmClient)({
+            jsonResponses: {
+                Observation: (options) => ({
+                    elements: [
+                        {
+                            elementId: (0, testUtils_js_1.findLastEncodedId)(options),
+                            description: "name input",
+                            method: "fill",
+                            arguments: ["hello"],
+                        },
+                    ],
+                }),
+            },
+            generateResponses: [
+                (0, testUtils_js_1.toolCallResponse)("fillForm", {
+                    fields: [
+                        {
+                            action: "type hello into the name field",
+                            value: "hello",
+                        },
+                    ],
+                }, "fillform-1"),
+                (0, testUtils_js_1.doneToolResponse)("finished", true, "done-1"),
+            ],
+        });
+        const v3 = createRecordedFlowLoggerV3({
+            experimental: true,
+            llmClient,
+        });
+        await v3.init();
+        try {
+            const page = v3.context.pages()[0];
+            await page.goto(encodeHtml(`
+          <!doctype html>
+          <html>
+            <body>
+              <input id="name" />
+            </body>
+          </html>
+        `));
+            const baseline = await captureFlowEventBaseline(v3);
+            const result = await v3.agent().execute({
+                instruction: "Fill the form and finish.",
+                maxSteps: 2,
+            });
+            const events = await listRecordedFlowEventsSince(v3, baseline);
+            (0, test_1.expect)(result.success).toBe(true);
+            (0, test_1.expect)(await page.locator("#name").inputValue()).toBe("hello");
+            const agentRoot = assertCompletedEnvelope(events, "AgentExecuteEvent");
+            const observeRoot = requireSingleEvent(events, "StagehandObserveEvent");
+            const observeCompleted = requireSingleEvent(events, "StagehandObserveCompletedEvent");
+            const actRoot = requireSingleEvent(events, "StagehandActEvent");
+            const actCompleted = requireSingleEvent(events, "StagehandActCompletedEvent");
+            const understudyFill = requireSingleEvent(events, "UnderstudyFillEvent");
+            const understudyFillCompleted = requireSingleEvent(events, "UnderstudyFillCompletedEvent");
+            assertAllParentIdsResolve(events);
+            assertNonCdpEventCounts(events, {
+                AgentExecuteCompletedEvent: 1,
+                AgentExecuteEvent: 1,
+                LlmRequestEvent: 3,
+                LlmResponseEvent: 3,
+                StagehandActCompletedEvent: 1,
+                StagehandActEvent: 1,
+                StagehandObserveCompletedEvent: 1,
+                StagehandObserveEvent: 1,
+                UnderstudyFillCompletedEvent: 1,
+                UnderstudyFillEvent: 1,
+            });
+            assertSessionIds(events, v3.flowLoggerContext.sessionId);
+            expectRootEvent(agentRoot);
+            (0, test_1.expect)(observeRoot.eventParentIds).toEqual([agentRoot.eventId]);
+            expectDirectParent(observeCompleted, observeRoot);
+            (0, test_1.expect)(actRoot.eventParentIds).toEqual([agentRoot.eventId]);
+            expectDirectParent(actCompleted, actRoot);
+            expectDirectParent(understudyFill, actRoot);
+            expectDirectParent(understudyFillCompleted, understudyFill);
+            (0, test_1.expect)(directChildrenOfType(events, observeRoot, "LlmRequestEvent")).toHaveLength(1);
+            (0, test_1.expect)(directChildrenOfType(events, observeRoot, "LlmResponseEvent")).toHaveLength(1);
+            (0, test_1.expect)(directChildrenOfType(events, agentRoot, "LlmRequestEvent")).toHaveLength(2);
+            (0, test_1.expect)(directChildrenOfType(events, agentRoot, "LlmResponseEvent")).toHaveLength(2);
+            (0, test_1.expect)(directChildrenOfType(events, actRoot, "LlmRequestEvent")).toHaveLength(0);
+            (0, test_1.expect)(directChildrenOfType(events, actRoot, "LlmResponseEvent")).toHaveLength(0);
+            assertNoFloatingLlmEvents(events);
+            assertNoFloatingCdpEvents(events);
+        }
+        finally {
+            await (0, testUtils_js_1.closeV3)(v3);
+        }
+    });
+    (0, test_1.test)("agent.execute -> extract carries the full agent -> extract -> cdp + llm hierarchy", async () => {
+        const extractTitle = "Agent Extract Title";
+        const llmClient = (0, testUtils_js_1.createScriptedAisdkTestLlmClient)({
+            jsonResponses: {
+                Extraction: {
+                    title: extractTitle,
+                },
+                Metadata: {
+                    completed: true,
+                    progress: "done",
+                },
+            },
+            generateResponses: [
+                (0, testUtils_js_1.toolCallResponse)("extract", {
+                    instruction: "extract the title",
+                    schema: {
+                        type: "object",
+                        properties: {
+                            title: { type: "string" },
+                        },
+                    },
+                }, "extract-1"),
+                (0, testUtils_js_1.doneToolResponse)("finished", true, "done-1"),
+            ],
+        });
+        const v3 = createRecordedFlowLoggerV3({
+            experimental: true,
+            llmClient,
+        });
+        await v3.init();
+        try {
+            const page = v3.context.pages()[0];
+            await page.goto(encodeHtml(`
+          <!doctype html>
+          <html>
+            <body>
+              <h1>${extractTitle}</h1>
+            </body>
+          </html>
+        `));
+            const baseline = await captureFlowEventBaseline(v3);
+            const result = await v3.agent().execute({
+                instruction: "Extract the title and finish.",
+                maxSteps: 2,
+            });
+            (0, test_1.expect)(result.success).toBe(true);
+            const events = await listRecordedFlowEventsSince(v3, baseline);
+            const agentRoot = assertCompletedEnvelope(events, "AgentExecuteEvent");
+            const extractRoot = requireSingleEvent(events, "StagehandExtractEvent");
+            const extractCompleted = requireSingleEvent(events, "StagehandExtractCompletedEvent");
+            assertAllParentIdsResolve(events);
+            assertNonCdpEventCounts(events, {
+                AgentExecuteCompletedEvent: 1,
+                AgentExecuteEvent: 1,
+                LlmRequestEvent: 4,
+                LlmResponseEvent: 4,
+                StagehandExtractCompletedEvent: 1,
+                StagehandExtractEvent: 1,
+            });
+            assertSessionIds(events, v3.flowLoggerContext.sessionId);
+            expectRootEvent(agentRoot);
+            (0, test_1.expect)(extractRoot.eventParentIds).toEqual([agentRoot.eventId]);
+            expectDirectParent(extractCompleted, extractRoot);
+            (0, test_1.expect)(directChildrenOfType(events, agentRoot, "LlmRequestEvent")).toHaveLength(2);
+            (0, test_1.expect)(directChildrenOfType(events, agentRoot, "LlmResponseEvent")).toHaveLength(2);
+            (0, test_1.expect)(directChildrenOfType(events, extractRoot, "LlmRequestEvent")).toHaveLength(2);
+            (0, test_1.expect)(directChildrenOfType(events, extractRoot, "LlmResponseEvent")).toHaveLength(2);
+            assertNoFloatingLlmEvents(events);
+            assertNoFloatingCdpEvents(events);
+        }
+        finally {
+            await (0, testUtils_js_1.closeV3)(v3);
+        }
+    });
+    (0, test_1.test)("agent.execute nests page events under the agent root and direct page calls root themselves", async () => {
+        const agentPageUrl = encodeHtml(`
+      <!doctype html>
+      <html>
+        <body>
+          <h1>Agent Flow Logger Page</h1>
+        </body>
+      </html>
+    `);
+        const agentLlmClient = (0, testUtils_js_1.createScriptedAisdkTestLlmClient)({
+            generateResponses: [
+                (0, testUtils_js_1.toolCallResponse)("goto", { url: agentPageUrl }, "goto-1"),
+                (0, testUtils_js_1.toolCallResponse)("screenshot", {}, "screenshot-1"),
+                (0, testUtils_js_1.doneToolResponse)("finished", true, "done-1"),
+            ],
+        });
+        const agentV3 = createRecordedFlowLoggerV3({
+            experimental: true,
+            llmClient: agentLlmClient,
+        });
+        await agentV3.init();
+        try {
+            const baseline = await captureFlowEventBaseline(agentV3);
+            const result = await agentV3.agent().execute({
+                instruction: "Go to the test page, take a screenshot, and finish.",
+                maxSteps: 3,
+            });
+            (0, test_1.expect)(result.success).toBe(true);
+            (0, test_1.expect)(result.completed).toBe(true);
+            const events = await listRecordedFlowEventsSince(agentV3, baseline);
+            const root = assertCompletedEnvelope(events, "AgentExecuteEvent");
+            const pageGoto = requireSingleEvent(events, "PageGotoEvent");
+            const pageGotoCompleted = requireSingleEvent(events, "PageGotoCompletedEvent");
+            const pageScreenshot = requireSingleEvent(events, "PageScreenshotEvent");
+            const pageScreenshotCompleted = requireSingleEvent(events, "PageScreenshotCompletedEvent");
+            const llmRequests = eventsOfType(events, "LlmRequestEvent");
+            const llmResponses = eventsOfType(events, "LlmResponseEvent");
+            assertAllParentIdsResolve(events);
+            assertNonCdpEventCounts(events, {
+                AgentExecuteCompletedEvent: 1,
+                AgentExecuteEvent: 1,
+                LlmRequestEvent: 3,
+                LlmResponseEvent: 3,
+                PageGotoCompletedEvent: 1,
+                PageGotoEvent: 1,
+                PageScreenshotCompletedEvent: 1,
+                PageScreenshotEvent: 1,
+            });
+            assertSessionIds(events, agentV3.flowLoggerContext.sessionId);
+            expectRootEvent(root);
+            (0, test_1.expect)(pageGoto.eventParentIds).toEqual([root.eventId]);
+            expectDirectParent(pageGotoCompleted, pageGoto);
+            (0, test_1.expect)(pageScreenshot.eventParentIds).toEqual([root.eventId]);
+            expectDirectParent(pageScreenshotCompleted, pageScreenshot);
+            (0, test_1.expect)(llmRequests).toHaveLength(3);
+            (0, test_1.expect)(llmResponses).toHaveLength(3);
+            for (const event of [...llmRequests, ...llmResponses]) {
+                (0, test_1.expect)(event.eventParentIds).toEqual([root.eventId]);
+            }
+            assertNoFloatingLlmEvents(events);
+            assertNoFloatingCdpEvents(events);
+        }
+        finally {
+            await (0, testUtils_js_1.closeV3)(agentV3);
+        }
+        const directV3 = createRecordedFlowLoggerV3();
+        await directV3.init();
+        try {
+            const page = directV3.context.pages()[0];
+            const baseline = await captureFlowEventBaseline(directV3);
+            await page.goto(agentPageUrl);
+            await page.screenshot({ fullPage: false });
+            const events = await listRecordedFlowEventsSince(directV3, baseline);
+            const pageGoto = requireSingleEvent(events, "PageGotoEvent");
+            const pageGotoCompleted = requireSingleEvent(events, "PageGotoCompletedEvent");
+            const pageScreenshot = requireSingleEvent(events, "PageScreenshotEvent");
+            const pageScreenshotCompleted = requireSingleEvent(events, "PageScreenshotCompletedEvent");
+            assertAllParentIdsResolve(events);
+            assertNonCdpEventCounts(events, {
+                PageGotoCompletedEvent: 1,
+                PageGotoEvent: 1,
+                PageScreenshotCompletedEvent: 1,
+                PageScreenshotEvent: 1,
+            });
+            assertSessionIds(events, directV3.flowLoggerContext.sessionId);
+            expectRootEvent(pageGoto);
+            expectDirectParent(pageGotoCompleted, pageGoto);
+            expectRootEvent(pageScreenshot);
+            expectDirectParent(pageScreenshotCompleted, pageScreenshot);
+            (0, test_1.expect)(eventsOfType(events, "LlmRequestEvent")).toHaveLength(0);
+            (0, test_1.expect)(eventsOfType(events, "LlmResponseEvent")).toHaveLength(0);
+            assertNoFloatingCdpEvents(events);
+        }
+        finally {
+            await (0, testUtils_js_1.closeV3)(directV3);
+        }
+    });
+    (0, test_1.test)("direct page methods, direct understudy calls, and direct sendCDP all attach complete event trees to the session", async () => {
+        const v3 = createRecordedFlowLoggerV3();
+        await v3.init();
+        try {
+            const page = v3.context.pages()[0];
+            await page.goto(encodeHtml(`
+          <!doctype html>
+          <html>
+            <body>
+              <button
+                id="direct-click"
+                onclick="document.body.dataset.directClick='true'"
+              >
+                Direct Click
+              </button>
+              <div id="ready">ready</div>
+            </body>
+          </html>
+        `));
+            let baseline = await captureFlowEventBaseline(v3);
+            await page.evaluate(() => document.getElementById("ready")?.textContent);
+            let events = await listRecordedFlowEventsSince(v3, baseline);
+            let root = assertCompletedEnvelope(events, "PageEvaluateEvent");
+            assertAllParentIdsResolve(events);
+            assertNonCdpEventCounts(events, {
+                PageEvaluateCompletedEvent: 1,
+                PageEvaluateEvent: 1,
+            });
+            assertSessionIds(events, v3.flowLoggerContext.sessionId);
+            expectRootEvent(root);
+            (0, test_1.expect)(eventsOfType(events, "LlmRequestEvent")).toHaveLength(0);
+            (0, test_1.expect)(eventsOfType(events, "LlmResponseEvent")).toHaveLength(0);
+            assertNoFloatingCdpEvents(events);
+            baseline = await captureFlowEventBaseline(v3);
+            await page.snapshot();
+            events = await listRecordedFlowEventsSince(v3, baseline);
+            root = assertCompletedEnvelope(events, "PageSnapshotEvent");
+            assertAllParentIdsResolve(events);
+            assertNonCdpEventCounts(events, {
+                PageSnapshotCompletedEvent: 1,
+                PageSnapshotEvent: 1,
+            });
+            assertSessionIds(events, v3.flowLoggerContext.sessionId);
+            expectRootEvent(root);
+            (0, test_1.expect)(eventsOfType(events, "LlmRequestEvent")).toHaveLength(0);
+            (0, test_1.expect)(eventsOfType(events, "LlmResponseEvent")).toHaveLength(0);
+            assertNoFloatingCdpEvents(events);
+            baseline = await captureFlowEventBaseline(v3);
+            await (0, actHandlerUtils_js_1.performUnderstudyMethod)(page, page.mainFrame(), "click", "/html/body/button", [], 30_000);
+            events = await listRecordedFlowEventsSince(v3, baseline);
+            root = assertCompletedEnvelope(events, "UnderstudyClickEvent");
+            assertAllParentIdsResolve(events);
+            assertNonCdpEventCounts(events, {
+                UnderstudyClickCompletedEvent: 1,
+                UnderstudyClickEvent: 1,
+            });
+            assertSessionIds(events, v3.flowLoggerContext.sessionId);
+            expectRootEvent(root);
+            (0, test_1.expect)(eventsOfType(events, "LlmRequestEvent")).toHaveLength(0);
+            (0, test_1.expect)(eventsOfType(events, "LlmResponseEvent")).toHaveLength(0);
+            assertNoFloatingCdpEvents(events);
+            (0, test_1.expect)(await page.evaluate(() => document.body.dataset.directClick ?? "")).toBe("true");
+            baseline = await captureFlowEventBaseline(v3);
+            const cdpResult = await page.sendCDP("Runtime.evaluate", {
+                expression: "2 + 2",
+                returnByValue: true,
+            });
+            events = await listRecordedFlowEventsSince(v3, baseline);
+            (0, test_1.expect)(cdpResult.result?.value).toBe(4);
+            (0, test_1.expect)(eventsOfType(events, "LlmRequestEvent")).toHaveLength(0);
+            (0, test_1.expect)(eventsOfType(events, "LlmResponseEvent")).toHaveLength(0);
+            assertAllParentIdsResolve(events);
+            assertDirectRootCdpEvents(events, v3.flowLoggerContext.sessionId);
+        }
+        finally {
+            await (0, testUtils_js_1.closeV3)(v3);
+        }
+    });
+});
+//# sourceMappingURL=flowLogger.spec.js.map