@itmetsam/samurai-framework 0.7.1 → 0.9.0

package/dist/browser/session-capabilities.d.ts

@@ -0,0 +1,12 @@
+/**
+ * Sent with session.new (Firefox) or as capabilities of the chromedriver session (Chrome). With "ignore" the browser
+ * leaves a JavaScript dialog open and reports it (`browsingContext.userPromptOpened`), so the framework decides how
+ * to answer instead of the browser.
+ */
+export declare const SESSION_CAPABILITIES: {
+    alwaysMatch: {
+        unhandledPromptBehavior: {
+            default: string;
+        };
+    };
+};

package/dist/browser/session-capabilities.js

@@ -0,0 +1,8 @@
+/**
+ * Sent with session.new (Firefox) or as capabilities of the chromedriver session (Chrome). With "ignore" the browser
+ * leaves a JavaScript dialog open and reports it (`browsingContext.userPromptOpened`), so the framework decides how
+ * to answer instead of the browser.
+ */
+export const SESSION_CAPABILITIES = {
+    alwaysMatch: { unhandledPromptBehavior: { default: "ignore" } },
+};

package/dist/browsers/index.d.ts

@@ -1,6 +1,6 @@
 export { browsersCacheDir } from "./cache-dir.js";
 export type { CachedBuild, Downloader } from "./downloader.js";
-export { ENV_PATH, type Override } from "./overrides.js";
+export { ENV_CHROMEDRIVER_PATH, ENV_PATH, type Override } from "./overrides.js";
 export { LAUNCHABLE, MANAGED_BROWSERS, PINNED, isManagedBrowser, type ManagedBrowser, } from "./pins.js";
 export { browserStatus, projectBrowser, projectExecutable, resolveBrowser, resolveExecutable, type ResolvedBrowser, } from "./resolve.js";
-export { BrowserNotInstalledError, installBrowser, listInstalled, managedBuildDir, managedExecutable, uninstallBrowser, type BrowserStatus, type InstalledBuild, type StoreOptions, } from "./store.js";
+export { BrowserNotInstalledError, installBrowser, listInstalled, managedBuildDir, managedChromedriver, managedExecutable, uninstallBrowser, type BrowserStatus, type InstalledBuild, type StoreOptions, } from "./store.js";

package/dist/browsers/index.js

@@ -1,5 +1,5 @@
 export { browsersCacheDir } from "./cache-dir.js";
-export { ENV_PATH } from "./overrides.js";
+export { ENV_CHROMEDRIVER_PATH, ENV_PATH } from "./overrides.js";
 export { LAUNCHABLE, MANAGED_BROWSERS, PINNED, isManagedBrowser, } from "./pins.js";
 export { browserStatus, projectBrowser, projectExecutable, resolveBrowser, resolveExecutable, } from "./resolve.js";
-export { BrowserNotInstalledError, installBrowser, listInstalled, managedBuildDir, managedExecutable, uninstallBrowser, } from "./store.js";
+export { BrowserNotInstalledError, installBrowser, listInstalled, managedBuildDir, managedChromedriver, managedExecutable, uninstallBrowser, } from "./store.js";

package/dist/browsers/overrides.d.ts

@@ -12,6 +12,8 @@ export interface OverrideSources {
     /** What relative `browserPaths` resolve from */
     projectDir?: string;
 }
+/** Chrome is driven through a chromedriver of the same major version; this points a launch at another one */
+export declare const ENV_CHROMEDRIVER_PATH = "SAMURAI_CHROMEDRIVER_PATH";
 export declare const ENV_PATH: Record<ManagedBrowser, string>;
 /** The env variable, else the config's `browserPaths`; undefined: use the managed build */
 export declare function overrideOf(name: ManagedBrowser, { env, browserPaths, projectDir, }?: OverrideSources): Override | undefined;

package/dist/browsers/overrides.js

@@ -1,4 +1,6 @@
 import path from "node:path";
+/** Chrome is driven through a chromedriver of the same major version; this points a launch at another one */
+export const ENV_CHROMEDRIVER_PATH = "SAMURAI_CHROMEDRIVER_PATH";
 export const ENV_PATH = {
     firefox: "SAMURAI_FIREFOX_PATH",
     chrome: "SAMURAI_CHROME_PATH",

package/dist/browsers/pins.d.ts

@@ -11,6 +11,6 @@ export declare const PINNED: {
 };
 export type ManagedBrowser = keyof typeof PINNED;
 export declare const MANAGED_BROWSERS: ManagedBrowser[];
-/** The managed browsers the framework can launch; Chrome joins when it can drive it */
+/** The managed browsers the framework can launch (Chrome through its chromedriver) */
 export declare const LAUNCHABLE: readonly ManagedBrowser[];
 export declare function isManagedBrowser(name: string): name is ManagedBrowser;

package/dist/browsers/pins.js

@@ -7,8 +7,8 @@ export const PINNED = {
     },
 };
 export const MANAGED_BROWSERS = Object.keys(PINNED);
-/** The managed browsers the framework can launch; Chrome joins when it can drive it */
-export const LAUNCHABLE = ["firefox"];
+/** The managed browsers the framework can launch (Chrome through its chromedriver) */
+export const LAUNCHABLE = ["firefox", "chrome"];
 export function isManagedBrowser(name) {
     return Object.prototype.hasOwnProperty.call(PINNED, name);
 }

package/dist/browsers/resolve.d.ts

@@ -9,6 +9,8 @@ export interface ResolvedBrowser {
     label: string;
     /** The managed build's folder; undefined when an env or config path is used instead */
     buildDir?: string;
+    /** Chrome only: the chromedriver that starts it and speaks BiDi for it */
+    driverPath?: string;
 }
 /** The browser a launch uses: the env path, else the config's `browserPaths`, else the pinned build. Never downloads */
 export declare function resolveBrowser(name: ManagedBrowser, sources?: OverrideSources & StoreOptions): ResolvedBrowser;

package/dist/browsers/resolve.js

@@ -1,17 +1,19 @@
 import { existsSync } from "node:fs";
 import { projectConfig, projectDir, readConfig } from "../config/config.js";
 import logger from "../logger/index.js";
-import { ENV_PATH, overrideOf } from "./overrides.js";
+import { ENV_CHROMEDRIVER_PATH, ENV_PATH, overrideOf, } from "./overrides.js";
 import { MANAGED_BROWSERS, PINNED } from "./pins.js";
-import { managedBuildDir, managedExecutable, statusOf, } from "./store.js";
+import { managedBuildDir, managedChromedriver, managedExecutable, statusOf, } from "./store.js";
 /** The browser a launch uses: the env path, else the config's `browserPaths`, else the pinned build. Never downloads */
 export function resolveBrowser(name, sources = {}) {
+    const driverPath = name === "chrome" ? resolveChromedriver(sources) : undefined;
     const override = overrideOf(name, sources);
     if (!override)
         return {
             executablePath: managedExecutable(name, sources),
             label: PINNED[name].label,
             buildDir: managedBuildDir(name, sources),
+            ...(driverPath && { driverPath }),
         };
     if (!existsSync(override.path))
         throw new Error(override.from === "env"
@@ -20,8 +22,18 @@ export function resolveBrowser(name, sources = {}) {
     return {
         executablePath: override.path,
         label: name.charAt(0).toUpperCase() + name.slice(1),
+        ...(driverPath && { driverPath }),
     };
 }
+/** `SAMURAI_CHROMEDRIVER_PATH` (which must exist), else the chromedriver installed with the pinned Chrome */
+function resolveChromedriver(sources) {
+    const fromEnv = (sources.env ?? process.env)[ENV_CHROMEDRIVER_PATH];
+    if (!fromEnv)
+        return managedChromedriver(sources);
+    if (!existsSync(fromEnv))
+        throw new Error(`${ENV_CHROMEDRIVER_PATH} points to a missing file: ${fromEnv}`);
+    return fromEnv;
+}
 /** The binary a launch uses; see `resolveBrowser` */
 export function resolveExecutable(name, sources = {}) {
     return resolveBrowser(name, sources).executablePath;

package/dist/browsers/store.d.ts

@@ -44,6 +44,8 @@ export declare function installBrowser(name: ManagedBrowser, options?: StoreOpti
 export declare function statusOf(name: ManagedBrowser, options?: StoreOptions & OverrideSources): BrowserStatus;
 /** The pinned build's executable; throws BrowserNotInstalledError when it isn't complete */
 export declare function managedExecutable(name: ManagedBrowser, options?: StoreOptions): string;
+/** The chromedriver installed with the pinned Chrome; throws BrowserNotInstalledError when Chrome's install isn't complete */
+export declare function managedChromedriver(options?: StoreOptions): string;
 /** The folder the pinned build of `name` is, or would be, installed in */
 export declare function managedBuildDir(name: ManagedBrowser, options?: StoreOptions): string;
 /** Removes a build (default: the pinned one); Chrome takes its chromedriver along */

package/dist/browsers/store.js

@@ -127,6 +127,14 @@ export function managedExecutable(name, options = {}) {
         throw new BrowserNotInstalledError(name, status.label);
     return status.executablePath;
 }
+/** The chromedriver installed with the pinned Chrome; throws BrowserNotInstalledError when Chrome's install isn't complete */
+export function managedChromedriver(options = {}) {
+    const { cacheDir, downloader } = store(options);
+    const status = statusOf("chrome", { ...options, env: {} });
+    if (status.state !== "installed")
+        throw new BrowserNotInstalledError("chrome", status.label);
+    return downloader.executablePath(cacheDir, "chromedriver", PINNED.chrome.buildId);
+}
 /** The folder the pinned build of `name` is, or would be, installed in */
 export function managedBuildDir(name, options = {}) {
     const { cacheDir, downloader } = store(options);

package/dist/cli/main.d.ts

@@ -1,4 +1,4 @@
-export declare const USAGE = "samurai: browser tests over WebDriver BiDi\n\nUsage:\n  samurai run [options]       Run the tests (the default command)\n  samurai list [options]      List the tests without running them\n  samurai record <spec>       Open a browser and record what you do into a spec file\n  samurai init [folder]       Scaffold a project: config, an example test, .env.example\n  samurai flow <command>      List, check and run the flows in ./flows (see below)\n  samurai browsers [command]  List, install and remove the browsers SAMURAI launches\n\nOptions for run and list:\n  --env <name>                Environment to run against (or SAMURAI_ENV)\n  --file <spec>               Only this spec file; repeatable\n  --grep <text>               Only tests whose full name contains the text\n  --group <name>              Only the tests of this group of the config's groups\n  --json                      Machine-readable output: JSON lines for run, one array for list\n\nOptions for run:\n  --timeout <ms>              Time one test may take\n  --expect-timeout <ms>       Time actions and assertions retry\n  --headless, --no-headless   Run the browser without a window, or with one.\n                              Default: the config's use.headless, else headless when CI is set\n  --port <n>                  Browser debugging port (default 9223)\n\nOptions for record (also --env, --port, --json):\n  --new <title>               Add a test with this title (creates the spec file if needed)\n  --test <name|index>         Record into this test; not needed when the file has one\n  --at <n>                    Insert from step n (default: after the last step)\n  --url <url>                 Page to start on (default: the environment's baseURL)\n  Stop with Ctrl+C or by closing the browser window.\n\n  -h, --help                  Show this help\n  -v, --version               Show the version\n\nExit code: 0 when every test passed, 1 when a test failed, 2 for a usage or configuration error.\n\nsamurai flow:\n  list                        The flows in ./flows\n  check [<flow>...]           Check flows without running them\n  run <flow>... | --all       Run flows; each writes result/flows/<id>.json\n  Options for run: --env, --headless, --timeout, --expect-timeout, --port, --json, --allow-unsupported\n  Run `samurai flow` alone for the details.\n\nsamurai browsers:\n  list                        The pinned browsers and every build in the cache (the default)\n  install [firefox|chrome|all]\n                              Download the pinned builds (default: all)\n  uninstall <name> [--build <id>] | --unused\n\nRun it in the project folder, the one holding samurai.config.ts.\n";
+export declare const USAGE = "samurai: browser tests over WebDriver BiDi\n\nUsage:\n  samurai run [options]       Run the tests (the default command)\n  samurai list [options]      List the tests without running them\n  samurai record <spec>       Open a browser and record what you do into a spec file\n  samurai init [folder]       Scaffold a project: config, an example test, .env.example\n  samurai flow <command>      List, check and run the flows in ./flows (see below)\n  samurai browsers [command]  List, install and remove the browsers SAMURAI launches\n\nOptions for run and list:\n  --env <name>                Environment to run against (or SAMURAI_ENV)\n  --file <spec>               Only this spec file; repeatable\n  --grep <text>               Only tests whose full name contains the text\n  --group <name>              Only the tests of this group of the config's groups\n  --json                      Machine-readable output: JSON lines for run, one array for list\n\nOptions for run:\n  --timeout <ms>              Time one test may take\n  --expect-timeout <ms>       Time actions and assertions retry\n  --headless, --no-headless   Run the browser without a window, or with one.\n                              Default: the config's use.headless, else headless when CI is set\n  --port <n>                  Browser debugging port (default 9223)\n\nOptions for record (also --env, --port, --json, --headless, --no-headless):\n  --new <title>               Add a test with this title (creates the spec file if needed)\n  --test <name|index>         Record into this test; not needed when the file has one\n  --at <n>                    Insert from step n (default: after the last step)\n  --url <url>                 Page to start on (default: the environment's baseURL)\n  Stop with Ctrl+C or by closing the browser window.\n\n  -h, --help                  Show this help\n  -v, --version               Show the version\n\nExit code: 0 when every test passed, 1 when a test failed, 2 for a usage or configuration error.\n\nsamurai flow:\n  list                        The flows in ./flows\n  check [<flow>...]           Check flows without running them\n  run <flow>... | --all       Run flows; each writes result/flows/<id>.json\n  Options for run: --env, --headless, --timeout, --expect-timeout, --port, --json, --allow-unsupported\n  Run `samurai flow` alone for the details.\n\nsamurai browsers:\n  list                        The pinned browsers and every build in the cache (the default)\n  install [firefox|chrome|all]\n                              Download the pinned builds (default: all)\n  uninstall <name> [--build <id>] | --unused\n\nRun it in the project folder, the one holding samurai.config.ts.\n";
 export interface Io {
     out: (text: string) => void;
     err: (text: string) => void;

package/dist/cli/main.js

@@ -31,7 +31,7 @@ Options for run:
                               Default: the config's use.headless, else headless when CI is set
   --port <n>                  Browser debugging port (default 9223)
 
-Options for record (also --env, --port, --json):
+Options for record (also --env, --port, --json, --headless, --no-headless):
   --new <title>               Add a test with this title (creates the spec file if needed)
   --test <name|index>         Record into this test; not needed when the file has one
   --at <n>                    Insert from step n (default: after the last step)
@@ -114,6 +114,7 @@ export async function main(argv, io) {
                 ...(values.new !== undefined && { create: values.new }),
                 ...(at !== undefined && { at }),
                 ...(values.url !== undefined && { url: values.url }),
+                ...(flags.headless !== undefined && { headless: flags.headless }),
                 ...(flags.port !== undefined && { port: flags.port }),
                 ...(io.signal && { signal: io.signal }),
                 onStarted: () => {
@@ -132,13 +133,18 @@ export async function main(argv, io) {
                         io.out(state === "paused" ? "Paused\n" : "Recording\n");
                     }
                 },
+                onMissingFile: (_file, text) => {
+                    if (!values.json)
+                        io.out(`${text}\n`);
+                },
                 onEvent: (event) => {
                     if (values.json)
                         return void io.out(`${JSON.stringify(event)}\n`);
-                    if (event.op === "insert")
-                        io.out(`  + ${stepToSource(event.step)}\n`);
-                    else
-                        io.out(`  ~ ${stepToSource(event.step)}\n`);
+                    if (event.op === "remove") {
+                        count--;
+                        return void io.out(`  - step ${event.index + 1} (the click that opened the file picker)\n`);
+                    }
+                    io.out(`  ${event.op === "insert" ? "+" : "~"} ${stepToSource(event.step)}\n`);
                     if (event.op === "insert")
                         count++;
                 },
@@ -148,6 +154,15 @@ export async function main(argv, io) {
                 if (result.unsetSecrets.length > 0) {
                     io.out(`Set ${result.unsetSecrets.map((name) => `SAMURAI_SECRET_${name}`).join(", ")} (environment variable or .env.<environment>) before running it.\n`);
                 }
+                if (result.missingFiles.length > 0) {
+                    io.out(`Add ${result.missingFiles.map((f) => f.path).join(", ")} before running it (or use generatedFile).\n`);
+                }
+                const hasFiles = result.files.length + result.missingFiles.length > 0;
+                const folder = result.filesFolder === "" ? "." : result.filesFolder;
+                if (hasFiles && result.filesIgnored)
+                    io.out(`${folder}/ is ignored by git; CI won't have these files.\n`);
+                if (hasFiles && result.firstFiles)
+                    io.out(`Recorded files are stored in ${folder}/ and committed with your tests.\n`);
             }
             return 0;
         }

package/dist/locator/locator.d.ts

@@ -3,6 +3,7 @@ import type { BrowsingContext, ElementRectangle } from "../types/bidi-modules/br
 import { type HelperInstaller } from "../script/helpers.js";
 import { ElementHandle } from "../script/element-handle.js";
 import { type ElementScreenshotOptions } from "../browser/screenshot.js";
+import { type FileInput } from "../browser/generated-files.js";
 import { type WaitForState } from "./element-state.js";
 import { type Selector, type TextOptions } from "./selector.js";
 export type { WaitForState } from "./element-state.js";
@@ -116,14 +117,25 @@ export default class Locator {
      */
     clickRect(rect: Pick<ElementRectangle, "x" | "y" | "width" | "height">): Promise<void>;
     /**
-     * Sets the files of an `<input type=file>` (an empty list clears them); the browser fires `input` and `change`.
-     * Paths are resolved against the working directory and must exist on the machine the browser runs on.
+     * Sets the files of an `<input type=file>`; `[]` clears it. Paths are relative to the project folder (absolute
+     * ones are used as they are); `generatedFile(…)` writes a file of a given size when the step runs.
      * Waits for the input to be attached and enabled; it need not be visible, file inputs are often hidden behind a label.
      * @example
-     *  await page.locator("input[@type='file']").setInputFiles("./fixtures/avatar.png");
-     *  await page.locator("input[@type='file']").setInputFiles([]);
+     *  await page.getByLabel("Avatar").setInputFiles("files/avatar.png");
+     *  await page.getByLabel("Upload").setInputFiles(generatedFile({ name: "huge.pdf", size: "60 MB" }));
      */
-    setInputFiles(files: string | string[], options?: {
+    setInputFiles(files: FileInput | FileInput[], options?: {
+        timeout?: number;
+    }): Promise<void>;
+    /**
+     * Drops files on the element, as dragging them from the desktop does: `dragenter`, `dragover` and `drop`
+     * with a `DataTransfer` holding the files. Takes what `setInputFiles` takes. The events are synthetic
+     * (`isTrusted` is false); a page that only accepts trusted drops ignores them.
+     * Waits for the element to be attached and visible.
+     * @example
+     *  await page.getByTestId("dropzone").dropFiles(["files/a.png", "files/b.png"]);
+     */
+    dropFiles(files: FileInput | FileInput[], options?: {
         timeout?: number;
     }): Promise<void>;
     /**

package/dist/locator/locator.js

@@ -3,7 +3,7 @@ import { callFunction, ScriptError } from "../script/call-function.js";
 import { CALL_PROBE, HELPER_SANDBOX, HELPERS_MISSING, } from "../script/helpers.js";
 import { ElementHandle } from "../script/element-handle.js";
 import { takeScreenshot, } from "../browser/screenshot.js";
-import { assertIsFile, resolveFiles } from "../browser/file-paths.js";
+import { isGeneratedFile, resolveFileInputs, } from "../browser/generated-files.js";
 import { resolveTimeout, waitUntil, WaitTimeoutError, } from "../wait/wait-until.js";
 import { ActionTimeoutError } from "./action-timeout-error.js";
 import { allPass, DETACHED_STATE, evaluateChecks, parseElementState, PROBE_ELEMENT, } from "./element-state.js";
@@ -27,6 +27,31 @@ const FILE_INPUT_INFO = `(el) => ({
   multiple: Boolean(el.multiple),
 })`;
 const FILE_INPUT_CHECKS = ["attached", "enabled"];
+const DROP_CHECKS = ["attached", "visible"];
+/** The sandbox `dropFiles` builds its files in */
+const DROP_SANDBOX = "samurai-drop";
+const DROP_KEY = `globalThis[Symbol.for("samurai.drop")]`;
+const DROP_INPUT = `() => {
+  const input = document.createElement("input");
+  input.type = "file";
+  input.multiple = true;
+  ${DROP_KEY} = input;
+  return input;
+}`;
+/** Fires dragenter, dragover and drop at the element's centre with the input's files (retyped where asked) */
+const DROP_EVENTS = `(el, types) => {
+  const input = ${DROP_KEY};
+  delete ${DROP_KEY};
+  const data = new DataTransfer();
+  Array.from(input.files).forEach((file, i) => {
+    data.items.add(types[i] ? new File([file], file.name, { type: types[i], lastModified: file.lastModified }) : file);
+  });
+  const box = el.getBoundingClientRect();
+  const at = { clientX: box.left + box.width / 2, clientY: box.top + box.height / 2 };
+  for (const type of ["dragenter", "dragover", "drop"]) {
+    el.dispatchEvent(new DragEvent(type, Object.assign({ bubbles: true, cancelable: true, composed: true, dataTransfer: data }, at)));
+  }
+}`;
 const SCREENSHOT_CHECKS = ["attached", "visible"];
 const CLICK_CHECKS = [
     "attached",
@@ -63,6 +88,16 @@ const NAMED_KEYS = {
 };
 /** Unicode code point WebDriver uses for the Backspace key */
 const BACKSPACE = "";
+/**
+ * Chrome answers a command sent while the page swaps documents with an unknown error that says the context
+ * is gone for the moment; the same call a moment later works.
+ */
+const DOCUMENT_SWAP = /Cannot find context with specified id|execution contexts? (was |were )?(cleared|destroyed)/i;
+function isDocumentSwap(err) {
+    return (err instanceof BiDiError &&
+        err.code === "unknown error" &&
+        DOCUMENT_SWAP.test(err.message));
+}
 export default class Locator {
     /**
      * `selector` is an xpath, or a chain of selector steps that each search inside the previous step's matches.
@@ -191,7 +226,15 @@ export default class Locator {
                 nodes = picked ? [picked] : [];
             }
             else {
-                nodes = await this.locateStep(selector, index > 0, nodes, index === this.chain.length - 1 ? max : undefined);
+                try {
+                    nodes = await this.locateStep(selector, index > 0, nodes, index === this.chain.length - 1 ? max : undefined);
+                }
+                catch (err) {
+                    // The page is swapping documents: nothing matches right now, and the waits that poll try again
+                    if (isDocumentSwap(err))
+                        return [];
+                    throw err;
+                }
             }
             if (nodes.length === 0)
                 return [];
@@ -310,7 +353,8 @@ export default class Locator {
         }
         catch (err) {
             // The document changed between the search and the probe
-            if (err instanceof BiDiError && err.code === "no such node")
+            if ((err instanceof BiDiError && err.code === "no such node") ||
+                isDocumentSwap(err))
                 return DETACHED_STATE;
             throw err;
         }
@@ -410,17 +454,15 @@ export default class Locator {
         });
     }
     /**
-     * Sets the files of an `<input type=file>` (an empty list clears them); the browser fires `input` and `change`.
-     * Paths are resolved against the working directory and must exist on the machine the browser runs on.
+     * Sets the files of an `<input type=file>`; `[]` clears it. Paths are relative to the project folder (absolute
+     * ones are used as they are); `generatedFile(…)` writes a file of a given size when the step runs.
      * Waits for the input to be attached and enabled; it need not be visible, file inputs are often hidden behind a label.
      * @example
-     *  await page.locator("input[@type='file']").setInputFiles("./fixtures/avatar.png");
-     *  await page.locator("input[@type='file']").setInputFiles([]);
+     *  await page.getByLabel("Avatar").setInputFiles("files/avatar.png");
+     *  await page.getByLabel("Upload").setInputFiles(generatedFile({ name: "huge.pdf", size: "60 MB" }));
      */
     async setInputFiles(files, options) {
-        const paths = resolveFiles(files);
-        for (const file of paths)
-            await assertIsFile(file, "setInputFiles");
+        const paths = await resolveFileInputs(files, "setInputFiles");
         await this.waitForActionable("setInputFiles", FILE_INPUT_CHECKS, { scroll: false, hitTest: false }, options?.timeout === undefined ? undefined : { timeout: options.timeout });
         const missing = () => new Error(`Failed to locate element ${this.selector}. Details: no element matches`);
         const el = await this.resolveOne();
@@ -450,6 +492,31 @@ export default class Locator {
             files: paths,
         });
     }
+    /**
+     * Drops files on the element, as dragging them from the desktop does: `dragenter`, `dragover` and `drop`
+     * with a `DataTransfer` holding the files. Takes what `setInputFiles` takes. The events are synthetic
+     * (`isTrusted` is false); a page that only accepts trusted drops ignores them.
+     * Waits for the element to be attached and visible.
+     * @example
+     *  await page.getByTestId("dropzone").dropFiles(["files/a.png", "files/b.png"]);
+     */
+    async dropFiles(files, options) {
+        const list = Array.isArray(files) ? files : [files];
+        const paths = await resolveFileInputs(list, "dropFiles");
+        const types = list.map((file) => isGeneratedFile(file) ? (file.type ?? "") : "");
+        await this.waitForActionable("dropFiles", DROP_CHECKS, { scroll: true, hitTest: false }, options?.timeout === undefined ? undefined : { timeout: options.timeout });
+        const el = await this.resolveOne();
+        if (!el)
+            throw new Error(`Failed to locate element ${this.selector}. Details: no element matches`);
+        // A file input of our own, made in a sandbox and never attached: the page doesn't see it
+        const input = await this.call(DROP_INPUT, [], DROP_SANDBOX);
+        await this.biDiConnector.send("input.setFiles", {
+            context: this.contextId,
+            element: { sharedId: input.sharedId },
+            files: paths,
+        });
+        await this.call(DROP_EVENTS, [el, types], DROP_SANDBOX);
+    }
     /**
      * Takes a screenshot of just this element, after scrolling it into view and waiting until it is attached and
      * visible. Returns the image (also written to `options.path`).

package/dist/network/data-collector.d.ts

@@ -12,6 +12,7 @@ export declare class ResponseBodyUnavailableError extends Error {
 export declare class DataCollector {
     private connector;
     private id;
+    private maxBodySize;
     private disposed;
     private constructor();
     static start(connector: BiDiConnector, contextId: string, options?: {

package/dist/network/data-collector.js

@@ -1,6 +1,12 @@
 import { BiDiError } from "../transport/bidi-error.js";
 /** How large a response body may be to be kept: 10 MiB */
 const DEFAULT_MAX_BODY_SIZE = 10 * 1024 * 1024;
+/**
+ * Chrome counts the headers of a response in the size it compares with the collector's limit (a 14-byte body
+ * arrives as about 200 bytes), Firefox counts the body. Chrome's limit is raised by this much and the body is
+ * measured after it is read.
+ */
+const CHROME_HEADER_ALLOWANCE = 64 * 1024;
 /** The body of a response cannot be read */
 export class ResponseBodyUnavailableError extends Error {
     constructor(url, reason) {
@@ -15,18 +21,22 @@ export class ResponseBodyUnavailableError extends Error {
  * started. This registers one for a page and reads bodies through it.
  */
 export class DataCollector {
-    constructor(connector, id) {
+    constructor(connector, id, maxBodySize) {
         this.connector = connector;
         this.id = id;
+        this.maxBodySize = maxBodySize;
         this.disposed = false;
     }
     static async start(connector, contextId, options = {}) {
+        const maxBodySize = options.maxBodySize ?? DEFAULT_MAX_BODY_SIZE;
         const { collector } = await connector.send("network.addDataCollector", {
             dataTypes: ["response"],
-            maxEncodedDataSize: options.maxBodySize ?? DEFAULT_MAX_BODY_SIZE,
+            maxEncodedDataSize: connector.browserName === "chrome"
+                ? maxBodySize + CHROME_HEADER_ALLOWANCE
+                : maxBodySize,
             contexts: [contextId],
         });
-        return new DataCollector(connector, collector);
+        return new DataCollector(connector, collector, maxBodySize);
     }
     /** The body of the response to request `requestId`; `url` only names it in errors */
     async read(requestId, url) {
@@ -36,7 +46,13 @@ export class DataCollector {
                 request: requestId,
                 collector: this.id,
             });
-            return bytes.type === "base64" ? Buffer.from(bytes.value, "base64") : Buffer.from(bytes.value, "utf8");
+            const body = bytes.type === "base64"
+                ? Buffer.from(bytes.value, "base64")
+                : Buffer.from(bytes.value, "utf8");
+            if (body.length > this.maxBodySize) {
+                throw new ResponseBodyUnavailableError(url, `the response is larger than maxBodySize (${this.maxBodySize} bytes)`);
+            }
+            return body;
         }
         catch (err) {
             if (err instanceof BiDiError && err.code === "no such network data") {
@@ -67,7 +83,9 @@ export class DataCollector {
             return;
         this.disposed = true;
         try {
-            await this.connector.send("network.removeDataCollector", { collector: this.id });
+            await this.connector.send("network.removeDataCollector", {
+                collector: this.id,
+            });
         }
         catch (err) {
             if (!(err instanceof BiDiError && err.code === "no such network collector"))

package/dist/network/network-tracker.d.ts

@@ -54,6 +54,8 @@ export declare class NetworkTracker {
     private connector;
     private events;
     private active;
+    /** The context each request in flight belongs to, by the same key */
+    private contexts;
     /** Requests that may still be the source of a redirect, by hop key */
     private hops;
     private waiters;
@@ -73,7 +75,7 @@ export declare class NetworkTracker {
      * Resolves once no request has been in flight for `idleTime` ms. A quiet page resolves after `idleTime`.
      * Rejects with NetworkIdleTimeoutError after `timeout` ms, or with "page closed" when disposed.
      */
-    waitForIdle({ idleTime, timeout }: {
+    waitForIdle({ idleTime, timeout, }: {
         idleTime: number;
         timeout: number;
     }): Promise<void>;
@@ -85,6 +87,11 @@ export declare class NetworkTracker {
     private onBeforeRequestSent;
     private onResponseCompleted;
     private onFetchError;
+    /**
+     * A document replaced another: the requests of the old one that are still in flight are over. Firefox reports each
+     * as failed (NS_BINDING_ABORTED); Chrome says nothing, which would keep the page "busy" for good.
+     */
+    private onNavigationCommitted;
     /** A listener that throws must not stop the tracker or the other listeners */
     private emit;
 }

package/dist/network/network-tracker.js

@@ -1,6 +1,8 @@
 import EventEmitter from "node:events";
 import logger from "../logger/index.js";
 import { WaitTimeoutError } from "../wait/wait-until.js";
+/** The error text of a request that the page left before it finished, when the browser says none */
+const ABORTED_BY_NAVIGATION = "aborted by navigation";
 /** How many URLs a timeout message names */
 const URLS_IN_MESSAGE = 5;
 /** waitForIdle ran out of time with requests still in flight; `last` holds (up to five of) their URLs */
@@ -24,6 +26,8 @@ export class NetworkTracker {
         this.connector = connector;
         this.events = new EventEmitter();
         this.active = new Map();
+        /** The context each request in flight belongs to, by the same key */
+        this.contexts = new Map();
         /** Requests that may still be the source of a redirect, by hop key */
         this.hops = new Map();
         this.waiters = new Set();
@@ -41,6 +45,8 @@ export class NetworkTracker {
                 return;
             this.hops.set(key, request);
             this.active.set(key, request.url);
+            if (params.context)
+                this.contexts.set(key, params.context);
             this.emit("request", request);
             this.events.emit("change");
         };
@@ -51,6 +57,7 @@ export class NetworkTracker {
             const request = this.hops.get(key);
             if (!this.active.delete(key) || !request)
                 return;
+            this.contexts.delete(key);
             const { response } = params;
             // A redirect response keeps its request around: the next hop links back to it
             if (response.status < 300 || response.status >= 400)
@@ -72,10 +79,34 @@ export class NetworkTracker {
             const request = this.hops.get(key);
             if (!this.active.delete(key) || !request)
                 return;
+            this.contexts.delete(key);
             this.hops.delete(key);
             this.emit("requestfailed", Object.assign(request, { errorText: params.errorText }));
             this.events.emit("change");
         };
+        /**
+         * A document replaced another: the requests of the old one that are still in flight are over. Firefox reports each
+         * as failed (NS_BINDING_ABORTED); Chrome says nothing, which would keep the page "busy" for good.
+         */
+        this.onNavigationCommitted = (params) => {
+            if (!this.owns(params.context))
+                return;
+            let changed = false;
+            for (const [key, requestContext] of [...this.contexts]) {
+                const request = this.hops.get(key);
+                if (!request || request.navigation === params.navigation)
+                    continue;
+                if (!this.tree.isWithin(requestContext, params.context))
+                    continue;
+                this.contexts.delete(key);
+                this.active.delete(key);
+                this.hops.delete(key);
+                this.emit("requestfailed", Object.assign(request, { errorText: ABORTED_BY_NAVIGATION }));
+                changed = true;
+            }
+            if (changed)
+                this.events.emit("change");
+        };
     }
     static async start(connector, tree, contextId, options = {}) {
         const tracker = new NetworkTracker(tree, contextId, options.ignore ?? (() => false), connector);
@@ -83,11 +114,13 @@ export class NetworkTracker {
         connector.onEvent("network.beforeRequestSent", tracker.onBeforeRequestSent);
         connector.onEvent("network.responseCompleted", tracker.onResponseCompleted);
         connector.onEvent("network.fetchError", tracker.onFetchError);
+        connector.onEvent("browsingContext.navigationCommitted", tracker.onNavigationCommitted);
         try {
             tracker.subscription = await connector.subscribe([
                 "network.beforeRequestSent",
                 "network.responseCompleted",
                 "network.fetchError",
+                "browsingContext.navigationCommitted",
             ]);
         }
         catch (err) {
@@ -118,10 +151,12 @@ export class NetworkTracker {
      * Resolves once no request has been in flight for `idleTime` ms. A quiet page resolves after `idleTime`.
      * Rejects with NetworkIdleTimeoutError after `timeout` ms, or with "page closed" when disposed.
      */
-    waitForIdle({ idleTime, timeout }) {
+    waitForIdle({ idleTime, timeout, }) {
         return new Promise((resolve, reject) => {
             let idleTimer;
-            const waiter = { reject: (reason) => finish(() => reject(reason)) };
+            const waiter = {
+                reject: (reason) => finish(() => reject(reason)),
+            };
             const finish = (settle) => {
                 clearTimeout(idleTimer);
                 clearTimeout(deadline);
@@ -147,6 +182,7 @@ export class NetworkTracker {
         this.disposed = true;
         this.removeListeners();
         this.active.clear();
+        this.contexts.clear();
         this.hops.clear();
         [...this.waiters].forEach((waiter) => waiter.reject(new Error("page closed")));
         await this.subscription?.unsubscribe();
@@ -155,6 +191,7 @@ export class NetworkTracker {
         this.connector.offEvent("network.beforeRequestSent", this.onBeforeRequestSent);
         this.connector.offEvent("network.responseCompleted", this.onResponseCompleted);
         this.connector.offEvent("network.fetchError", this.onFetchError);
+        this.connector.offEvent("browsingContext.navigationCommitted", this.onNavigationCommitted);
     }
     owns(context) {
         return context !== null && this.tree.isWithin(context, this.contextId);
@@ -190,7 +227,9 @@ export function toRequest(data, navigation, isBlocked, redirectedFrom) {
 export function toHeaders(headers) {
     const result = {};
     for (const { name, value } of headers) {
-        const text = value.type === "base64" ? Buffer.from(value.value, "base64").toString("utf8") : value.value;
+        const text = value.type === "base64"
+            ? Buffer.from(value.value, "base64").toString("utf8")
+            : value.value;
         const key = name.toLowerCase();
         result[key] = key in result ? `${result[key]}, ${text}` : text;
     }