repoburg 1.3.255 → 1.3.257

package/daemon/dist/tabtape/repro/repro.js

@@ -0,0 +1,422 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateRepro = generateRepro;
+exports.code = code;
+/**
+ * Turns a recorded session into markdown reproduction steps for a bug
+ * report. The replay UI, the HTTP API and the MCP server all use it, so they
+ * produce the same text.
+ */
+const errors_1 = require("../errors");
+const format_1 = require("../query/format");
+const network_1 = require("../query/network");
+const perf_1 = require("../query/perf");
+const reader_1 = require("../query/reader");
+const types_1 = require("../query/types");
+const lang_1 = require("./lang");
+const MERGE_CLICKS_WITHIN = 1000; // ms
+const MAX_VALUE = 120; // characters of a typed value
+const MAX_LABEL = 80;
+const MAX_BODY = 200;
+const MAX_CONSOLE = 200;
+const MAX_PROPS = 120;
+/** The shortest long animation frame worth a line. */
+const FREEZE_MS = 500;
+/** Builds the steps for v. Throws EmptyRangeError when to is not after from. */
+async function generateRepro(v, opts) {
+    const optFrom = opts.from ?? 0;
+    const optTo = opts.to ?? 0;
+    const ranged = optFrom > 0 || optTo > 0;
+    const from = Math.max(optFrom, 0);
+    let to = v.duration();
+    if (optTo > 0)
+        to = Math.min(optTo, to);
+    if (ranged && to <= from && optTo > 0)
+        throw new errors_1.EmptyRangeError();
+    const t = (0, lang_1.langFor)(opts.lang);
+    const g = new Gen(t, (0, format_1.origin)(v.session.url ?? ''));
+    let current = ''; // page URL at the time of the line being read
+    let startURL = '';
+    let userID = '';
+    let failureAt = -1;
+    const finals = v.finalVitals();
+    for (const l of v.lines) {
+        g.flush(l.ts, current);
+        const off = v.offset(l.ts);
+        if (l.ev && l.ev.name === 'identify' && off <= to)
+            userID = l.ev.userId;
+        if (off < from) {
+            if (l.ev && l.ev.name === 'page_view')
+                current = l.ev.url;
+            continue;
+        }
+        if (off > to)
+            break;
+        if (startURL === '')
+            startURL = current;
+        if (l.ev) {
+            if (l.ev.name === 'page_view') {
+                if (startURL === '')
+                    startURL = l.ev.url;
+                if (g.samePage(l.ev, current)) {
+                    current = l.ev.url;
+                    continue;
+                }
+                current = l.ev.url;
+            }
+            g.event(l, l.ev);
+        }
+        else if (l.net && (0, types_1.failed)(l.net) && !(0, types_1.isAsset)(l.net)) {
+            if (failureAt < 0)
+                failureAt = off;
+            let full;
+            try {
+                full = await v.fullNetwork(l);
+            }
+            catch {
+                full = l.net; // deleted meanwhile: report without the body
+            }
+            g.attach(l.ts, current, g.request(full));
+        }
+        else if (l.con && l.con.level === 'error' && l.con.source !== 'resource') {
+            if (failureAt < 0)
+                failureAt = off;
+            g.attach(l.ts, current, t.consoleErr(code((0, format_1.oneLine)((0, format_1.firstLine)(l.con.text), MAX_CONSOLE))));
+        }
+        else if (l.perf) {
+            g.perf(l, finals);
+        }
+    }
+    g.flush(-1, current);
+    if (startURL === '')
+        startURL = current;
+    if (startURL === '')
+        startURL = v.session.url ?? '';
+    if (g.site === '')
+        g.site = (0, format_1.origin)(startURL);
+    let linkAt = 0;
+    if (ranged)
+        linkAt = from;
+    else if (failureAt >= 0)
+        linkAt = failureAt;
+    const link = (0, format_1.replayLink)(opts.baseURL, v.session.id, linkAt);
+    let b = '';
+    const env = [(0, format_1.browserLabel)(v.session.userAgent ?? '')];
+    const [w, h] = await viewport(v);
+    if (w > 0)
+        env.push(`${w}×${h}`);
+    env.push((0, format_1.formatTime)(v.start + from, 'YYYY-MM-DD HH:mm', opts.timeZone));
+    const user = userID || v.session.userId || '';
+    if (user !== '')
+        env.push(t.user(code((0, format_1.oneLine)(user, MAX_LABEL))));
+    b += `**${t.env}:** ${env.filter((s) => s !== '').join(' · ')}\n`;
+    b += `**${t.startURL}:** ${startURL}\n\n`;
+    if (g.steps.length === 0)
+        b += `${t.noSteps}\n`;
+    g.steps.forEach((s, i) => {
+        b += `${i + 1}. ${g.render(s)}\n`;
+        for (const sub of s.subs)
+            b += `   - ${sub}\n`;
+    });
+    b += `\n**${t.expected}:** _${t.fillIn}_\n`;
+    b += `**${t.replay}:** ${link}\n`;
+    return { markdown: b, steps: g.steps.length, link };
+}
+class Gen {
+    constructor(t, 
+    /** The recorded site's scheme://host; same-origin URLs are shown as paths. */
+    site) {
+        this.t = t;
+        this.site = site;
+        this.steps = [];
+        /** Perf notes waiting for their moment, by time. */
+        this.pending = [];
+    }
+    /**
+     * Notes poor Web Vitals (their final value) and long freezes. A freeze is
+     * placed by its end, so that it lands under the click that caused it; a
+     * metric by when it was reported, which is after the interaction it
+     * measures.
+     */
+    perf(l, finals) {
+        const p = l.perf;
+        if (!p)
+            return;
+        let n;
+        if (p.kind === 'vital' && p.rating === 'poor' && finals.has(l)) {
+            let target = '';
+            if (p.attribution && p.attribution.target !== '')
+                target = code((0, format_1.oneLine)(p.attribution.target, MAX_LABEL));
+            n = { at: l.ts, text: this.t.poorVital(p.name, (0, perf_1.vitalValue)(p.name, p.value), target) };
+        }
+        else if (p.kind === 'loaf' && p.duration >= FREEZE_MS) {
+            let script = '';
+            const s = (0, perf_1.longestScript)(p);
+            if (s !== '')
+                script = code((0, format_1.oneLine)(s, MAX_LABEL));
+            n = { at: l.ts + Math.trunc(p.duration), text: this.t.froze((0, format_1.fmtMs)(p.duration), script) };
+        }
+        else {
+            return;
+        }
+        // After every note due at the same moment: notes keep their order.
+        let i = 0;
+        while (i < this.pending.length && this.pending[i].at <= n.at)
+            i++;
+        this.pending.splice(i, 0, n);
+    }
+    /** Attaches the notes due at or before ts; ts < 0 flushes all. */
+    flush(ts, current) {
+        while (this.pending.length > 0 && (ts < 0 || this.pending[0].at <= ts)) {
+            const n = this.pending.shift();
+            this.attach(n.at, current, n.text);
+        }
+    }
+    /**
+     * Whether a page view only repeats the current page: the same URL, or a
+     * replaceState that changed nothing but the query string.
+     */
+    samePage(ev, current) {
+        if (ev.url === current)
+            return true;
+        return ev.kind === 'replace' && stripQuery(ev.url) === stripQuery(current);
+    }
+    event(l, ev) {
+        const last = this.last();
+        switch (ev.name) {
+            case 'page_view':
+                this.push({ kind: 'page', ts: l.ts, lastTS: 0, count: 0, key: '', ev, subs: [] });
+                break;
+            case 'click': {
+                if (isField(ev.target))
+                    return; // focusing a field; the change that follows says what happened
+                const key = targetKey(ev.target);
+                if (last && last.kind === 'click' && last.key === key && l.ts - last.lastTS <= MERGE_CLICKS_WITHIN) {
+                    last.count++;
+                    last.lastTS = l.ts;
+                    return;
+                }
+                this.push({ kind: 'click', ts: l.ts, lastTS: l.ts, count: 1, key, ev, subs: [] });
+                break;
+            }
+            case 'change': {
+                const key = targetKey(ev.target);
+                if (last && last.kind === 'change' && last.key === key) {
+                    last.ev = ev; // keep the final value
+                    return;
+                }
+                this.push({ kind: 'change', ts: l.ts, lastTS: 0, count: 0, key, ev, subs: [] });
+                break;
+            }
+            case 'submit':
+                this.push({ kind: 'submit', ts: l.ts, lastTS: 0, count: 0, key: '', ev, subs: [] });
+                break;
+            case 'custom': {
+                const key = ev.event + '\u0000' + (0, perf_1.propsText)(ev.props, MAX_PROPS);
+                if (last && last.kind === 'custom' && last.key === key) {
+                    last.count++;
+                    return;
+                }
+                this.push({ kind: 'custom', ts: l.ts, lastTS: 0, count: 1, key, ev, subs: [] });
+                break;
+            }
+        }
+    }
+    push(s) {
+        this.steps.push(s);
+    }
+    last() {
+        return this.steps.length === 0 ? undefined : this.steps[this.steps.length - 1];
+    }
+    /** Puts a failure under the step before it, opening one for the current page when nothing happened yet. */
+    attach(ts, current, text) {
+        if (this.steps.length === 0) {
+            const ev = { ...(0, types_1.decodeEvent)({}), name: 'page_view', kind: 'start', url: current };
+            this.push({ kind: 'page', ts, lastTS: 0, count: 0, key: '', ev, subs: [] });
+        }
+        this.last().subs.push(text);
+    }
+    render(s) {
+        const t = this.t;
+        const ev = s.ev;
+        switch (s.kind) {
+            case 'page': {
+                const p = code(this.display(ev.url));
+                switch (ev.kind) {
+                    case 'push':
+                    case 'replace':
+                    case 'pop':
+                    case 'hash':
+                        return t.navigated(p);
+                }
+                return t.opened(p);
+            }
+            case 'click': {
+                let label = targetLabel(ev.target);
+                if ((0, format_1.targetText)(ev.target) === '' && ev.target && ev.target.href !== '') {
+                    label = t.link(code(this.display(ev.target.href)));
+                }
+                return t.clicked(label, s.count);
+            }
+            case 'change': {
+                const field = fieldLabel(ev.target);
+                const typ = ev.target ? ev.target.type.toLowerCase() : '';
+                const value = ev.value ?? '';
+                if (ev.masked)
+                    return t.masked(field);
+                if (typ === 'checkbox' || typ === 'radio')
+                    return value === 'checked' ? t.checked(field) : t.unchecked(field);
+                if (typ === 'file')
+                    return t.file(field, code((0, format_1.oneLine)(value, MAX_VALUE)));
+                if (ev.target && ev.target.tag === 'select')
+                    return t.selected(field, code((0, format_1.oneLine)(value, MAX_VALUE)));
+                if (value === '')
+                    return t.cleared(field);
+                return t.typed(field, code((0, format_1.oneLine)(value, MAX_VALUE)));
+            }
+            case 'submit':
+                return t.submitted(fieldLabel(ev.target));
+            case 'custom':
+                return t.tracked(code((0, format_1.oneLine)(ev.event, MAX_LABEL)), (0, perf_1.propsText)(ev.props, MAX_PROPS), s.count);
+        }
+        return '';
+    }
+    request(n) {
+        let path = (0, format_1.splitURL)(n.url).path;
+        if ((0, format_1.origin)(n.url) !== this.site)
+            path = n.url;
+        const req = code(n.method + ' ' + path);
+        const dur = n.duration !== undefined ? (0, format_1.fmtMs)(n.duration) : '';
+        const reason = (0, network_1.failureReason)(n);
+        if (reason !== '') {
+            // Deep mode knows why: "CORS: the response has no Access-Control-Allow-Origin header".
+            return this.t.request(req, this.t.failed, dur, code((0, format_1.oneLine)(reason, MAX_BODY)));
+        }
+        let body = '';
+        if (n.resBody !== undefined && goTrimSpace(n.resBody) !== '')
+            body = code((0, format_1.oneLine)(n.resBody, MAX_BODY));
+        return this.t.request(req, String(n.status), dur, body);
+    }
+    /** Shows same-origin URLs as a path. */
+    display(u) {
+        if (this.site !== '' && (0, format_1.origin)(u) === this.site)
+            return (0, format_1.splitURL)(u).path;
+        return u;
+    }
+}
+function targetLabel(t) {
+    const text = (0, format_1.targetText)(t);
+    if (text !== '')
+        return '"' + (0, format_1.oneLine)(text, MAX_LABEL) + '"';
+    return code((0, format_1.targetTag)(t));
+}
+function fieldLabel(t) {
+    const name = (0, format_1.fieldName)(t);
+    if (name !== '')
+        return '"' + (0, format_1.oneLine)(name, MAX_LABEL) + '"';
+    return code((0, format_1.targetTag)(t));
+}
+/**
+ * Identifies an element across events. The text is not part of it: a
+ * counter button's label changes with every click.
+ */
+function targetKey(t) {
+    if (!t)
+        return '';
+    if (t.selector !== '')
+        return t.selector;
+    return t.tag + '\u0000' + t.text;
+}
+/** Whether clicking the element only focuses a form field. */
+function isField(t) {
+    if (!t)
+        return false;
+    switch (t.tag) {
+        case 'textarea':
+        case 'select':
+            return true;
+        case 'input':
+            switch (t.type.toLowerCase()) {
+                case 'button':
+                case 'submit':
+                case 'reset':
+                case 'image':
+                case 'checkbox':
+                case 'radio':
+                case 'file':
+                case 'color':
+                case 'range':
+                    return false;
+            }
+            return true;
+    }
+    return false;
+}
+/** Go's json.Unmarshal of a number into an int: only integers fit. */
+function intField(v) {
+    if (v === undefined || v === null)
+        return 0;
+    return typeof v === 'number' && Number.isInteger(v) ? v : null;
+}
+/** The window size: from the first page view that has one, else from the first rrweb Meta event. */
+async function viewport(v) {
+    for (const l of v.lines) {
+        if (l.ev && l.ev.name === 'page_view' && l.ev.viewport && l.ev.viewport.w > 0)
+            return [l.ev.viewport.w, l.ev.viewport.h];
+    }
+    for (const l of v.lines) {
+        if (l.rr !== reader_1.RR_META)
+            continue;
+        try {
+            const meta = await v.rrwebData(l);
+            if ((0, types_1.isObj)(meta)) {
+                const w = intField(meta.width);
+                const h = intField(meta.height);
+                if (w !== null && h !== null && w > 0)
+                    return [w, h];
+            }
+        }
+        catch {
+            // unreadable: no viewport
+        }
+        break;
+    }
+    return [0, 0];
+}
+/** Wraps s in a markdown code span that survives backticks inside it. */
+function code(s) {
+    let fence = '`';
+    while (s.includes(fence))
+        fence += '`';
+    if (s.startsWith('`') || s.endsWith('`'))
+        return fence + ' ' + s + ' ' + fence;
+    return fence + s + fence;
+}
+function stripQuery(u) {
+    const i = u.search(/[?#]/);
+    return i >= 0 ? u.slice(0, i) : u;
+}
+/** Go's unicode.IsSpace. */
+function isGoSpace(c) {
+    return ((c >= 0x09 && c <= 0x0d) ||
+        c === 0x20 ||
+        c === 0x85 ||
+        c === 0xa0 ||
+        c === 0x1680 ||
+        (c >= 0x2000 && c <= 0x200a) ||
+        c === 0x2028 ||
+        c === 0x2029 ||
+        c === 0x202f ||
+        c === 0x205f ||
+        c === 0x3000);
+}
+/** Go's strings.TrimSpace: Unicode white space at both ends. */
+function goTrimSpace(s) {
+    let i = 0;
+    let j = s.length;
+    while (i < j && isGoSpace(s.charCodeAt(i)))
+        i++;
+    while (j > i && isGoSpace(s.charCodeAt(j - 1)))
+        j--;
+    return s.slice(i, j);
+}

package/daemon/dist/tabtape/repro/repro.spec.js

@@ -0,0 +1,210 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+const errors_1 = require("../errors");
+const reader_1 = require("../query/reader");
+const qt = __importStar(require("../testing/querytest"));
+const tmp_1 = require("../testing/tmp");
+const repro_1 = require("./repro");
+const t0 = qt.T0; // 2025-10-05 07:47:12 UTC
+const site = 'http://localhost:7788';
+const base = 'http://127.0.0.1:9998/tabtape';
+const email = { tag: 'input', type: 'email', id: 'email', name: 'email', selector: 'input#email' };
+const password = { tag: 'input', type: 'password', id: 'password', name: 'password', selector: 'input#password' };
+const signIn = { tag: 'button', type: 'submit', id: 'login-btn', selector: 'button#login-btn', text: 'Sign in' };
+const form = { tag: 'form', id: 'login-form', selector: 'form#login-form' };
+const broken = { tag: 'button', id: 'broken', selector: 'button#broken', text: 'Broken API' };
+const thrower = { tag: 'button', id: 'throw', selector: 'button#throw', text: 'Throw error' };
+const counter = (n) => ({ tag: 'button', id: 'counter', selector: 'button#counter', text: `Clicked ${n} times` });
+afterEach(async () => {
+    await qt.closeTestStores();
+    (0, tmp_1.cleanupTempDirs)();
+});
+async function demoView() {
+    const st = qt.testStore();
+    qt.start(st, 's1', t0, site + '/', 'Acme Shop');
+    const u = site + '/';
+    qt.append(st, 's1', qt.pageView(t0, 'start', u, 'Acme Shop'), qt.rrMeta(t0 + 10, u, 1440, 900), qt.rrFull(t0 + 10), qt.click(t0 + 1000, u, email), qt.change(t0 + 2000, u, email, 'ce'), qt.change(t0 + 2500, u, email, 'cel'), qt.change(t0 + 3000, u, email, 'celal@example.com'), qt.click(t0 + 3500, u, password), qt.change(t0 + 5000, u, password, '', true), qt.click(t0 + 5200, u, signIn), qt.submit(t0 + 5210, u, form), qt.click(t0 + 6000, u, broken), qt.net(t0 + 6100, {
+        kind: 'fetch',
+        method: 'GET',
+        url: site + '/api/broken',
+        status: 500,
+        duration: 12.3,
+        resBody: '{\n  "error": "kaboom",\n  "detail": "database connection refused"\n}',
+    }), qt.click(t0 + 7000, u, counter(0)), qt.click(t0 + 7100, u, counter(1)), qt.click(t0 + 7200, u, counter(2)), qt.click(t0 + 7300, u, counter(3)), qt.net(t0 + 8000, { kind: 'resource', method: 'GET', url: site + '/missing.png', status: 404 }), qt.consoleRec(t0 + 8000, { level: 'error', source: 'resource', text: 'Failed to load image missing.png' }), qt.click(t0 + 9000, u, thrower), qt.consoleRec(t0 + 9010, { level: 'error', source: 'uncaught', text: 'Boom from test page\n    at index.html:88' }), qt.pageView(t0 + 10000, 'push', site + '/products/42', 'Product 42'), qt.pageView(t0 + 11000, 'replace', site + '/products/42?tab=2', 'Product 42'), qt.pageView(t0 + 12000, 'load', site + '/b.html', 'Page B'), qt.rrInc(t0 + 12500));
+    return new reader_1.Reader(st).view('s1');
+}
+async function generate(opts) {
+    return (0, repro_1.generateRepro)(await demoView(), { ...opts, baseURL: base, timeZone: 'UTC' });
+}
+describe('generateRepro', () => {
+    it('describes the whole session', async () => {
+        const res = await generate({});
+        const want = '**Environment:** Chrome 141 · macOS · 1440×900 · 2025-10-05 07:47\n' +
+            '**Start URL:** http://localhost:7788/\n\n' +
+            '1. Opened `/`\n' +
+            '2. Typed `celal@example.com` into "email"\n' +
+            '3. Filled "password" (masked)\n' +
+            '4. Clicked "Sign in"\n' +
+            '5. Submitted form "login-form"\n' +
+            '6. Clicked "Broken API"\n' +
+            '   - `GET /api/broken` → **500** in 12 ms: `{ "error": "kaboom", "detail": "database connection refused" }`\n' +
+            '7. Clicked "Clicked 0 times" ×4\n' +
+            '8. Clicked "Throw error"\n' +
+            '   - Console error: `Boom from test page`\n' +
+            '9. Navigated to `/products/42`\n' +
+            '10. Opened `/b.html`\n\n' +
+            '**Expected:** _fill in_\n' +
+            `**Replay:** ${base}/#/s/s1?t=6090\n`;
+        expect(res.markdown).toBe(want);
+        expect(res.steps).toBe(10);
+        expect(res.link).toBe(`${base}/#/s/s1?t=6090`);
+    });
+    it('describes a range in Turkish', async () => {
+        const res = await generate({ from: 5000, to: 9500, lang: 'tr' });
+        const want = '**Ortam:** Chrome 141 · macOS · 1440×900 · 2025-10-05 07:47\n' +
+            "**Başlangıç URL'si:** http://localhost:7788/\n\n" +
+            '1. "Sign in" tıklandı\n' +
+            '2. "login-form" formu gönderildi\n' +
+            '3. "Broken API" tıklandı\n' +
+            '   - `GET /api/broken` → **500**, 12 ms: `{ "error": "kaboom", "detail": "database connection refused" }`\n' +
+            '4. "Clicked 0 times" ×4 tıklandı\n' +
+            '5. "Throw error" tıklandı\n' +
+            '   - Console hatası: `Boom from test page`\n\n' +
+            '**Beklenen:** _doldurun_\n' +
+            `**Replay:** ${base}/#/s/s1?t=5000\n`;
+        expect(res.markdown).toBe(want);
+    });
+    it('rejects an empty range and reports a range without actions', async () => {
+        await expect((0, repro_1.generateRepro)(await demoView(), { from: 9000, to: 8000, baseURL: base })).rejects.toBeInstanceOf(errors_1.EmptyRangeError);
+        await expect((0, repro_1.generateRepro)(await demoView(), { from: 9000, to: 8000, baseURL: base })).rejects.toThrow('empty range: to must be after from');
+        const res = await generate({ from: 12100, to: 12400 });
+        expect(res.markdown).toContain('No user actions in this range.');
+        expect(res.steps).toBe(0);
+    });
+    it('fences values that contain backticks', async () => {
+        const st = qt.testStore();
+        qt.append(st, 's1', qt.rrMeta(t0, 'http://a/', 800, 600), qt.rrFull(t0), qt.change(t0 + 1, 'http://a/', { tag: 'input', name: 'q', selector: 'input' }, 'a`b'));
+        const res = await (0, repro_1.generateRepro)(await new reader_1.Reader(st).view('s1'), { baseURL: '' });
+        expect(res.markdown).toContain('Typed ``a`b`` into "q"');
+        // Without a page view the viewport comes from the rrweb Meta event; without a user agent there is no browser.
+        expect(res.markdown).toContain('**Environment:** 800×600 · ');
+        expect((0, repro_1.code)('`a')).toBe('`` `a ``');
+    });
+    it('names links without text by their target', async () => {
+        const st = qt.testStore();
+        qt.start(st, 's1', t0, site + '/', 'Acme');
+        qt.append(st, 's1', qt.rrMeta(t0, site + '/', 800, 600), qt.rrFull(t0), qt.click(t0 + 1, site + '/', { tag: 'a', selector: 'td > a', href: site + '/items/7/edit' }));
+        const v = await new reader_1.Reader(st).view('s1');
+        const cases = [
+            ['en', '1. Clicked link to `/items/7/edit`'],
+            ['tr', '1. `/items/7/edit` bağlantısı tıklandı'],
+        ];
+        for (const [lang, want] of cases) {
+            const res = await (0, repro_1.generateRepro)(v, { lang, baseURL: base });
+            expect(res.markdown).toContain(want);
+        }
+    });
+    it('reports tracked events, the user and performance', async () => {
+        const st = qt.testStore();
+        const u = site + '/slow.html';
+        const slow = { tag: 'button', id: 'slow', selector: 'button#slow', text: 'Slow button' };
+        qt.start(st, 's2', t0, u, 'Slow');
+        qt.append(st, 's2', qt.pageView(t0, 'start', u, 'Slow'), qt.rrMeta(t0 + 10, u, 1440, 900), qt.rrFull(t0 + 10), qt.vital(t0 + 300, 'LCP', 4200, 'poor'), qt.vital(t0 + 400, 'LCP', 2000, 'good'), // supersedes the poor value
+        qt.identify(t0 + 500, u, 'u_demo'), qt.track(t0 + 1000, u, 'demo_clicked', { n: 1 }), qt.track(t0 + 1100, u, 'demo_clicked', { n: 1 }), qt.loaf(t0 + 1990, 612, { url: site + '/slow.js', fn: 'handleClick', duration: 600 }), qt.click(t0 + 2000, u, slow), qt.loaf(t0 + 2100, 120), // too short to mention
+        qt.vital(t0 + 2700, 'INP', 240, 'needs-improvement'), qt.vital(t0 + 2800, 'INP', 640, 'poor', { target: 'button#slow' }), qt.rrInc(t0 + 3000));
+        const v = await new reader_1.Reader(st).view('s2');
+        const gen = async (lang) => (await (0, repro_1.generateRepro)(v, { lang, baseURL: base, timeZone: 'UTC' })).markdown;
+        const want = '**Environment:** Chrome 141 · macOS · 1440×900 · 2025-10-05 07:47 · user `u_demo`\n' +
+            '**Start URL:** http://localhost:7788/slow.html\n\n' +
+            '1. Opened `/slow.html`\n' +
+            '2. Event `demo_clicked` (n: 1) ×2\n' +
+            '3. Clicked "Slow button"\n' +
+            '   - Page froze for 612 ms (`slow.js handleClick`)\n' +
+            '   - Poor INP: 640 ms on `button#slow`\n\n' +
+            '**Expected:** _fill in_\n' +
+            `**Replay:** ${base}/#/s/s2?t=0\n`;
+        expect(await gen('en')).toBe(want);
+        const got = await gen('tr');
+        for (const s of [
+            'kullanıcı `u_demo`',
+            '2. `demo_clicked` olayı (n: 1) ×2',
+            '   - Sayfa 612 ms dondu (`slow.js handleClick`)',
+            '   - Kötü INP: 640 ms, `button#slow`',
+        ]) {
+            expect(got).toContain(s);
+        }
+    });
+    it('explains deep mode failures', async () => {
+        const st = qt.testStore();
+        const u = site + '/cors.html';
+        const btn = { tag: 'button', id: 'cross', selector: 'button#cross', text: 'Cross-origin request' };
+        qt.start(st, 's3', t0, u, 'CORS');
+        qt.append(st, 's3', qt.pageView(t0, 'start', u, 'CORS'), qt.rrMeta(t0 + 10, u, 1440, 900), qt.rrFull(t0 + 10), qt.click(t0 + 1000, u, btn), qt.net(t0 + 1010, {
+            kind: 'fetch',
+            method: 'GET',
+            url: 'http://127.0.0.1:7789/api/cors',
+            source: 'cdp',
+            error: 'net::ERR_FAILED',
+            corsErrorStatus: { corsError: 'MissingAllowOriginHeader', failedParameter: '' },
+            duration: 4,
+        }), qt.rrInc(t0 + 2000));
+        const res = await (0, repro_1.generateRepro)(await new reader_1.Reader(st).view('s3'), { baseURL: base, timeZone: 'UTC' });
+        expect(res.markdown).toContain('`CORS: the response has no Access-Control-Allow-Origin header`');
+        // A cross-origin request keeps its full URL.
+        expect(res.markdown).toContain('`GET http://127.0.0.1:7789/api/cors` → **failed** in 4 ms');
+    });
+    it('opens a step for failures before any action and handles form controls', async () => {
+        const st = qt.testStore();
+        const u = site + '/form.html';
+        qt.start(st, 's4', t0, u, 'Form');
+        qt.append(st, 's4', qt.rrMeta(t0, u, 800, 600), qt.rrFull(t0), qt.pageView(t0 + 10, 'load', u, 'Form'), // before the range: only sets the current page
+        qt.consoleRec(t0 + 100, { level: 'error', source: 'console', text: 'early failure' }), qt.change(t0 + 200, u, { tag: 'input', type: 'checkbox', name: 'terms', selector: 'input#terms' }, 'checked'), qt.change(t0 + 300, u, { tag: 'select', name: 'plan', selector: 'select#plan' }, 'pro'), qt.change(t0 + 400, u, { tag: 'input', type: 'text', name: 'nick', selector: 'input#nick' }, ''), qt.change(t0 + 500, u, { tag: 'input', type: 'radio', name: 'size', selector: 'input#size' }, ''), qt.change(t0 + 600, u, { tag: 'input', type: 'file', name: 'avatar', selector: 'input#avatar' }, 'me.png'), qt.rrInc(t0 + 1000));
+        const res = await (0, repro_1.generateRepro)(await new reader_1.Reader(st).view('s4'), { from: 50, baseURL: base, timeZone: 'UTC' });
+        expect(res.markdown).toContain('**Start URL:** http://localhost:7788/form.html\n\n' +
+            '1. Opened `/form.html`\n' +
+            '   - Console error: `early failure`\n' +
+            '2. Checked "terms"\n' +
+            '3. Selected `pro` in "plan"\n' +
+            '4. Cleared "nick"\n' +
+            '5. Unchecked "size"\n' +
+            '6. Chose file `me.png` in "avatar"\n');
+        // A range opens the replay at its start.
+        expect(res.link).toBe(`${base}/#/s/s4?t=50`);
+        // Without a range, the first failure does.
+        const whole = await (0, repro_1.generateRepro)(await new reader_1.Reader(st).view('s4'), { baseURL: base, timeZone: 'UTC' });
+        expect(whole.link).toBe(`${base}/#/s/s4?t=100`);
+    });
+});

package/daemon/dist/tabtape/sink.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.collect = collect;
+exports.counter = counter;
+/** Collects everything written; for tests and small outputs. */
+function collect() {
+    const parts = [];
+    return {
+        sink: (chunk) => {
+            parts.push(Buffer.from(chunk));
+        },
+        bytes: () => Buffer.concat(parts),
+    };
+}
+/** Counts bytes and drops them (export size estimates). */
+function counter() {
+    let n = 0;
+    return {
+        sink: (chunk) => {
+            n += chunk.length;
+        },
+        count: () => n,
+    };
+}