@saywright/vite 0.1.1 → 0.2.1

package/dist/index.js

@@ -3,6 +3,53 @@ import path from "node:path";
 import { fileURLToPath } from "node:url";
 import { parse } from "@babel/parser";
 import MagicString from "magic-string";
+new RegExp("\\b(?:" + [
+	"pass(?:word|wd|code|phrase|key)s?",
+	"pwd",
+	"pw",
+	"secrets?",
+	"tokens?",
+	"api ?keys?",
+	"access ?keys?",
+	"secret ?keys?",
+	"private ?keys?",
+	"client ?secrets?",
+	"licen[cs]e ?keys?",
+	"product ?keys?",
+	"activation ?(?:keys?|codes?)",
+	"recovery ?(?:keys?|codes?)",
+	"backup ?codes?",
+	"auth(?:entication|orization)? ?codes?",
+	"otp",
+	"totp",
+	"one ?time ?(?:codes?|passwords?|passcodes?|pins?)",
+	"(?:verification|security|confirmation|sms|2fa|mfa) ?codes?",
+	"2fa",
+	"mfa",
+	"cvv2?",
+	"cvc2?",
+	"csc",
+	"card ?(?:numbers?|num|no|codes?|verification|holder|security|expiry|expiration|exp|cvc|cvv)",
+	"name ?on ?card",
+	"credit ?cards?",
+	"debit ?cards?",
+	"cc ?(?:number|num|no|exp|expiry|csc|cvc|cvv|name|given|family|type)",
+	"iban",
+	"account ?(?:numbers?|num|no)",
+	"routing ?(?:numbers?|num|no)",
+	"sort ?codes?",
+	"ssn",
+	"social ?security",
+	"tax ?id",
+	"national ?id",
+	"passports?",
+	"pins?(?: ?codes?)?",
+	"(?:recovery|seed|secret|backup|mnemonic) ?(?:phrases?|words?)",
+	"mnemonics?",
+	"(?:security|secret) ?(?:questions?|answers?)",
+	"memorable ?(?:words?|information|info)",
+	"mother s maiden name"
+].join("|") + ")\\b");
 /** Attribute names injected by the Vite plugin at compile time. */
 var SRC_ATTR = "data-ds-src";
 var NAME_ATTR = "data-ds-name";

package/dist/protocol.d.ts

@@ -3,6 +3,7 @@
  * bridge running inside the target app (iframe). Both sides check `ns` and the
  * message source before trusting anything.
  */
+export * from './redact';
 export declare const NS: 'saywright';
 /**
  * The plugin in an app and the studio are updated separately, so each side
@@ -24,6 +25,11 @@ export declare function outdated(studio: {
 }): 'plugin' | 'studio' | null;
 /** Where the studio runs unless told otherwise. Not 5173: that is Vite's own default, where your app likely runs. */
 export declare const STUDIO_PORT = 7357;
+/**
+ * Through the studio's proxy, a page's XMLHttpRequest to another port of this computer says with this header that it
+ * was sent with its credentials (withCredentials, set after open): the proxy then sends the site's cookies with it.
+ */
+export declare const PROXY_CREDENTIALS_HEADER = "x-saywright-credentials";
 export declare const STUDIO_URL = "http://localhost:7357";
 /** Attribute names injected by the Vite plugin at compile time. */
 export declare const SRC_ATTR = "data-ds-src";
@@ -51,6 +57,8 @@ export interface ElementInfo {
     rect: Rect;
     /** Index of this node among elements sharing the same `src` (lists render one JSX site many times). */
     index: number;
+    /** How many elements on the page share its `src`, when more than one: a list's rows, a component's uses. An edit to it changes them all. */
+    same?: number;
     /** When `src` is null: what can find the element in the code. */
     hint?: SourceHint;
     /** Pages without source attributes: where React's development build says it came from (see SourceFrame). */
@@ -87,6 +95,12 @@ export interface LocatorInfo {
     /** The title of the card or row that tells it apart from others like it ("Celadon mug, 12 oz"). */
     within?: string;
 }
+/**
+ * A step of Write test, as the app's bridge saw it. A secret (a password, a card number…) comes as `secret`, the
+ * name a test reads it under (PASSWORD), with an empty `value`: what was typed never leaves the page. A choice in a
+ * list comes as a `fill` with `select`, the options chosen (by what they say, and `values` by their value), so a
+ * studio that doesn't know `select` still writes a step rather than leaving one out.
+ */
 export type RecordedAction = {
     kind: 'click';
     locator: string;
@@ -96,6 +110,10 @@ export type RecordedAction = {
     locator: string;
     value: string;
     description: string;
+    secret?: string;
+    select?: string[];
+    values?: string[];
+    checked?: boolean;
 } | {
     kind: 'press';
     locator: string;
@@ -129,6 +147,8 @@ export interface SessionTarget {
     rect: [number, number, number, number];
     /** A link inside running text (exempt from minimum target sizes). */
     inline?: boolean;
+    /** Smaller than 24×24 px but with nothing else to click within 12 px of its centre (WCAG 2.5.8's spacing exception). */
+    spaced?: boolean;
     /** When `src` is null: what can find it in the code. */
     hint?: SourceHint;
 }
@@ -162,16 +182,22 @@ export type SessionEventBody = {
     el: SessionTarget;
     count: number;
     disabled?: boolean;
-} | {
+}
+/** `masked`: a secret (`value` is a dot per character); `secret`: the name a test would read it under (PASSWORD). */
+ | {
     type: 'input';
     el: SessionTarget;
     value: string;
     masked: boolean;
-} | {
+    secret?: string;
+}
+/** `options`: what each option chosen in a list says (several, in a list that takes more than one); `value` is the first. */
+ | {
     type: 'change';
     el: SessionTarget;
     value: string;
     checked?: boolean;
+    options?: string[];
 } | {
     type: 'submit';
     el: SessionTarget;
@@ -351,10 +377,20 @@ export type StudioToBridge = Base & ({
     type: 'describe';
     reqId: number;
     id: number;
-} | {
+}
+/**
+ * `check`: the locator is for a check that the element should show `expected`, so it isn't found by words the fix
+ * changes; with `state`, of whether it is checked or chosen, so it is the checkbox, radio button or list it belongs
+ * to (its label, an option of it, pointed at).
+ */
+ | {
     type: 'locator';
     reqId: number;
     id: number;
+    check?: {
+        expected: string;
+        state?: boolean;
+    };
 }
 /** Move from an element: out, in, to the next or previous one; or to the nearest one called `what` ("card"). `id` 0: from nothing. */
  | {
@@ -382,11 +418,13 @@ export type StudioToBridge = Base & ({
     type: 'replay';
     reqId: number;
     locator: string;
+    /** `select`: the options to choose, by what they say or their value (all of them, in a list that takes several). */
     step?: {
         kind: 'click' | 'fill' | 'press';
         value?: string;
         key?: string;
         checked?: boolean;
+        select?: string[];
     };
     read?: boolean;
     like?: {
@@ -420,6 +458,11 @@ export type StudioToBridge = Base & ({
     type: 'record';
     on: boolean;
 }
+/** Write test: send the steps still waiting (text being typed) now, then reply; a check said next comes after them. */
+ | {
+    type: 'flush';
+    reqId: number;
+}
 /** Report the real mouse position while the user interacts with the app directly (Use / Record modes). */
  | {
     type: 'mouse';
@@ -482,6 +525,11 @@ export type BridgeToStudio = Base & ({
     locator?: LocatorInfo | null;
     /** What an element shows (replay, with `read`). */
     text?: string;
+    /** A state check's control: whether it is checked now. */
+    checked?: boolean;
+    /** A state check on an option of a list: what that option says; and what the options chosen now say. */
+    option?: string;
+    chosen?: string[];
     /** A page review's results. */
     review?: PageReview;
     /** What Autopilot sees of the page. */
@@ -545,14 +593,17 @@ export interface PageControl {
     role: string;
     /** What a person would call it: its label or its text. */
     name: string;
-    /** A field: its type, what it holds now (never a password's value), whether it must be filled, its choices. */
+    /** A field: its type, what it holds now (never a password's value), whether it must be filled, its choices, and whether what is typed into it is a secret. */
     field?: {
         type: string;
         value: string;
         required: boolean;
         checked?: boolean;
         options?: string[];
+        secret?: boolean;
     };
+    /** A field in a form: what pressing Enter in it sends the form with (its default button's name, else the form's). */
+    submits?: string;
     disabled: boolean;
     /** Outside what the page shows now: reached by scrolling. */
     offscreen: boolean;
@@ -607,11 +658,13 @@ export interface PageFacts {
         external: number;
     };
     images: number;
+    /** `inputmode`: the keyboard it asks for (numeric, email…), when it says. */
     forms: {
         label: string;
         type: string;
         autocomplete: string | null;
         required: boolean;
+        inputmode?: string | null;
     }[];
     buttons: string[];
     /** Measured in this browser (lab, not field data). */
@@ -664,4 +717,3 @@ export declare function parseSrc(src: string): {
     line: number;
     col: number;
 } | null;
-export {};

package/dist/protocol.js

@@ -1,9 +1,332 @@
-//#region src/protocol.ts
+//#region src/redact.ts
+/**
+* What is never recorded: passwords, one-time codes, keys and tokens, card and bank numbers. The bridge's two
+* recorders (test sessions, and Write test), the studio (for what an older plugin still sends), the tests it writes
+* and what it sends an AI all go by these rules, so a secret is caught the same way wherever it would show.
+*
+* A field is secret by what it is (a password field, a field someone marked private) or by what it is called (its
+* name, id, autocomplete, label or placeholder: “Password”, “cc-number”, “API key”, “رمز التحقق”). A value is secret
+* by its look alone (a card number, a key or a token), whatever its field is called. A test types a secret from the
+* environment (SAYWRIGHT_SECRET_PASSWORD), never from its own file.
+*/
+/** Shown in place of a secret. */
+var MASK = "•••";
+/** A generated test reads the secret named PASSWORD from the environment variable SAYWRIGHT_SECRET_PASSWORD. */
+var SECRET_ENV_PREFIX = "SAYWRIGHT_SECRET_";
+/** A value as it may be shown: a dot for each character, at most twelve, so its length is a hint and nothing more. */
+function dots(value) {
+	return "•".repeat(Math.min(value.length, 12));
+}
+/** A name, id or label as plain words: “cardNumber”, “card_number”, “cc-number” → “card number”, “cc number”. */
+function words(text) {
+	return text.replace(/([a-z0-9])([A-Z])/g, "$1 $2").replace(/[^\p{L}\p{N}]+/gu, " ").trim().toLowerCase();
+}
+/** Words that make a field secret, whatever else it is called. */
+var SECRET_WORDS = new RegExp("\\b(?:" + [
+	"pass(?:word|wd|code|phrase|key)s?",
+	"pwd",
+	"pw",
+	"secrets?",
+	"tokens?",
+	"api ?keys?",
+	"access ?keys?",
+	"secret ?keys?",
+	"private ?keys?",
+	"client ?secrets?",
+	"licen[cs]e ?keys?",
+	"product ?keys?",
+	"activation ?(?:keys?|codes?)",
+	"recovery ?(?:keys?|codes?)",
+	"backup ?codes?",
+	"auth(?:entication|orization)? ?codes?",
+	"otp",
+	"totp",
+	"one ?time ?(?:codes?|passwords?|passcodes?|pins?)",
+	"(?:verification|security|confirmation|sms|2fa|mfa) ?codes?",
+	"2fa",
+	"mfa",
+	"cvv2?",
+	"cvc2?",
+	"csc",
+	"card ?(?:numbers?|num|no|codes?|verification|holder|security|expiry|expiration|exp|cvc|cvv)",
+	"name ?on ?card",
+	"credit ?cards?",
+	"debit ?cards?",
+	"cc ?(?:number|num|no|exp|expiry|csc|cvc|cvv|name|given|family|type)",
+	"iban",
+	"account ?(?:numbers?|num|no)",
+	"routing ?(?:numbers?|num|no)",
+	"sort ?codes?",
+	"ssn",
+	"social ?security",
+	"tax ?id",
+	"national ?id",
+	"passports?",
+	"pins?(?: ?codes?)?",
+	"(?:recovery|seed|secret|backup|mnemonic) ?(?:phrases?|words?)",
+	"mnemonics?",
+	"(?:security|secret) ?(?:questions?|answers?)",
+	"memorable ?(?:words?|information|info)",
+	"mother s maiden name"
+].join("|") + ")\\b");
+/** The same in Arabic (password, secret code, verification code, card number, account number). */
+var SECRET_WORDS_AR = /كلمة (?:ال)?(?:مرور|سر)|(?:ال)?رمز (?:ال)?(?:سري|تحقق|التحقق|أمان|الأمان|المرور)|رقم (?:ال)?(?:بطاقة|حساب|سري)|آيبان/;
+/** Whether a field described so (its type, name, id, autocomplete, label and placeholder, in one text) holds a secret. */
+function isSecretHint(hint) {
+	return SECRET_WORDS.test(words(hint)) || SECRET_WORDS_AR.test(hint);
+}
+/** Words a field's label adds that don't tell one secret from another. */
+var FILLER = /* @__PURE__ */ new Set([
+	"enter",
+	"your",
+	"the",
+	"a",
+	"an",
+	"please",
+	"type",
+	"confirm",
+	"confirmation",
+	"repeat",
+	"again",
+	"re",
+	"retype",
+	"field",
+	"here",
+	"of",
+	"required",
+	"optional"
+]);
+/** A word before a secret that does tell it from another: a new password isn't the current one. */
+var QUALIFIER = /* @__PURE__ */ new Set([
+	"new",
+	"old",
+	"current",
+	"previous",
+	"admin",
+	"master",
+	"root"
+]);
+/**
+* What a secret is called in a test, from its field's label (or name): “Enter your password” → PASSWORD, “Card
+* number” → CARD_NUMBER, “New password” → NEW_PASSWORD, “Password (8 characters or more)” → PASSWORD; “Confirm
+* password” is PASSWORD too, so one value fills both.
+*/
+function secretName(label) {
+	const w = words(label);
+	const m = SECRET_WORDS.exec(w);
+	let name;
+	if (m) {
+		const before = w.slice(0, m.index).trim().split(" ").pop() ?? "";
+		name = [...QUALIFIER.has(before) ? [before] : [], ...m[0].split(" ")];
+	} else name = w.split(" ").filter((x) => x && !FILLER.has(x) && /^[a-z0-9]+$/.test(x)).slice(0, 3);
+	if (name.length) return name.join("_").toUpperCase().slice(0, 40);
+	if (/كلمة (?:ال)?(?:مرور|سر)/.test(label)) return "PASSWORD";
+	if (/تحقق|التحقق/.test(label)) return "VERIFICATION_CODE";
+	if (/بطاقة/.test(label)) return "CARD_NUMBER";
+	return "SECRET";
+}
+/** A secret's name as an environment variable can take it: capitals, digits and underscores. */
+function secretEnvName(name) {
+	return SECRET_ENV_PREFIX + (name.toUpperCase().replace(/[^A-Z0-9]+/g, "_").replace(/^_+|_+$/g, "") || "SECRET");
+}
+/** What may be a card number: digits with spaces or dashes between them (isCard decides). */
+var CARD = /\b\d(?:[ -]?\d){12,22}\b/g;
+/** Keys and tokens by their shape. */
+var TOKENS = [
+	/\beyJ[\w-]{6,}\.eyJ[\w-]{6,}\.[\w-]{6,}/g,
+	/\b(?:sk|rk)-[\w-]{16,}/g,
+	/\b(?:sk|rk)_(?:live|test)_[A-Za-z0-9]{10,}/g,
+	/\bgh[pousr]_[A-Za-z0-9]{20,}/g,
+	/\bgithub_pat_[A-Za-z0-9_]{20,}/g,
+	/\bglpat-[\w-]{16,}/g,
+	/\bxox[abprs]-[A-Za-z0-9-]{10,}/g,
+	/\bnpm_[A-Za-z0-9]{30,}/g,
+	/\bAKIA[0-9A-Z]{16}\b/g,
+	/\bAIza[0-9A-Za-z_-]{35}/g,
+	/\bwhsec_[A-Za-z0-9]{16,}/g,
+	/\bSG\.[\w-]{16,}\.[\w-]{16,}/g,
+	/(?<=\b(?:aws_?secret_?access_?key|secret_?access_?key|client_?secret|api_?secret|private_?key|access_?token|refresh_?token|auth_?token|password|passwd)["']?\s*[:=]\s*["']?)[^\s"',;}{]{8,}/gi,
+	/\b[a-z]{2,8}_(?:(?:live|test)_)?(?=[A-Za-z0-9]{20,}\b)(?=[A-Za-z0-9]*\d)(?=[A-Za-z0-9]*[a-z])(?=[A-Za-z0-9]*[A-Z])[A-Za-z0-9]{20,}\b/g,
+	/\bBearer\s+[A-Za-z0-9._~+/-]{12,}=*/g,
+	/-----BEGIN [A-Z ]*PRIVATE KEY-----[\s\S]*?(?:-----END [A-Z ]*PRIVATE KEY-----|$)/g
+];
+function luhn(digits) {
+	let sum = 0;
+	for (let i = 0; i < digits.length; i++) {
+		let d = Number(digits[digits.length - 1 - i]);
+		if (i % 2) d = d * 2 > 9 ? d * 2 - 9 : d * 2;
+		sum += d;
+	}
+	return sum % 10 === 0;
+}
+/**
+* Whether digits are written as a card number is: 13 to 19 of them, starting with 2 to 6 (as cards of every network
+* do), passing the Luhn check, and either unbroken or in groups of 4 to 6 (the last one shorter) with one kind of
+* separator. Not a date with a number either side of it, an order row or a timestamp.
+*/
+function isCard(text) {
+	const d = text.replace(/\D/g, "");
+	if (d.length < 13 || d.length > 19 || !/^[2-6]/.test(d) || !luhn(d)) return false;
+	if (/^\d+$/.test(text)) return true;
+	if (text.includes(" ") && text.includes("-")) return false;
+	const groups = text.split(/[ -]/);
+	return groups.every((g) => /^\d+$/.test(g)) && groups.slice(0, -1).every((g) => g.length >= 4 && g.length <= 6) && groups[groups.length - 1].length <= 6;
+}
+/** A card number in `run` (digits with spaces or dashes), with what follows it kept: the longest first part that is one. */
+function maskCard(run) {
+	const parts = run.split(/(?<=\d)(?=[ -])/);
+	for (let k = parts.length; k > 0; k--) {
+		const head = parts.slice(0, k).join("");
+		if (isCard(head)) return `•••• ${head.replace(/\D/g, "").slice(-4)}${parts.slice(k).join("")}`;
+	}
+	return run;
+}
+/** Text with every card number (kept: its last four digits) and every key- or token-shaped string in it masked. */
+function maskSecrets(text) {
+	if (!text) return text;
+	let out = text.replace(CARD, maskCard);
+	out = out.replace(/\b([a-z][a-z0-9+.-]*:\/\/[^\s:@/]+:)([^\s@/]+)@/gi, (_m, head) => `${head}${MASK}@`);
+	for (const re of TOKENS) out = out.replace(re, (m) => m.startsWith("Bearer") ? `Bearer ${MASK}` : MASK);
+	return out;
+}
+/**
+* Whether a typed value is a secret by its look alone: a card number, a key or a token, or a long random string (of
+* letters in both cases and digits, as keys are; or 32 hexadecimal digits or more). A slug, a sentence, an email
+* address or a coupon code is not.
+*/
+function looksSecret(value) {
+	const v = value.trim();
+	if (v.length < 12) return false;
+	if (maskSecrets(v) !== v) return true;
+	if (/^[a-f0-9]{32,}$/i.test(v) && /\d/.test(v) && /[a-f]/i.test(v)) return true;
+	return /^[A-Za-z0-9+/_=-]{24,}$/.test(v) && /\d/.test(v) && /[a-z]/.test(v) && /[A-Z]/.test(v);
+}
+/** Query and hash parameters whose value is a secret by their name alone. */
+var SECRET_PARAM = /^(?:access_?token|refresh_?token|id_?token|auth_?token|token|auth|authorization|api_?key|apikey|key|secret|client_?secret|password|passwd|pwd|pass|otp|code_?verifier|jwt|session|session_?id|sessionid|sid|signature|sig|x-amz-signature|x-amz-credential|x-amz-security-token|x-goog-signature|x-goog-credential)$/i;
+/** Addresses of sign-in steps, where `code`, `state` and `nonce` carry what lets someone in. */
+var AUTH_PATH = /(?:^|\/)(?:callback|oauth2?|auth|authorize|sso|login|signin|sign-in|verify|magic|reset|confirm)(?:[/?#.]|$)/i;
+/** Whether a page's path is a sign-in step's (/login, /verify, /auth/callback…): a code asked for there lets someone in. */
+function isAuthPath(pathname) {
+	return AUTH_PATH.test(pathname);
+}
+/** Codes that are not secrets: a test needs them as typed (SAVE20, a postal code, a colour). */
+var PLAIN_CODE = /\b(?:coupon|promo|promotion|discount|voucher|gift|referral|invite|invitation|postal|post|zip|area|country|dialling|dialing|product|sku|item|colou?r|tracking|order|booking|reference|ref|course|class|group|room|seat|ticket|event|campaign|source|language|currency|qr|bar|barcode|html|css|snippet|embed|promotional)\b/;
+/**
+* Whether a field described so asks for a code that lets someone in, by its look: called a code or a PIN (“Code”,
+* “Enter the 6-digit code we emailed you”), not a coupon or a postal code, and short and numeric (its input mode,
+* type, pattern or length), or asked for on a sign-in step's page.
+*/
+function isCodeField(hint, field, pathname = "") {
+	const w = words(hint);
+	if (!/\b(?:code|codes|pin|passcode)\b/.test(w) || PLAIN_CODE.test(w)) return false;
+	return field.numeric || field.shortMax || isAuthPath(pathname);
+}
+function decoded(s) {
+	try {
+		return decodeURIComponent(s.replace(/\+/g, " "));
+	} catch {
+		return s;
+	}
+}
+/** `a=1&b=2` with the values of secret parameters masked, and key- or token-shaped values too. */
+function maskParams(params, authPath) {
+	return params.split("&").map((pair) => {
+		const eq = pair.indexOf("=");
+		if (eq < 0) return maskSecrets(pair);
+		const name = decoded(pair.slice(0, eq));
+		const value = pair.slice(eq + 1);
+		if (!value) return pair;
+		const secret = SECRET_PARAM.test(name) || isSecretHint(name) || authPath && /^(?:code|state|nonce)$/i.test(name) || looksSecret(decoded(value));
+		return `${pair.slice(0, eq)}=${secret ? MASK : maskSecrets(value)}`;
+	}).join("&");
+}
+/**
+* An address with the secrets in it masked: the values of parameters named like a token, key, password or session
+* (in its query, and in its hash: `#access_token=…`), sign-in codes, and key- or token-shaped parts of its path.
+* Works on whole and relative addresses, and never throws.
+*/
+function redactUrl(url) {
+	if (!url) return url;
+	const hashAt = url.indexOf("#");
+	const base = hashAt < 0 ? url : url.slice(0, hashAt);
+	const hash = hashAt < 0 ? null : url.slice(hashAt + 1);
+	const q = base.indexOf("?");
+	const path = q < 0 ? base : base.slice(0, q);
+	const authPath = AUTH_PATH.test(path);
+	let out = maskSecrets(path).replace(/(?<=\/)[A-Za-z0-9_-]{24,}(?=\/|$)/g, (part) => /\d/.test(part) && /[a-z]/.test(part) && /[A-Z]/.test(part) ? MASK : part);
+	if (q >= 0) out += `?${maskParams(base.slice(q + 1), authPath)}`;
+	if (hash !== null) {
+		const hq = hash.indexOf("?");
+		if (hq >= 0) out += `#${maskSecrets(hash.slice(0, hq))}?${maskParams(hash.slice(hq + 1), authPath || AUTH_PATH.test(hash.slice(0, hq)))}`;
+		else out += `#${hash.includes("=") ? maskParams(hash, authPath) : maskSecrets(hash)}`;
+	}
+	return out;
+}
+/** A recorded element's words, masked: text it showed may hold a card number or a key. */
+function scrubTarget(el) {
+	if (!el || typeof el !== "object") return;
+	const t = el;
+	if (typeof t.label === "string") t.label = maskSecrets(t.label);
+	if (typeof t.text === "string") t.text = maskSecrets(t.text);
+	if (typeof t.description === "string") t.description = maskSecrets(t.description);
+}
 /**
-* Message protocol between the Saywright studio (parent window) and the
-* bridge running inside the target app (iframe). Both sides check `ns` and the
-* message source before trusting anything.
+* A session event as it may be kept: addresses with their secrets masked (see redactUrl), card numbers and keys
+* masked in every text it carries (errors, console lines, response bodies, what the screen said), and a typed value
+* that is a secret (by its field's name, or its look) as dots. The bridge records events so; the studio scrubs
+* what arrives again, for events an older plugin recorded. Changes the event in place, and returns it.
 */
+function scrubEvent(event) {
+	const e = event;
+	const url = (k) => {
+		if (typeof e[k] === "string") e[k] = redactUrl(e[k]);
+	};
+	const text = (k) => {
+		if (typeof e[k] === "string") e[k] = maskSecrets(e[k]);
+	};
+	scrubTarget(e.el);
+	switch (e.type) {
+		case "page":
+			url("url");
+			url("referrer");
+			break;
+		case "nav":
+			url("url");
+			break;
+		case "net":
+			url("url");
+			text("body");
+			text("error");
+			break;
+		case "error":
+		case "console":
+			text("message");
+			text("text");
+			text("stack");
+			break;
+		case "dom":
+			url("url");
+			text("text");
+			if (Array.isArray(e.headings)) e.headings = e.headings.map((h) => typeof h === "string" ? maskSecrets(h) : h);
+			break;
+		case "input": {
+			const target = e.el ?? {};
+			const value = typeof e.value === "string" ? e.value : "";
+			if (!e.masked && (isSecretHint(`${target.label ?? ""} ${target.name ?? ""}`) || looksSecret(value))) {
+				e.value = dots(value);
+				e.masked = true;
+				e.secret ??= secretName(target.label || target.name || "");
+			} else if (!e.masked) text("value");
+			break;
+		}
+		case "change":
+			text("value");
+			if (Array.isArray(e.options)) e.options = e.options.map((o) => typeof o === "string" ? maskSecrets(o) : o);
+	}
+	return event;
+}
+//#endregion
+//#region src/protocol.ts
 var NS = "saywright";
 /**
 * The plugin in an app and the studio are updated separately, so each side
@@ -23,6 +346,11 @@ function outdated(studio, bridge) {
 }
 /** Where the studio runs unless told otherwise. Not 5173: that is Vite's own default, where your app likely runs. */
 var STUDIO_PORT = 7357;
+/**
+* Through the studio's proxy, a page's XMLHttpRequest to another port of this computer says with this header that it
+* was sent with its credentials (withCredentials, set after open): the proxy then sends the site's cookies with it.
+*/
+var PROXY_CREDENTIALS_HEADER = "x-saywright-credentials";
 var STUDIO_URL = `http://localhost:${STUDIO_PORT}`;
 /** Attribute names injected by the Vite plugin at compile time. */
 var SRC_ATTR = "data-ds-src";
@@ -61,4 +389,4 @@ function parseSrc(src) {
 	};
 }
 //#endregion
-export { NAME_ATTR, NS, OLDEST_PROTOCOL, PROTOCOL_VERSION, SRC_ATTR, STUDIO_PORT, STUDIO_URL, isStudioMessage, jsComment, jsString, outdated, parseSrc };
+export { MASK, NAME_ATTR, NS, OLDEST_PROTOCOL, PROTOCOL_VERSION, PROXY_CREDENTIALS_HEADER, SECRET_ENV_PREFIX, SRC_ATTR, STUDIO_PORT, STUDIO_URL, dots, isAuthPath, isCodeField, isSecretHint, isStudioMessage, jsComment, jsString, looksSecret, maskSecrets, outdated, parseSrc, redactUrl, scrubEvent, secretEnvName, secretName, words };

package/dist/redact.d.ts

@@ -0,0 +1,62 @@
+/**
+ * What is never recorded: passwords, one-time codes, keys and tokens, card and bank numbers. The bridge's two
+ * recorders (test sessions, and Write test), the studio (for what an older plugin still sends), the tests it writes
+ * and what it sends an AI all go by these rules, so a secret is caught the same way wherever it would show.
+ *
+ * A field is secret by what it is (a password field, a field someone marked private) or by what it is called (its
+ * name, id, autocomplete, label or placeholder: “Password”, “cc-number”, “API key”, “رمز التحقق”). A value is secret
+ * by its look alone (a card number, a key or a token), whatever its field is called. A test types a secret from the
+ * environment (SAYWRIGHT_SECRET_PASSWORD), never from its own file.
+ */
+/** Shown in place of a secret. */
+export declare const MASK = "\u2022\u2022\u2022";
+/** A generated test reads the secret named PASSWORD from the environment variable SAYWRIGHT_SECRET_PASSWORD. */
+export declare const SECRET_ENV_PREFIX = "SAYWRIGHT_SECRET_";
+/** A value as it may be shown: a dot for each character, at most twelve, so its length is a hint and nothing more. */
+export declare function dots(value: string): string;
+/** A name, id or label as plain words: “cardNumber”, “card_number”, “cc-number” → “card number”, “cc number”. */
+export declare function words(text: string): string;
+/** Whether a field described so (its type, name, id, autocomplete, label and placeholder, in one text) holds a secret. */
+export declare function isSecretHint(hint: string): boolean;
+/**
+ * What a secret is called in a test, from its field's label (or name): “Enter your password” → PASSWORD, “Card
+ * number” → CARD_NUMBER, “New password” → NEW_PASSWORD, “Password (8 characters or more)” → PASSWORD; “Confirm
+ * password” is PASSWORD too, so one value fills both.
+ */
+export declare function secretName(label: string): string;
+/** A secret's name as an environment variable can take it: capitals, digits and underscores. */
+export declare function secretEnvName(name: string): string;
+/** Text with every card number (kept: its last four digits) and every key- or token-shaped string in it masked. */
+export declare function maskSecrets(text: string): string;
+/**
+ * Whether a typed value is a secret by its look alone: a card number, a key or a token, or a long random string (of
+ * letters in both cases and digits, as keys are; or 32 hexadecimal digits or more). A slug, a sentence, an email
+ * address or a coupon code is not.
+ */
+export declare function looksSecret(value: string): boolean;
+/** Whether a page's path is a sign-in step's (/login, /verify, /auth/callback…): a code asked for there lets someone in. */
+export declare function isAuthPath(pathname: string): boolean;
+/**
+ * Whether a field described so asks for a code that lets someone in, by its look: called a code or a PIN (“Code”,
+ * “Enter the 6-digit code we emailed you”), not a coupon or a postal code, and short and numeric (its input mode,
+ * type, pattern or length), or asked for on a sign-in step's page.
+ */
+export declare function isCodeField(hint: string, field: {
+    numeric: boolean;
+    shortMax: boolean;
+}, pathname?: string): boolean;
+/**
+ * An address with the secrets in it masked: the values of parameters named like a token, key, password or session
+ * (in its query, and in its hash: `#access_token=…`), sign-in codes, and key- or token-shaped parts of its path.
+ * Works on whole and relative addresses, and never throws.
+ */
+export declare function redactUrl(url: string): string;
+/**
+ * A session event as it may be kept: addresses with their secrets masked (see redactUrl), card numbers and keys
+ * masked in every text it carries (errors, console lines, response bodies, what the screen said), and a typed value
+ * that is a secret (by its field's name, or its look) as dots. The bridge records events so; the studio scrubs
+ * what arrives again, for events an older plugin recorded. Changes the event in place, and returns it.
+ */
+export declare function scrubEvent<T extends {
+    type: string;
+}>(event: T): T;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saywright/vite",
-  "version": "0.1.1",
+  "version": "0.2.1",
   "description": "Vite plugin for Saywright: traces every element of your running React app to its file and line, so you can point at it and say what to change. Dev server only.",
   "keywords": [
     "vite",