@wenathlan/extension 1.1.44 → 1.1.46

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  <!doctype html>
2
2
  <html lang="en">
3
3
  <head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Devthink review</title><link rel="stylesheet" href="style.css"></head>
4
- <body><main class="wide"><header><p class="eyebrow">REVIEW GATE</p><h1>Plan before action</h1><p>Every browser operation remains blocked until the user reviews and approves it here.</p></header><label for="objective">Objective</label><textarea id="objective" rows="4" placeholder="Describe a browser task to turn into a reviewable plan."></textarea><div class="actions"><button id="localplan">Create local observation plan</button><button id="remoteplan" class="secondary">Ask configured endpoint</button><button id="diagnostic" class="secondary">Capture local diagnostics</button></div><p id="status" role="status">Loading session state.</p><p id="capabilitiestext" role="status" class="muted">Optional capabilities unknown.</p><section><h2>Current plan</h2><progress id="planprogress" max="1" value="0"></progress><div id="plan" class="panel"></div></section><section><h2>Clickable map</h2><ol id="map" class="audit maplist"></ol></section><section><h2>Navigation trail</h2><ol id="trail" class="audit"></ol></section><section><h2>Navigation state</h2><div id="navigation" class="panel"></div></section><section><h2>Tabs and windows</h2><div id="tabswindows" class="panel"></div></section><section><h2>Forms and data</h2><div id="forms" class="panel"></div></section><section><h2>Files and downloads</h2><div id="files" class="panel"></div></section><section><h2>Capture gallery</h2><div id="captures" class="panel"></div></section><section><h2>Media</h2><div id="media" class="panel"></div></section><section><h2>Network calls</h2><div id="calls" class="panel"></div></section><section><h2>Network view</h2><div id="netview" class="panel"></div></section><section><h2>Traffic control</h2><div id="traffic" class="panel"></div></section><section><h2>Datasets</h2><div id="datasets" class="panel"></div></section><section><h2>Consent banners</h2><div id="banners" class="panel"></div></section><section><h2>Accessibility tree</h2><div id="a11y" class="panel"></div></section><section><h2>Reader view</h2><div id="reader" class="panel"></div></section><section><h2>Detected shapes</h2><ol id="detections" class="audit maplist"></ol></section><section><h2>Watch stream</h2><ol id="stream" class="audit"></ol></section><section><h2>Snapshot diffs</h2><div id="diffs" class="panel"></div></section><section><h2>Derived selectors</h2><ol id="selectors" class="audit maplist"></ol></section><section><h2>Structured diagnostics</h2><ul id="diagnostics" class="audit"></ul></section><section><h2>Local audit</h2><ol id="audit" class="audit"></ol></section></main><script type="module" src="sidepanel.js"></script></body>
4
+ <body><main class="wide"><header><p class="eyebrow">REVIEW GATE</p><h1>Plan before action</h1><p>Every browser operation remains blocked until the user reviews and approves it here.</p></header><label for="objective">Objective</label><textarea id="objective" rows="4" placeholder="Describe a browser task to turn into a reviewable plan."></textarea><div class="actions"><button id="localplan">Create local observation plan</button><button id="remoteplan" class="secondary">Ask configured endpoint</button><button id="diagnostic" class="secondary">Capture local diagnostics</button></div><p id="status" role="status">Loading session state.</p><p id="capabilitiestext" role="status" class="muted">Optional capabilities unknown.</p><section><h2>Current plan</h2><progress id="planprogress" max="1" value="0"></progress><div id="plan" class="panel"></div></section><section><h2>Clickable map</h2><ol id="map" class="audit maplist"></ol></section><section><h2>Navigation trail</h2><ol id="trail" class="audit"></ol></section><section><h2>Navigation state</h2><div id="navigation" class="panel"></div></section><section><h2>Tabs and windows</h2><div id="tabswindows" class="panel"></div></section><section><h2>Forms and data</h2><div id="forms" class="panel"></div></section><section><h2>Files and downloads</h2><div id="files" class="panel"></div></section><section><h2>Capture gallery</h2><div id="captures" class="panel"></div></section><section><h2>Media</h2><div id="media" class="panel"></div></section><section><h2>Network calls</h2><div id="calls" class="panel"></div></section><section><h2>Network view</h2><div id="netview" class="panel"></div></section><section><h2>Traffic control</h2><div id="traffic" class="panel"></div></section><section><h2>Run timeline</h2><div id="timeline" class="panel"></div></section><section><h2>Debugger</h2><div id="debugger" class="panel"></div></section><section><h2>Console diff</h2><div id="consolediff" class="panel"></div></section><section><h2>Datasets</h2><div id="datasets" class="panel"></div></section><section><h2>Consent banners</h2><div id="banners" class="panel"></div></section><section><h2>Accessibility tree</h2><div id="a11y" class="panel"></div></section><section><h2>Reader view</h2><div id="reader" class="panel"></div></section><section><h2>Detected shapes</h2><ol id="detections" class="audit maplist"></ol></section><section><h2>Watch stream</h2><ol id="stream" class="audit"></ol></section><section><h2>Snapshot diffs</h2><div id="diffs" class="panel"></div></section><section><h2>Derived selectors</h2><ol id="selectors" class="audit maplist"></ol></section><section><h2>Structured diagnostics</h2><ul id="diagnostics" class="audit"></ul></section><section><h2>Local audit</h2><ol id="audit" class="audit"></ol></section></main><script type="module" src="sidepanel.js"></script></body>
5
5
  </html>
@@ -1,7 +1,7 @@
1
1
  // policy.ts
2
- var sensitiveactions = /* @__PURE__ */ new Set(["click", "type", "navigate", "select", "presskey", "drag", "drop", "upload", "clear", "check", "uncheck", "toggle", "submit", "reload", "back", "forward", "writestorage", "setattribute", "removeattribute", "evaluate", "tabcreate", "tabactivate", "tabclose", "tabreload", "windowcreate", "windowclose", "windowresize", "downloadfile", "clickpoint", "shiftclick", "dismissdialog", "enterframe", "typetime", "appendtext", "setvalue", "typeedit", "keyhold", "keyrelease", "submitsearch", "selectmulti", "chooseradio", "setslider", "setdate", "setcolor", "openlink", "openprivate", "reloadcache", "stopnav", "followlink", "spanav", "rewritequery", "setfragment", "navlist", "navprofile", "handleauth", "printpdf", "prefetch", "preconnect", "deeplink", "reopentab", "pausenav", "navrate", "openclipboard", "batchopen", "duplicatetab", "closepattern", "pintab", "mutetab", "movetab", "movetabwindow", "grouptabs", "colorgroup", "collapsegroup", "discardtab", "reloadtabs", "zoomin", "zoomout", "switchtab", "maximizewindow", "minimizewindow", "restorewindow", "focuswindow", "scratchwindow", "incognitowindow", "restoretab", "restorelayout", "reopenrun", "badgetab", "fillform", "filllabel", "fillplaceholder", "submitform", "retryform", "runwizard", "selectchain", "picktypeahead", "pickdate", "attachfile", "fillcard", "fillcode", "consentpassword", "exportcsv", "exportjson", "exportexcel", "copytable", "pushsheets", "streamdisk", "paginateextract", "resumeextract", "batchdownload", "pausedownload", "resumedownload", "interceptmime", "readclipboard", "writeclipboard", "copyscreen", "quarantinedownload", "scanvirus", "cleanupartifacts", "recordscreen", "captureaudio", "downloadimages", "callrest", "callgraphql", "sendmessage", "blockrequest", "mockresponse", "rewriteheaders", "setcookies", "clearcookies", "authflow", "saveapikey", "routeproxy", "postform", "postfiles"]);
3
- var interactionactions = /* @__PURE__ */ new Set(["focus", "scroll", "hover", "clickdeep", "rightclick", "doubleclick", "scrollpage", "scrollby", "scrollend", "scrolltop", "fullscreen", "zoomset", "movepointer", "clicktext", "clickaria", "clickname", "expanddetails", "pierceshadow", "retryaction", "capturebodies"]);
4
- var readactions = /* @__PURE__ */ new Set(["observe", "inspect", "extract", "wait", "waitfor", "waittext", "readattribute", "readstyle", "readgeometry", "readvalue", "readtext", "readhtml", "countelements", "readtable", "readlinks", "readimages", "readmeta", "readforms", "readstorage", "highlight", "tablist", "windowlist", "tabsnapshot", "mapclicks", "verifyvisible", "verifyenabled", "resolvexpath", "a11ytree", "readvisible", "readertree", "detectlists", "detecttables", "readjson", "watchmutate", "waitquiet", "watchbanner", "detectinfinitescroll", "detectvirtual", "detectlazy", "readscrollpos", "readlang", "readoutline", "countpages", "listshadow", "listframes", "classifypage", "fingerprintsection", "diffsnapshots", "readselection", "watchfocus", "detectsticky", "detectscrolllock", "readopengraph", "detectlanguage", "deriveselector", "waitload", "waiturl", "spawait", "detecthttp", "readredirects", "readfinalurl", "trailaudit", "navintent", "checksafe", "querytabs", "watchtab", "findclones", "searchtabs", "listaudio", "snapshotsession", "savelayout", "attachmeta", "detectfields", "generatevalues", "saveprofiles", "asksubmit", "readerrors", "skiphoneypot", "detectlogin", "detecttemplate", "handoffcaptcha", "scrapetable", "importcsv", "looprows", "transformvalues", "deduperows", "mergepages", "stamplerows", "previewgrid", "logprovenance", "verifydownload", "exportnetlog", "namecaptures", "shotview", "shotfullpage", "shotelement", "shotregion", "contactsheet", "capturepdf", "captureframe", "readmedia", "readassets", "probestream", "timelapse", "shotcanvas", "convertimage", "makethumbs", "fetchurl", "parsejson", "parsehtml", "opensocket", "waitmessage", "watchrequests", "readheaders", "mapapi", "subscribesse", "longpoll", "extractapi", "readcookies"]);
2
+ var sensitiveactions = /* @__PURE__ */ new Set(["click", "type", "navigate", "select", "presskey", "drag", "drop", "upload", "clear", "check", "uncheck", "toggle", "submit", "reload", "back", "forward", "writestorage", "setattribute", "removeattribute", "evaluate", "tabcreate", "tabactivate", "tabclose", "tabreload", "windowcreate", "windowclose", "windowresize", "downloadfile", "clickpoint", "shiftclick", "dismissdialog", "enterframe", "typetime", "appendtext", "setvalue", "typeedit", "keyhold", "keyrelease", "submitsearch", "selectmulti", "chooseradio", "setslider", "setdate", "setcolor", "openlink", "openprivate", "reloadcache", "stopnav", "followlink", "spanav", "rewritequery", "setfragment", "navlist", "navprofile", "handleauth", "printpdf", "prefetch", "preconnect", "deeplink", "reopentab", "pausenav", "navrate", "openclipboard", "batchopen", "duplicatetab", "closepattern", "pintab", "mutetab", "movetab", "movetabwindow", "grouptabs", "colorgroup", "collapsegroup", "discardtab", "reloadtabs", "zoomin", "zoomout", "switchtab", "maximizewindow", "minimizewindow", "restorewindow", "focuswindow", "scratchwindow", "incognitowindow", "restoretab", "restorelayout", "reopenrun", "badgetab", "fillform", "filllabel", "fillplaceholder", "submitform", "retryform", "runwizard", "selectchain", "picktypeahead", "pickdate", "attachfile", "fillcard", "fillcode", "consentpassword", "exportcsv", "exportjson", "exportexcel", "copytable", "pushsheets", "streamdisk", "paginateextract", "resumeextract", "batchdownload", "pausedownload", "resumedownload", "interceptmime", "readclipboard", "writeclipboard", "copyscreen", "quarantinedownload", "scanvirus", "cleanupartifacts", "recordscreen", "captureaudio", "downloadimages", "callrest", "callgraphql", "sendmessage", "blockrequest", "mockresponse", "rewriteheaders", "setcookies", "clearcookies", "authflow", "saveapikey", "routeproxy", "postform", "postfiles", "attachcdp", "detachcdp", "cdpcmd", "overridescript"]);
3
+ var interactionactions = /* @__PURE__ */ new Set(["focus", "scroll", "hover", "clickdeep", "rightclick", "doubleclick", "scrollpage", "scrollby", "scrollend", "scrolltop", "fullscreen", "zoomset", "movepointer", "clicktext", "clickaria", "clickname", "expanddetails", "pierceshadow", "retryaction", "capturebodies", "setbreakpoint", "stepcode", "watchexpr"]);
4
+ var readactions = /* @__PURE__ */ new Set(["observe", "inspect", "extract", "wait", "waitfor", "waittext", "readattribute", "readstyle", "readgeometry", "readvalue", "readtext", "readhtml", "countelements", "readtable", "readlinks", "readimages", "readmeta", "readforms", "readstorage", "highlight", "tablist", "windowlist", "tabsnapshot", "mapclicks", "verifyvisible", "verifyenabled", "resolvexpath", "a11ytree", "readvisible", "readertree", "detectlists", "detecttables", "readjson", "watchmutate", "waitquiet", "watchbanner", "detectinfinitescroll", "detectvirtual", "detectlazy", "readscrollpos", "readlang", "readoutline", "countpages", "listshadow", "listframes", "classifypage", "fingerprintsection", "diffsnapshots", "readselection", "watchfocus", "detectsticky", "detectscrolllock", "readopengraph", "detectlanguage", "deriveselector", "waitload", "waiturl", "spawait", "detecthttp", "readredirects", "readfinalurl", "trailaudit", "navintent", "checksafe", "querytabs", "watchtab", "findclones", "searchtabs", "listaudio", "snapshotsession", "savelayout", "attachmeta", "detectfields", "generatevalues", "saveprofiles", "asksubmit", "readerrors", "skiphoneypot", "detectlogin", "detecttemplate", "handoffcaptcha", "scrapetable", "importcsv", "looprows", "transformvalues", "deduperows", "mergepages", "stamplerows", "previewgrid", "logprovenance", "verifydownload", "exportnetlog", "namecaptures", "shotview", "shotfullpage", "shotelement", "shotregion", "contactsheet", "capturepdf", "captureframe", "readmedia", "readassets", "probestream", "timelapse", "shotcanvas", "convertimage", "makethumbs", "fetchurl", "parsejson", "parsehtml", "opensocket", "waitmessage", "watchrequests", "readheaders", "mapapi", "subscribesse", "longpoll", "extractapi", "readcookies", "watchconsole", "watcherrors", "watchtasks", "watchcdp"]);
5
5
  var allowedactions = /* @__PURE__ */ new Set([...sensitiveactions, ...interactionactions, ...readactions]);
6
6
 
7
7
  // extension/tabscommand.ts
@@ -67,11 +67,16 @@ var capturesroot = document.querySelector("#captures");
67
67
  var mediaroot = document.querySelector("#media");
68
68
  var callsroot = document.querySelector("#calls");
69
69
  var trafficroot = document.querySelector("#traffic");
70
+ var timelineroot = document.querySelector("#timeline");
71
+ var consolediffroot = document.querySelector("#consolediff");
72
+ var debuggerroot = document.querySelector("#debugger");
70
73
  var netviewroot = document.querySelector("#netview");
71
74
  var statusnode = document.querySelector("#status");
72
75
  var progressnode = document.querySelector("#planprogress");
73
76
  var capabilitiestext = document.querySelector("#capabilitiestext");
74
77
  var previews = /* @__PURE__ */ new Map();
78
+ var timelinefilter = { level: "", source: "", stepid: "" };
79
+ var lastdiff;
75
80
  function options(step) {
76
81
  if (!step.options) return {};
77
82
  try {
@@ -2071,6 +2076,276 @@ function renderdiagnostic(report) {
2071
2076
  diagnosticroot.append(item);
2072
2077
  }
2073
2078
  }
2079
+ function rendertimeline(context) {
2080
+ if (!timelineroot) return;
2081
+ timelineroot.replaceChildren();
2082
+ const waiting = (context.consoleconsents ?? []).filter((consent) => consent.approved === void 0);
2083
+ for (const consent of waiting) {
2084
+ const card = document.createElement("div");
2085
+ card.className = "consentcard";
2086
+ const prompt = document.createElement("p");
2087
+ prompt.textContent = `Console capture consent: ${consent.prompt}`;
2088
+ card.append(prompt, button("Approve console capture", () => request({ kind: "approveconsoleconsent", id: consent.id }).then(() => status(`Console capture on ${consent.origin} approved; run the watchconsole step again.`)).then(refresh)));
2089
+ timelineroot.append(card);
2090
+ }
2091
+ const entries = context.timeline?.entries ?? [];
2092
+ const errors = context.timeline?.errors ?? [];
2093
+ const rejections = context.timeline?.rejections ?? [];
2094
+ const longtasks = context.timeline?.longtasks ?? [];
2095
+ if (entries.length === 0 && errors.length === 0 && rejections.length === 0 && longtasks.length === 0) {
2096
+ timelineroot.textContent = "Run watchconsole, watcherrors or watchtasks steps to fill the run timeline.";
2097
+ return;
2098
+ }
2099
+ const levels = ["error", "warn", "info", "log", "debug", "trace"];
2100
+ const sources = ["console", "error", "rejection", "resource", "longtask", "network"];
2101
+ const filters = document.createElement("div");
2102
+ filters.className = "actions";
2103
+ for (const level of levels) filters.append(button(timelinefilter.level === level ? `level ${level} \u2713` : `level ${level}`, async () => {
2104
+ timelinefilter.level = timelinefilter.level === level ? "" : level;
2105
+ await refresh();
2106
+ }));
2107
+ for (const source of sources) filters.append(button(timelinefilter.source === source ? `source ${source} \u2713` : `source ${source}`, async () => {
2108
+ timelinefilter.source = timelinefilter.source === source ? "" : source;
2109
+ await refresh();
2110
+ }));
2111
+ timelineroot.append(filters);
2112
+ const stepids = [...new Set(entries.map((entry) => entry.stepid))];
2113
+ if (stepids.length > 1) {
2114
+ const select = document.createElement("select");
2115
+ select.style.width = "100%";
2116
+ const any = document.createElement("option");
2117
+ any.value = "";
2118
+ any.textContent = "every step";
2119
+ select.append(any);
2120
+ for (const stepid of stepids) {
2121
+ const option = document.createElement("option");
2122
+ option.value = stepid;
2123
+ option.textContent = `step ${stepid}`;
2124
+ if (timelinefilter.stepid === stepid) option.selected = true;
2125
+ select.append(option);
2126
+ }
2127
+ select.addEventListener("change", () => {
2128
+ timelinefilter.stepid = select.value;
2129
+ void refresh();
2130
+ });
2131
+ timelineroot.append(select);
2132
+ }
2133
+ const shown = entries.filter((entry) => (timelinefilter.level === "" || entry.level === timelinefilter.level) && (timelinefilter.source === "" || entry.source === timelinefilter.source) && (timelinefilter.stepid === "" || entry.stepid === timelinefilter.stepid)).slice().reverse().slice(0, 60);
2134
+ const list = document.createElement("ul");
2135
+ list.className = "audit";
2136
+ for (const entry of shown) {
2137
+ const item = document.createElement("li");
2138
+ item.className = "timelinerow";
2139
+ item.dataset.level = entry.level;
2140
+ const head = document.createElement("p");
2141
+ head.className = "timeline";
2142
+ head.textContent = `${new Date(entry.time).toLocaleTimeString()} \xB7 ${entry.level} \xB7 ${entry.source} \xB7 step ${entry.stepid}${entry.repeat !== void 0 && entry.repeat > 1 ? ` \xB7 collapsed \xD7${entry.repeat}` : ""}`;
2143
+ const message = document.createElement("p");
2144
+ message.textContent = entry.message;
2145
+ item.append(head, message);
2146
+ if (entry.level === "error" && (entry.source === "error" || entry.source === "rejection")) {
2147
+ const record = entry.source === "error" ? errors.find((candidate) => candidate.stepid === entry.stepid && candidate.message === entry.message) : rejections.find((candidate) => candidate.stepid === entry.stepid && candidate.reason === entry.message);
2148
+ const frames = record && "frames" in record ? record.frames : [];
2149
+ if (frames.length > 0) {
2150
+ const expand = document.createElement("details");
2151
+ const summary = document.createElement("summary");
2152
+ summary.textContent = `${frames.length} stack frame${frames.length === 1 ? "" : "s"}`;
2153
+ const pre = document.createElement("pre");
2154
+ pre.textContent = frames.map((frame) => `at ${frame.functionname ?? "<anonymous>"} (${frame.url}:${frame.line}${frame.column !== void 0 ? `:${frame.column}` : ""})`).join("\n");
2155
+ expand.append(summary, pre);
2156
+ item.append(expand);
2157
+ }
2158
+ }
2159
+ list.append(item);
2160
+ }
2161
+ timelineroot.append(list);
2162
+ const maxtask = longtasks.reduce((max, task) => Math.max(max, task.duration), 0);
2163
+ for (const task of longtasks.slice(0, 12)) {
2164
+ const bar = document.createElement("div");
2165
+ bar.className = "taskbar";
2166
+ const label = document.createElement("p");
2167
+ label.className = "timeline";
2168
+ label.textContent = `long task \xB7 ${task.duration} ms${task.attributions.length > 0 ? ` \xB7 ${task.attributions.join(", ")}` : ""} \xB7 step ${task.stepid}`;
2169
+ const gauge = document.createElement("div");
2170
+ gauge.className = "taskgauge";
2171
+ const fill = document.createElement("div");
2172
+ fill.className = "taskfill";
2173
+ fill.style.width = maxtask > 0 ? `${Math.round(task.duration / maxtask * 100)}%` : "0%";
2174
+ gauge.append(fill);
2175
+ bar.append(label, gauge);
2176
+ timelineroot.append(bar);
2177
+ }
2178
+ const counts = context.timeline?.levelcounts ?? {};
2179
+ const summaryline = document.createElement("p");
2180
+ summaryline.className = "muted";
2181
+ const expired = (context.levelsummaries ?? []).reduce((total, item) => total + Object.values(item.counts).reduce((sum, count) => sum + count, 0), 0);
2182
+ summaryline.textContent = `${entries.length} live entr${entries.length === 1 ? "y" : "ies"} (${levels.map((level) => `${counts[level] ?? 0} ${level}`).join(" \xB7 ")})${expired > 0 ? ` \xB7 ${expired} expired into level summaries` : ""}${(context.rotationtargets ?? []).length > 0 ? ` \xB7 ${(context.rotationtargets ?? []).reduce((total, target) => total + target.entries, 0)} rotated to overflow stores` : ""}.`;
2183
+ const retentioninput = document.createElement("input");
2184
+ retentioninput.type = "number";
2185
+ retentioninput.min = "0";
2186
+ retentioninput.placeholder = "timeline retention";
2187
+ retentioninput.value = context.timelineretention !== void 0 ? String(context.timelineretention) : "";
2188
+ timelineroot.append(summaryline, retentioninput, button("Save timeline retention", () => request({ kind: "settimelineretention", retention: retentioninput.value === "" ? void 0 : Number(retentioninput.value) }).then(() => status(`Timeline retention saved as ${retentioninput.value === "" ? "keep every entry" : retentioninput.value} entries; level count summaries always survive.`)).then(refresh)));
2189
+ }
2190
+ function renderconsolediff() {
2191
+ if (!consolediffroot) return;
2192
+ consolediffroot.replaceChildren();
2193
+ const baseinput = document.createElement("input");
2194
+ baseinput.placeholder = "base run id";
2195
+ const targetinput = document.createElement("input");
2196
+ targetinput.placeholder = "target run id";
2197
+ consolediffroot.append(baseinput, targetinput, button("Compare console output", () => request({ kind: "consolediff", base: baseinput.value, target: targetinput.value }).then((value) => {
2198
+ const parsed = value;
2199
+ if (!parsed) throw new Error("The console diff returned no result.");
2200
+ lastdiff = parsed.diff;
2201
+ status(`Diffed runs ${parsed.diff.base} and ${parsed.diff.target}: ${parsed.diff.added} added, ${parsed.diff.removed} removed and ${parsed.diff.repeated} repeated line${parsed.diff.added + parsed.diff.removed + parsed.diff.repeated === 1 ? "" : "s"}.`);
2202
+ renderconsolediff();
2203
+ })));
2204
+ if (!lastdiff) {
2205
+ const hint = document.createElement("p");
2206
+ hint.className = "muted";
2207
+ hint.textContent = "Compare the console output of two runs to see added, removed and repeated lines.";
2208
+ consolediffroot.append(hint);
2209
+ return;
2210
+ }
2211
+ const headline = document.createElement("p");
2212
+ headline.className = "muted";
2213
+ headline.textContent = `Run ${lastdiff.base} became run ${lastdiff.target}: ${lastdiff.added} added, ${lastdiff.removed} removed and ${lastdiff.repeated} repeated.`;
2214
+ const list = document.createElement("ul");
2215
+ list.className = "audit";
2216
+ for (const line of lastdiff.lines.slice(0, 80)) {
2217
+ const item = document.createElement("li");
2218
+ item.className = `diffrow ${line.kind}`;
2219
+ item.textContent = `${line.kind}${line.count !== void 0 ? ` \xD7${line.count}` : ""}: ${line.text}`;
2220
+ list.append(item);
2221
+ }
2222
+ consolediffroot.append(headline, list);
2223
+ }
2224
+ function renderdebugger(context) {
2225
+ if (!debuggerroot) return;
2226
+ debuggerroot.replaceChildren();
2227
+ const waiting = (context.debuggergrants ?? []).filter((grant) => grant.approved === void 0 && grant.revokedat === void 0);
2228
+ for (const grant of waiting) {
2229
+ const card = document.createElement("div");
2230
+ card.className = "consentcard";
2231
+ const prompt = document.createElement("p");
2232
+ prompt.textContent = `Debugger attach on ${grant.origin} waits for your consent with the domain allowlist ${grant.domains.join(", ")} shown.`;
2233
+ card.append(prompt, button("Approve debugger consent", () => request({ kind: "approvedebuggerconsent", id: grant.id }).then(() => status(`Debugger consent on ${grant.origin} approved for ${grant.domains.join(", ")}; run the attachcdp step again.`)).then(refresh)));
2234
+ debuggerroot.append(card);
2235
+ }
2236
+ const granted = (context.debuggergrants ?? []).filter((grant) => grant.approved === true && grant.revokedat === void 0);
2237
+ if (granted.length > 0) debuggerroot.append(button("Detach debugger now", () => request({ kind: "revokedebuggerconsent" }).then((value) => {
2238
+ const parsed = value;
2239
+ status(`Detached the debugger: ${parsed.revoked} consent record${parsed.revoked === 1 ? "" : "s"} revoked, every breakpoint and override reverted and the run paused for review.`);
2240
+ return refresh();
2241
+ })));
2242
+ const sessions = context.cdpsessions ?? [];
2243
+ const attached = sessions.filter((session) => session.detachedat === void 0);
2244
+ const sessionline = document.createElement("p");
2245
+ sessionline.className = "muted";
2246
+ sessionline.textContent = attached.length === 0 ? "No devtools session is attached; run the attachcdp step behind the reviewed debugger consent." : `${attached.length} attached devtools session${attached.length === 1 ? "" : "s"}${attached[0] !== void 0 ? ` of ${attached[0].origin} with the domains ${attached[0].domains.join(", ")} enabled through ${attached[0].debuggerversion}` : ""}.`;
2247
+ debuggerroot.append(sessionline);
2248
+ const lastpause = (context.pauses ?? [])[0];
2249
+ if (lastpause !== void 0 && context.cdpattached !== 0) {
2250
+ const banner = document.createElement("div");
2251
+ banner.className = "bannercard";
2252
+ const head = document.createElement("p");
2253
+ head.textContent = `Paused on ${lastpause.reason}${lastpause.hitbreakpoint !== void 0 ? ` at breakpoint ${lastpause.hitbreakpoint}` : ""}${lastpause.domsnapshotid !== void 0 ? ` with dom snapshot ${lastpause.domsnapshotid}` : ""}.`;
2254
+ banner.append(head);
2255
+ if (lastpause.framesexpired === true) {
2256
+ const expired = document.createElement("p");
2257
+ expired.textContent = "The call frames expired from the pause retention window; the pause reason and hit breakpoint survive.";
2258
+ banner.append(expired);
2259
+ } else {
2260
+ for (const frame of lastpause.callframes.slice(0, 6)) {
2261
+ const row = document.createElement("p");
2262
+ row.textContent = `${frame.functionname ?? "anonymous"} ${frame.url}:${frame.line}${frame.column !== void 0 ? `:${frame.column}` : ""}`;
2263
+ banner.append(row);
2264
+ }
2265
+ }
2266
+ debuggerroot.append(banner);
2267
+ }
2268
+ const commands = context.cdpcommands ?? [];
2269
+ if (commands.length > 0) {
2270
+ const head = document.createElement("h4");
2271
+ head.textContent = "Raw protocol commands";
2272
+ const list = document.createElement("ul");
2273
+ list.className = "audit";
2274
+ for (const command of commands.slice(0, 12)) {
2275
+ const item = document.createElement("li");
2276
+ const badge = document.createElement("span");
2277
+ badge.className = "protocolbadge";
2278
+ badge.textContent = "raw protocol";
2279
+ item.append(`${command.method} \xB7 ${command.duration} ms${command.errorclass !== void 0 ? ` \xB7 ${command.errorclass}` : ""} \xB7 session ${command.sessionid.slice(0, 8)}`, badge);
2280
+ list.append(item);
2281
+ }
2282
+ debuggerroot.append(head, list);
2283
+ }
2284
+ const breakpoints = (context.breakpoints ?? []).filter((spec) => spec.revertedat === void 0);
2285
+ if (breakpoints.length > 0) {
2286
+ const head = document.createElement("h4");
2287
+ head.textContent = "Breakpoints";
2288
+ const list = document.createElement("ul");
2289
+ list.className = "audit";
2290
+ for (const spec of breakpoints) {
2291
+ const item = document.createElement("li");
2292
+ item.textContent = `${spec.url}:${spec.line}${spec.column !== void 0 ? `:${spec.column}` : ""} \xB7 ${spec.hits} hit${spec.hits === 1 ? "" : "s"}${spec.condition !== void 0 ? ` \xB7 condition ${spec.condition}` : ""}`;
2293
+ list.append(item);
2294
+ }
2295
+ debuggerroot.append(head, list);
2296
+ }
2297
+ const watches = context.watchexpressions ?? [];
2298
+ if (watches.length > 0) {
2299
+ const head = document.createElement("h4");
2300
+ head.textContent = "Watch expressions";
2301
+ const list = document.createElement("ul");
2302
+ list.className = "audit";
2303
+ for (const watch of watches) {
2304
+ const item = document.createElement("li");
2305
+ const values = watch.values.slice(-4).map((value) => `${value.value} @${value.pauseid.slice(0, 6)}`).join(" \xB7 ");
2306
+ item.textContent = `${watch.expression} (${watch.scope} scope${watch.reviewed ? ", reviewed" : ""})${values ? `: ${values}` : ": no value captured yet"}`;
2307
+ list.append(item);
2308
+ }
2309
+ debuggerroot.append(head, list);
2310
+ }
2311
+ const overrides = context.scriptoverrides ?? [];
2312
+ if (overrides.length > 0) {
2313
+ const head = document.createElement("h4");
2314
+ head.textContent = "Script overrides";
2315
+ const list = document.createElement("ul");
2316
+ list.className = "audit";
2317
+ for (const spec of overrides) {
2318
+ const item = document.createElement("li");
2319
+ item.textContent = `${spec.urlpattern} \xB7 ${spec.hits} applied evaluation${spec.hits === 1 ? "" : "s"}${spec.reviewed ? " \xB7 reviewed fixture" : ""}${spec.revertedat !== void 0 ? " \xB7 reverted" : " \xB7 active"}`;
2320
+ if (spec.revertedat === void 0) item.append(button("Revert fixture", () => request({ kind: "revertcdpoverride", id: spec.id }).then(() => status(`Reverted the script override of ${spec.urlpattern}; later evaluations run the original source again.`)).then(refresh)));
2321
+ list.append(item);
2322
+ }
2323
+ debuggerroot.append(head, list);
2324
+ }
2325
+ const rules = context.cdpeventrules ?? [];
2326
+ if (rules.length > 0) {
2327
+ const head = document.createElement("h4");
2328
+ head.textContent = "Domain events beside the timeline";
2329
+ const list = document.createElement("ul");
2330
+ list.className = "audit";
2331
+ for (const rule of rules.slice(0, 10)) {
2332
+ const item = document.createElement("li");
2333
+ item.textContent = `${rule.domain}.${rule.event}${rule.match !== void 0 ? ` matching ${rule.match}` : ""} \xB7 ${rule.events} matched event${rule.events === 1 ? "" : "s"}${rule.closedat !== void 0 ? " \xB7 closed" : ""}`;
2334
+ list.append(item);
2335
+ }
2336
+ debuggerroot.append(head, list);
2337
+ }
2338
+ const settingsline = document.createElement("p");
2339
+ settingsline.className = "muted";
2340
+ settingsline.textContent = `Pause retention ${context.pauseretention ?? "keeps every capture"} \xB7 breakpoint ceiling ${context.breakpointceiling ?? "none"}.`;
2341
+ const retentioninput = document.createElement("input");
2342
+ retentioninput.placeholder = "pause retention";
2343
+ retentioninput.value = context.pauseretention !== void 0 ? String(context.pauseretention) : "";
2344
+ const ceilinginput = document.createElement("input");
2345
+ ceilinginput.placeholder = "breakpoint ceiling";
2346
+ ceilinginput.value = context.breakpointceiling !== void 0 ? String(context.breakpointceiling) : "";
2347
+ debuggerroot.append(settingsline, retentioninput, ceilinginput, button("Save debugger settings", () => Promise.all([request({ kind: "setpauseretention", retention: retentioninput.value === "" ? void 0 : Number(retentioninput.value) }), request({ kind: "setbreakpointceiling", ceiling: ceilinginput.value === "" ? void 0 : Number(ceilinginput.value) })]).then(() => status(`Debugger settings saved: pause retention ${retentioninput.value === "" ? "keeps every capture" : retentioninput.value} and breakpoint ceiling ${ceilinginput.value === "" ? "none" : ceilinginput.value}.`)).then(refresh)));
2348
+ }
2074
2349
  async function refresh() {
2075
2350
  const context = await request({ kind: "context" });
2076
2351
  renderplan(context.plan, context.progress, context.outcomes ?? [], context.retries ?? []);
@@ -2094,6 +2369,9 @@ async function refresh() {
2094
2369
  rendercalls(context);
2095
2370
  rendernetview(context);
2096
2371
  rendertraffic(context);
2372
+ rendertimeline(context);
2373
+ renderdebugger(context);
2374
+ renderconsolediff();
2097
2375
  renderaudit(context.audit);
2098
2376
  rendercapabilities(context.capabilities);
2099
2377
  if (context.session?.pausedat) status("Session paused. Reviewed actions are blocked until resume.");