qapture2 0.8.2 → 0.9.0

package/dist/{chunk-IYQ5JZJX.cjs → chunk-5EWNGJ2N.cjs}

@@ -176,6 +176,7 @@ var DEFAULTS = {
   brandLabel: "Qapture",
   loginField: { en: "Username", ar: "\u0627\u0633\u0645 \u0627\u0644\u0645\u0633\u062A\u062E\u062F\u0645" },
   rtl: false,
+  beta: false,
   visible: void 0,
   alwaysVisible: false,
   hotkey: "shift+alt+q",
@@ -320,9 +321,9 @@ function warnMissingArabic(loginField, credentials, journey, warnings) {
     if (c.hint !== void 0 && !hasAr(c.hint)) missing.push(`credentials role="${c.role}" (hint.ar)`);
   }
   if (!missing.length) return;
-  const LIMIT = 6;
-  const shown = missing.slice(0, LIMIT).join("; ");
-  const rest = missing.length > LIMIT ? ` (+${missing.length - LIMIT} more)` : "";
+  const LIMIT2 = 6;
+  const shown = missing.slice(0, LIMIT2).join("; ");
+  const rest = missing.length > LIMIT2 ? ` (+${missing.length - LIMIT2} more)` : "";
   warnings.push(
     `Arabic is used elsewhere in this config, but ${missing.length} bilingual field(s) have no "ar" and will show English to an Arabic-language tester: ${shown}${rest}. Every {en, ar} pair needs BOTH filled in \u2014 a plain string or an {en}-only object reads identically to a bilingual field that was simply never translated.`
   );
@@ -347,6 +348,7 @@ function validateConfig(input) {
         journey: [],
         preamble: null,
         rtl: DEFAULTS.rtl,
+        beta: DEFAULTS.beta,
         visible: DEFAULTS.visible,
         alwaysVisible: DEFAULTS.alwaysVisible,
         hotkey: DEFAULTS.hotkey,
@@ -367,6 +369,7 @@ function validateConfig(input) {
         journey: [],
         preamble: null,
         rtl: DEFAULTS.rtl,
+        beta: DEFAULTS.beta,
         visible: DEFAULTS.visible,
         alwaysVisible: DEFAULTS.alwaysVisible,
         hotkey: DEFAULTS.hotkey,
@@ -402,6 +405,7 @@ function validateConfig(input) {
   const journey = raw["journey"] !== void 0 ? coerceJourney(raw["journey"], warnings) : [];
   const preamble = raw["preamble"] !== void 0 ? coercePreamble(raw["preamble"]) : null;
   const rtl = typeof raw["rtl"] === "boolean" ? raw["rtl"] : DEFAULTS.rtl;
+  const beta = typeof raw["beta"] === "boolean" ? raw["beta"] : DEFAULTS.beta;
   const alwaysVisible = typeof raw["alwaysVisible"] === "boolean" ? raw["alwaysVisible"] : DEFAULTS.alwaysVisible;
   const hotkey = isNonEmptyString(raw["hotkey"]) ? raw["hotkey"].trim() : DEFAULTS.hotkey;
   const captureHotkey = isNonEmptyString(raw["captureHotkey"]) ? raw["captureHotkey"].trim() : DEFAULTS.captureHotkey;
@@ -424,6 +428,7 @@ function validateConfig(input) {
       journey,
       preamble,
       rtl,
+      beta,
       visible,
       alwaysVisible,
       hotkey,
@@ -1735,6 +1740,32 @@ var STR = {
     too_heavy: "This page is too big to redraw \u2014 the tab would freeze. Photograph it instead: one frame, and maps and charts come out right.",
     no_shot: "no screenshot (location saved)",
     annotate_placeholder: "What do you want to do here? (add / remove / change\u2026)",
+    // Asked as two plain questions, never as jargon. "Expected behaviour" is
+    // a phrase from a bug tracker; "what should have happened" is a question
+    // anybody can answer.
+    q_observed: "What happened?",
+    q_observed_hint: "What you saw. Plain words are fine.",
+    q_wanted: "What should have happened?",
+    q_wanted_hint: "What you expected instead. This is the important one.",
+    q_why: "Why does it matter? (optional)",
+    q_why_hint: "What you were trying to get done.",
+    q_fix: "Suggested fix (optional)",
+    q_fix_hint: "Passed on as a suggestion, not an instruction.",
+    voice_start: "Speak",
+    voice_stop: "Stop",
+    voice_failed: "Dictation did not start",
+    voice_denied: "Microphone blocked",
+    dev_mode_label: "Developer mode",
+    diag_title: "Diagnostics",
+    diag_hint: "Checks the handful of things that actually stop screenshots working on a page. Run it if something looks wrong.",
+    diag_run: "Check this page",
+    diag_running: "Checking\u2026",
+    diag_version: "Version {v}",
+    diag_outdated: "Update available: {v} \u2014",
+    diag_current: "up to date",
+    diag_faults: "Recorded problems: {n}",
+    dup_notice: "You already said something like this at {when}:",
+    dev_mode_hint: "Adds severity, the element selector, a suggested-fix field and the source location. Off by default so the person reporting a problem is asked only what they can actually answer.",
     save_point: "Save point",
     save_next: "Save + next",
     save_next_hint: "Save this one and mark up another part of the same screenshot \u2014 no second permission prompt.",
@@ -1950,6 +1981,29 @@ var STR = {
     too_heavy: "\u0647\u0630\u0647 \u0627\u0644\u0635\u0641\u062D\u0629 \u0623\u0643\u0628\u0631 \u0645\u0646 \u0623\u0646 \u064A\u064F\u0639\u0627\u062F \u0631\u0633\u0645\u0647\u0627 \u2014 \u0633\u064A\u062A\u062C\u0645\u0651\u062F \u0627\u0644\u062A\u0628\u0648\u064A\u0628. \u0635\u0648\u0651\u0631\u0647\u0627 \u0628\u062F\u0644 \u0630\u0644\u0643: \u0625\u0637\u0627\u0631 \u0648\u0627\u062D\u062F\u060C \u0648\u062A\u0638\u0647\u0631 \u0627\u0644\u062E\u0631\u0627\u0626\u0637 \u0648\u0627\u0644\u0631\u0633\u0648\u0645 \u0643\u0645\u0627 \u0647\u064A.",
     no_shot: "\u0628\u062F\u0648\u0646 \u0635\u0648\u0631\u0629 (\u062A\u0645 \u062D\u0641\u0638 \u0627\u0644\u0645\u0648\u0642\u0639)",
     annotate_placeholder: "\u0645\u0627\u0630\u0627 \u062A\u0631\u064A\u062F \u0623\u0646 \u062A\u0641\u0639\u0644 \u0647\u0646\u0627\u061F (\u0625\u0636\u0627\u0641\u0629 / \u062D\u0630\u0641 / \u062A\u063A\u064A\u064A\u0631\u2026)",
+    q_observed: "\u0645\u0627 \u0627\u0644\u0630\u064A \u062D\u062F\u062B\u061F",
+    q_observed_hint: "\u0645\u0627 \u0631\u0623\u064A\u062A\u0647. \u0628\u0643\u0644\u0645\u0627\u062A\u0643 \u0627\u0644\u0639\u0627\u062F\u064A\u0629.",
+    q_wanted: "\u0645\u0627 \u0627\u0644\u0630\u064A \u0643\u0627\u0646 \u064A\u062C\u0628 \u0623\u0646 \u064A\u062D\u062F\u062B\u061F",
+    q_wanted_hint: "\u0645\u0627 \u062A\u0648\u0642\u0651\u0639\u062A\u0647 \u0628\u062F\u0644 \u0630\u0644\u0643. \u0647\u0630\u0627 \u0647\u0648 \u0627\u0644\u0623\u0647\u0645.",
+    q_why: "\u0644\u0645\u0627\u0630\u0627 \u064A\u0647\u0645\u0651\u0643\u061F (\u0627\u062E\u062A\u064A\u0627\u0631\u064A)",
+    q_why_hint: "\u0645\u0627 \u0627\u0644\u0630\u064A \u0643\u0646\u062A \u062A\u062D\u0627\u0648\u0644 \u0625\u0646\u062C\u0627\u0632\u0647.",
+    q_fix: "\u0627\u0642\u062A\u0631\u0627\u062D \u0644\u0644\u062D\u0644 (\u0627\u062E\u062A\u064A\u0627\u0631\u064A)",
+    q_fix_hint: "\u064A\u064F\u0645\u0631\u064E\u0651\u0631 \u0643\u0627\u0642\u062A\u0631\u0627\u062D\u060C \u0644\u0627 \u0643\u0623\u0645\u0631.",
+    voice_start: "\u062A\u062D\u062F\u0651\u062B",
+    voice_stop: "\u0625\u064A\u0642\u0627\u0641",
+    voice_failed: "\u0644\u0645 \u064A\u0628\u062F\u0623 \u0627\u0644\u0625\u0645\u0644\u0627\u0621 \u0627\u0644\u0635\u0648\u062A\u064A",
+    voice_denied: "\u0627\u0644\u0645\u064A\u0643\u0631\u0648\u0641\u0648\u0646 \u0645\u062D\u062C\u0648\u0628",
+    dev_mode_label: "\u0648\u0636\u0639 \u0627\u0644\u0645\u0637\u0648\u0651\u0631",
+    diag_title: "\u0627\u0644\u062A\u0634\u062E\u064A\u0635",
+    diag_hint: "\u064A\u0641\u062D\u0635 \u0627\u0644\u0623\u0634\u064A\u0627\u0621 \u0627\u0644\u0642\u0644\u064A\u0644\u0629 \u0627\u0644\u062A\u064A \u062A\u0645\u0646\u0639 \u0639\u0645\u0644 \u0627\u0644\u0644\u0642\u0637\u0627\u062A \u0641\u0639\u0644\u064A\u064B\u0627 \u0641\u064A \u0627\u0644\u0635\u0641\u062D\u0629. \u0634\u063A\u0651\u0644\u0647 \u0625\u0630\u0627 \u0628\u062F\u0627 \u0634\u064A\u0621 \u063A\u064A\u0631 \u0633\u0644\u064A\u0645.",
+    diag_run: "\u0627\u0641\u062D\u0635 \u0647\u0630\u0647 \u0627\u0644\u0635\u0641\u062D\u0629",
+    diag_running: "\u062C\u0627\u0631\u064D \u0627\u0644\u0641\u062D\u0635\u2026",
+    diag_version: "\u0627\u0644\u0625\u0635\u062F\u0627\u0631 {v}",
+    diag_outdated: "\u064A\u062A\u0648\u0641\u0631 \u062A\u062D\u062F\u064A\u062B: {v} \u2014",
+    diag_current: "\u0645\u062D\u062F\u0651\u062B",
+    diag_faults: "\u0645\u0634\u0643\u0644\u0627\u062A \u0645\u064F\u0633\u062C\u0651\u0644\u0629: {n}",
+    dup_notice: "\u0633\u0628\u0642 \u0623\u0646 \u0643\u062A\u0628\u062A \u0634\u064A\u0626\u064B\u0627 \u0645\u0634\u0627\u0628\u0647\u064B\u0627 \u0627\u0644\u0633\u0627\u0639\u0629 {when}:",
+    dev_mode_hint: "\u064A\u0636\u064A\u0641 \u0627\u0644\u0623\u0647\u0645\u064A\u0629 \u0648\u0645\u064F\u062D\u062F\u0650\u0651\u062F \u0627\u0644\u0639\u0646\u0635\u0631 \u0648\u062D\u0642\u0644 \u0627\u0642\u062A\u0631\u0627\u062D \u0627\u0644\u062D\u0644 \u0648\u0645\u0648\u0642\u0639 \u0627\u0644\u0634\u064A\u0641\u0631\u0629. \u0645\u064F\u0637\u0641\u0623 \u0627\u0641\u062A\u0631\u0627\u0636\u064A\u064B\u0627 \u062D\u062A\u0649 \u0644\u0627 \u064A\u064F\u0633\u0623\u0644 \u0645\u064E\u0646 \u064A\u064F\u0628\u0644\u0651\u063A \u0639\u0646 \u0645\u0634\u0643\u0644\u0629 \u0625\u0644\u0627 \u0639\u0645\u0651\u0627 \u064A\u0633\u062A\u0637\u064A\u0639 \u0627\u0644\u0625\u062C\u0627\u0628\u0629 \u0639\u0646\u0647.",
     save_point: "\u062D\u0641\u0638 \u0627\u0644\u0646\u0642\u0637\u0629",
     save_next: "\u062D\u0641\u0638 + \u0627\u0644\u062A\u0627\u0644\u064A",
     save_next_hint: "\u0627\u062D\u0641\u0638 \u0647\u0630\u0647 \u0648\u062D\u062F\u0651\u062F \u062C\u0632\u0621\u064B\u0627 \u0622\u062E\u0631 \u0645\u0646 \u0646\u0641\u0633 \u0627\u0644\u0644\u0642\u0637\u0629 \u2014 \u0628\u062F\u0648\u0646 \u0637\u0644\u0628 \u0625\u0630\u0646 \u062C\u062F\u064A\u062F.",
@@ -2390,6 +2444,25 @@ function getExactCaptureStatus() {
 function getFrozenFrame() {
   return frozen;
 }
+var STILL_REUSE_MS = 9e4;
+var frozenAtScrollX = 0;
+var frozenAtScrollY = 0;
+var frozenAtPath = "";
+function stillIsCurrent() {
+  if (!frozen) return false;
+  if (typeof window === "undefined") return false;
+  if (Date.now() - frozen.takenAt > STILL_REUSE_MS) return false;
+  if (window.scrollX !== frozenAtScrollX || window.scrollY !== frozenAtScrollY) return false;
+  if (window.location.pathname + window.location.search !== frozenAtPath) return false;
+  const vw = document.documentElement.clientWidth || window.innerWidth;
+  const vh = document.documentElement.clientHeight || window.innerHeight;
+  if (vw !== frozen.viewportWidth || vh !== frozen.viewportHeight) return false;
+  return true;
+}
+async function freezeOrReuse() {
+  if (stillIsCurrent()) return frozen;
+  return freezeViewport();
+}
 function releaseFrozenFrame() {
   if (frozen) {
     frozen.canvas.width = 0;
@@ -2634,6 +2707,9 @@ async function freezeViewport() {
       viewportHeight: vh,
       takenAt: Date.now()
     };
+    frozenAtScrollX = window.scrollX;
+    frozenAtScrollY = window.scrollY;
+    frozenAtPath = window.location.pathname + window.location.search;
     lastMode = mode;
     return frozen;
   } catch {
@@ -2805,6 +2881,38 @@ function neutralizeDocumentColors(doc, aggressive = false) {
   return touched;
 }
 
+// src/lib/faultLog.ts
+var LIMIT = 40;
+var faults = [];
+function recordFault(where, err) {
+  const what = err instanceof Error ? `${err.name}: ${err.message}` : typeof err === "string" ? err : (() => {
+    try {
+      return JSON.stringify(err);
+    } catch {
+      return String(err);
+    }
+  })();
+  faults.push({ at: Date.now(), where, what: what.slice(0, 500) });
+  if (faults.length > LIMIT) faults.splice(0, faults.length - LIMIT);
+  console.warn(`[QA] ${where}:`, err);
+}
+function readFaults() {
+  return [...faults].reverse();
+}
+function clearFaults() {
+  faults.length = 0;
+}
+function faultsAsText(version) {
+  if (!faults.length) return "No faults recorded.";
+  const head = [
+    `qapture ${version}`,
+    typeof navigator !== "undefined" ? navigator.userAgent : "",
+    typeof location !== "undefined" ? location.href.split("?")[0] : "",
+    ""
+  ].filter(Boolean).join("\n");
+  return head + readFaults().map((f) => `${new Date(f.at).toISOString()}  [${f.where}] ${f.what}`).join("\n");
+}
+
 // src/lib/capture.ts
 var HTML2CANVAS_TIMEOUT_MS = 1e4;
 var CHUNK_TIMEOUT_MS = 8e3;
@@ -3157,12 +3265,13 @@ async function captureRegion(rect, scroll, prefer = "auto") {
         if (blob) return { status: "ok", blob, engine: "exact" };
       }
     } catch (err) {
-      console.warn("[QA] cropping the still failed, falling back to DOM render:", err);
+      recordFault("screenshot/crop", err);
     }
     if (prefer === "exact") return { status: "failed" };
   }
   const weight = documentWeight();
   if (weight > TOO_HEAVY_NODES) {
+    recordFault("screenshot/too-heavy", `page has ${weight} elements; the redraw engine was refused`);
     return { status: "too-heavy", nodes: weight };
   }
   try {
@@ -3171,14 +3280,14 @@ async function captureRegion(rect, scroll, prefer = "auto") {
     const blob = await encodeShot(canvas);
     return blob ? { status: "ok", blob, engine: "dom" } : { status: "failed" };
   } catch (err) {
-    console.warn("[QA] region capture failed, retrying without gradients/shadows:", err);
+    recordFault("screenshot/render", err);
     try {
       const canvas = await captureViaDom(rect, sx, sy, true);
       if (!canvas) return { status: "failed" };
       const blob = await encodeShot(canvas);
       return blob ? { status: "ok", blob, engine: "dom" } : { status: "failed" };
     } catch (retryErr) {
-      console.warn("[QA] region capture failed after retry:", retryErr);
+      recordFault("screenshot/render-retry", retryErr);
       return { status: "failed" };
     }
   }
@@ -3222,10 +3331,32 @@ function formatEvent(ev, t0) {
   }
   return `[${rel}] uncaught: ${oneLine(ev.message)}`;
 }
+var EVIDENCE_MARK = "<!--qa:evidence-->";
+function noteContextMarkdown(note, index) {
+  const body = noteToMarkdown(note, { index, keepEvidenceMark: true });
+  const at = body.indexOf(EVIDENCE_MARK);
+  const header = [
+    `# Point ${index} \u2014 runtime context`,
+    "",
+    `Page: ${oneLine(note.route) || "/"}`,
+    `Captured: ${oneLine(note.timestamp)}`,
+    "",
+    "Everything the browser recorded around this capture. Kept out of",
+    "`notes.md` on purpose -- it is here when it is needed, and out of the way",
+    "when it is not.",
+    "",
+    "---",
+    ""
+  ].join("\n");
+  return at === -1 ? `${header}_(nothing was recorded)_
+` : header + body.slice(at + EVIDENCE_MARK.length).trimStart();
+}
 function noteCheckLine(note, index) {
   const where = oneLine(note.route) || "/";
-  const what = oneLine(note.description) || "(no description)";
-  const trimmed = what.length > 160 ? `${what.slice(0, 157)}...` : what;
+  const wanted = oneLine(note.wanted);
+  const seen = oneLine(note.description) || "(not described)";
+  const claim = wanted || `${seen} \u2014 _no expectation was given; ask before assuming one_`;
+  const trimmed = claim.length > 180 ? `${claim.slice(0, 177)}...` : claim;
   return `- [ ] **check-${index}** (\`${where}\`) \u2014 ${trimmed}`;
 }
 function noteToMarkdown(note, opts) {
@@ -3255,8 +3386,15 @@ function noteToMarkdown(note, opts) {
       );
     }
   }
+  if (note.origin?.component) lines.push(`- **Component:** \`${oneLine(note.origin.component)}\``);
+  if (note.origin?.file) {
+    lines.push(`- **Source:** \`${oneLine(note.origin.file)}${note.origin.line ? `:${note.origin.line}` : ""}\``);
+  }
   if (idx != null && note.screenshot) {
     lines.push(`- **Screenshot:** screenshots/point-${idx}.${shotExtension(note.screenshot)}`);
+    if (note.shotEngine === "dom") {
+      lines.push("- **Screenshot caveat:** this is a re-drawing of the page, not a photograph. Canvas, WebGL and cross-origin images may be blank or missing in it. Trust the words over the picture where they disagree.");
+    }
   }
   if (idx != null && note.afterScreenshot) {
     lines.push(
@@ -3264,7 +3402,29 @@ function noteToMarkdown(note, opts) {
     );
   }
   lines.push("");
-  lines.push(oneLine(note.description) ? note.description.trim() : "_(no description)_");
+  lines.push("### Observed");
+  lines.push("");
+  lines.push(oneLine(note.description) ? note.description.trim() : "_(not described)_");
+  lines.push("");
+  lines.push("### Expected");
+  lines.push("");
+  lines.push(
+    note.wanted && oneLine(note.wanted) ? note.wanted.trim() : "_(the tester did not say what they expected instead -- ask rather than assume)_"
+  );
+  if (note.why && oneLine(note.why)) {
+    lines.push("");
+    lines.push("### Why it matters");
+    lines.push("");
+    lines.push(note.why.trim());
+  }
+  if (note.fixHint && oneLine(note.fixHint)) {
+    lines.push("");
+    lines.push("### Suggested fix (a suggestion, not an instruction)");
+    lines.push("");
+    lines.push(note.fixHint.trim());
+    lines.push("");
+    lines.push("> Weigh this. It came from a person looking at the symptom, not at the code, and following a wrong suggestion costs more than ignoring it.");
+  }
   if (note.followUp && oneLine(note.followUp)) {
     lines.push("");
     lines.push(
@@ -3275,6 +3435,15 @@ function noteToMarkdown(note, opts) {
     lines.push("");
     lines.push(note.followUp.trim());
   }
+  if (idx != null) {
+    lines.push("");
+    lines.push(`**Check ${idx} \u2014 how this will be graded**`);
+    lines.push("");
+    lines.push(`The tester will be taken back to \`${oneLine(note.route) || "/"}\`` + (target?.selector ? `, shown \`${oneLine(target.selector)}\`` : ", shown this region") + ", and asked: *is this now what I asked for?*");
+    lines.push("");
+    lines.push(`Treat it as done only when the paragraph above is true on that page, on a fresh load, without the tester doing anything extra. Record the outcome against \`check-${idx}\` in \`verify.md\`.`);
+  }
+  lines.push(EVIDENCE_MARK);
   const recordedSteps = note.context?.steps ?? [];
   if (recordedSteps.length) {
     const t0 = Date.parse(note.timestamp) || recordedSteps[recordedSteps.length - 1].t;
@@ -3285,14 +3454,6 @@ function noteToMarkdown(note, opts) {
       lines.push(`${i + 1}. ${formatStep(step, t0)}`);
     });
   }
-  if (idx != null) {
-    lines.push("");
-    lines.push(`**Check ${idx} \u2014 how this will be graded**`);
-    lines.push("");
-    lines.push(`The tester will be taken back to \`${oneLine(note.route) || "/"}\`` + (target?.selector ? `, shown \`${oneLine(target.selector)}\`` : ", shown this region") + ", and asked: *is this now what I asked for?*");
-    lines.push("");
-    lines.push(`Treat it as done only when the paragraph above is true on that page, on a fresh load, without the tester doing anything extra. Record the outcome against \`check-${idx}\` in \`verify.md\`.`);
-  }
   const ctx = note.context;
   if (ctx) {
     const env = ctx.env;
@@ -3339,7 +3500,67 @@ function noteToMarkdown(note, opts) {
     lines.push("");
     lines.push("</details>");
   }
-  return lines.join("\n");
+  const whole = lines.join("\n");
+  if (opts?.keepEvidenceMark) return whole;
+  if (!opts?.contextFile) return whole.replace(`${EVIDENCE_MARK}
+`, "").replace(EVIDENCE_MARK, "");
+  const at = whole.indexOf(EVIDENCE_MARK);
+  const report = at === -1 ? whole : whole.slice(0, at).trimEnd();
+  return `${report}
+
+<sub>Steps, console, network, environment and element forensics: \`${opts.contextFile}\` \u2014 open it only if the words above leave something genuinely unresolved.</sub>`;
+}
+
+// src/lib/reproSpec.ts
+function lit(value) {
+  return value.replace(/\\/g, "\\\\").replace(/'/g, "\\'").replace(/\r?\n/g, " ");
+}
+function line(value, limit = 200) {
+  const one = (value ?? "").replace(/\s+/g, " ").trim();
+  if (!one) return "";
+  return one.length > limit ? `${one.slice(0, limit - 3)}...` : one;
+}
+function reproSpec(note, index) {
+  const selector = note.target?.selector;
+  const route = note.route || "/";
+  if (!selector && !note.route) return null;
+  const observed = line(note.description);
+  const expected = line(note.wanted);
+  const out = [];
+  out.push(`// check-${index} -- DRAFT. Delete this file if the change is cosmetic.`);
+  out.push("//");
+  out.push("// The URL and the selector below were captured from the live page, so");
+  out.push("// they are the tedious part already done. The assertion is yours: only");
+  out.push("// you know whether this point is worth pinning down with a test.");
+  out.push("//");
+  if (observed) out.push(`// Observed: ${observed}`);
+  if (expected) out.push(`// Expected: ${expected}`);
+  else out.push("// Expected: (the tester did not say -- ask before asserting anything)");
+  if (note.origin?.file) {
+    out.push(`// Rendered by: ${note.origin.component ?? "?"} (${note.origin.file}${note.origin.line ? `:${note.origin.line}` : ""})`);
+  }
+  out.push("");
+  out.push("import { test, expect } from '@playwright/test';");
+  out.push("");
+  out.push(`test('check-${index}: ${lit(line(note.description, 60) || "reported point")}', async ({ page }) => {`);
+  out.push(`  await page.goto('${lit(route)}');`);
+  if (selector) {
+    out.push("");
+    out.push(`  const target = page.locator('${lit(selector)}');`);
+    out.push("  await expect(target).toBeVisible();");
+    out.push("");
+    out.push("  // TODO: assert the EXPECTED behaviour quoted above.");
+    out.push("  // Being visible only proves the element is still there -- it does not");
+    out.push("  // prove the thing the tester asked for actually happened.");
+  } else {
+    out.push("");
+    out.push("  // No element was picked for this point -- it was a region or a plain");
+    out.push("  // note. Drive the page to the state described above, then assert.");
+    out.push("  // TODO");
+  }
+  out.push("});");
+  out.push("");
+  return out.join("\n");
 }
 
 // src/lib/exportZip.ts
@@ -3475,7 +3696,15 @@ This archive is not a list of suggestions. Every point in \`notes.md\` is an acc
 
 **What to do.** Do the work, then fill in \`verify.md\`: tick a box only when the check is true on a fresh load of the page named beside it, with the tester doing nothing extra. Where you could not do something, or you think it is the wrong thing to do, leave the box unticked and write one line saying why. An unticked box with a reason is a good answer. A ticked box that does not hold up is the only bad one \u2014 it costs the tester the trip to find out.
 
-Hand \`verify.md\` back with the work.`
+Hand \`verify.md\` back with the work.
+
+### What is in this archive
+
+- \`notes.md\` \u2014 the points themselves. Each one carries **Observed** and **Expected** under those exact headings. They are separate on purpose: where a report leaves the expectation out, agents do not stop and ask, they pick a reading and commit to it. Where you see Expected marked as not given, **ask rather than assume**.
+- \`verify.md\` \u2014 the checklist, one unticked box per point.
+- \`screenshots/\` \u2014 one per point. A point marked with a screenshot caveat was re-drawn rather than photographed, so canvases, charts and maps may be blank in it; trust the words over the picture there.
+- \`context/\` \u2014 console, network, environment and element forensics, one file per point. Deliberately **not** in \`notes.md\`: a longer report measurably lowers the chance of the right thing getting fixed, because the two sentences that matter get buried. Open these only when something is genuinely unresolved.
+- \`repro/\` \u2014 Playwright drafts, one per point, all optional. Finish the ones where the point is behavioural and worth pinning down; delete the ones where it is cosmetic. That judgement is yours.`
   );
   const stack = typeof p.stack === "string" && p.stack.trim() ? p.stack.trim() : "(not provided)";
   const runArr = toStrings(p.runCommands);
@@ -3615,7 +3844,14 @@ async function buildZipBlob(notes, stamp, config, guideChecked, guideSkipped) {
     ""
   ].join("\n");
   const noteBlocks = notes.map(
-    (n, i) => noteToMarkdown(n, { brand: brandLabel, index: i + 1 })
+    (n, i) => noteToMarkdown(n, {
+      brand: brandLabel,
+      index: i + 1,
+      // Runtime evidence goes to its own file and is pointed at from here.
+      // See the contextFile branch in noteMarkdown.ts for why: a long report
+      // measurably lowers an agent's chance of fixing the thing.
+      contextFile: n.context ? `context/point-${i + 1}.md` : void 0
+    })
   );
   const notesBody = noteBlocks.length > 0 ? `${noteBlocks.join("\n\n---\n\n")}
 
@@ -3656,6 +3892,43 @@ async function buildZipBlob(notes, stamp, config, guideChecked, guideSkipped) {
     "Re-open the walkthrough on the tester's machine with `?qa=walk:verify`.",
     ""
   ].join("\n"));
+  const contextDir = zip.folder("context");
+  notes.forEach((n, i) => {
+    if (n.context && contextDir) {
+      contextDir.file(`point-${i + 1}.md`, noteContextMarkdown(n, i + 1));
+    }
+  });
+  const reproDir = zip.folder("repro");
+  let reproCount = 0;
+  notes.forEach((n, i) => {
+    const spec = reproSpec(n, i + 1);
+    if (spec && reproDir) {
+      reproDir.file(`check-${i + 1}.spec.ts`, spec);
+      reproCount++;
+    }
+  });
+  if (reproCount && reproDir) {
+    reproDir.file("README.md", [
+      "# Reproduction drafts",
+      "",
+      "One per point, and every one of them is optional.",
+      "",
+      "**Use one** where the point is behavioural and worth pinning down, so it",
+      "cannot quietly come back later. An executable check is worth far more to",
+      "you than another paragraph of steps written in English.",
+      "",
+      "**Delete it** where the point is cosmetic -- a colour, a spacing, a word.",
+      "A test asserting that a heading is visible proves nothing anybody wanted",
+      "proved, and it is one more file to maintain forever.",
+      "",
+      "That call is yours. The tester was not asked to make it and could not.",
+      "",
+      "What is already done for you in each file: the URL, a selector verified",
+      "against the live DOM at capture time, and the observed and expected",
+      "behaviour quoted in place. What is left is the assertion, marked TODO.",
+      ""
+    ].join("\n"));
+  }
   notes.forEach((n, i) => {
     if (n.screenshot && shots) {
       shots.file(`point-${i + 1}.${shotExtension(n.screenshot)}`, n.screenshot);
@@ -4125,7 +4398,7 @@ function reportMarkdownText(allNotes) {
     "",
     "---",
     ""
-  ].filter((line) => line !== "").join("\n");
+  ].filter((line2) => line2 !== "").join("\n");
   const body = ordered.map((n) => noteMarkdownForDisk(n, noteIndex[n.id])).join("\n---\n\n");
   return `${header}
 ${body}`;
@@ -4300,6 +4573,7 @@ function exactShotsWanted(store) {
 }
 var SIMPLE_MODE_KEY = "simpleMode";
 var COMPACT_KEY = "compactCapture";
+var DEV_MODE_KEY = "developerMode";
 var LAST_CAMPAIGN_KEY = "lastCampaign";
 var AUTO_BACKUP_KEY = "autoBackup";
 var AUTO_BACKUP_AT_KEY = "autoBackupAt";
@@ -4338,6 +4612,7 @@ function QaProvider({
   React.useEffect(() => {
     notesRef.current = notes;
   }, [notes]);
+  const staleStillTimer = React.useRef(null);
   const applyNotes = React.useCallback((updater) => {
     const next = updater(notesRef.current);
     notesRef.current = next;
@@ -4364,7 +4639,15 @@ function QaProvider({
   const [lang, setLangState] = React.useState(() => {
     const saved = storage.getItem(LANG_KEY);
     if (saved === "ar" || saved === "en") return saved;
-    return config.rtl ? "ar" : "en";
+    if (config.rtl) return "ar";
+    try {
+      const html = document.documentElement;
+      if (html.getAttribute("dir") === "rtl") return "ar";
+      if ((html.getAttribute("lang") || "").toLowerCase().startsWith("ar")) return "ar";
+      if ((navigator.language || "").toLowerCase().startsWith("ar")) return "ar";
+    } catch {
+    }
+    return "en";
   });
   const [guideChecked, setGuideChecked] = React.useState(
     () => new Set(storage.getJSON(GUIDE_KEY, []))
@@ -4402,6 +4685,9 @@ function QaProvider({
   const [simpleMode, setSimpleModeState] = React.useState(
     () => storage.getItem(SIMPLE_MODE_KEY) === "1"
   );
+  const [developerMode, setDeveloperModeState] = React.useState(
+    () => storage.getItem(DEV_MODE_KEY) === "1"
+  );
   const [compactCapture, setCompactCaptureState] = React.useState(
     () => storage.getItem(COMPACT_KEY) === "1"
   );
@@ -4731,6 +5017,11 @@ function QaProvider({
         target: input.target ?? void 0,
         severity: input.severity,
         status: input.status,
+        wanted: (input.wanted || "").trim() || void 0,
+        why: (input.why || "").trim() || void 0,
+        fixHint: (input.fixHint || "").trim() || void 0,
+        shotEngine: input.shotEngine,
+        origin: input.origin,
         journeyRef,
         context
       };
@@ -4881,17 +5172,22 @@ function QaProvider({
       flushPendingDeletes();
       for (const timer of noticeTimers.current.values()) clearTimeout(timer);
       noticeTimers.current.clear();
+      if (staleStillTimer.current) {
+        clearTimeout(staleStillTimer.current);
+        staleStillTimer.current = null;
+      }
       releaseFrozenFrame();
     };
   }, [flushPendingDeletes]);
+  const STILL_HOLD_MS = 1e5;
   const startCapture = React.useCallback((prefill) => {
     setIsOpen(false);
     setCapturePrefill(prefill ?? "");
     setCaptureActive(true);
-    setFrozenAt(null);
+    if (!stillIsCurrent()) setFrozenAt(null);
     if (exactShotsWanted(storage) && isExactCaptureSupported()) {
       resetExactCaptureDecline();
-      void freezeViewport().then((frame) => {
+      void freezeOrReuse().then((frame) => {
         setFrozenAt(frame?.takenAt ?? null);
         setExactStatus(getExactCaptureStatus());
       });
@@ -4899,8 +5195,11 @@ function QaProvider({
   }, [storage]);
   const endCapture = React.useCallback((reopen = true) => {
     setCaptureActive(false);
-    releaseFrozenFrame();
-    setFrozenAt(null);
+    if (staleStillTimer.current) clearTimeout(staleStillTimer.current);
+    staleStillTimer.current = setTimeout(() => {
+      releaseFrozenFrame();
+      staleStillTimer.current = null;
+    }, STILL_HOLD_MS);
     if (reopen) setIsOpen(true);
   }, []);
   const toggleGuide = React.useCallback((key) => {
@@ -5125,6 +5424,10 @@ function QaProvider({
     setCompactCaptureState(on);
     storage.setItem(COMPACT_KEY, on ? "1" : "0");
   }, [storage]);
+  const setDeveloperMode = React.useCallback((on) => {
+    setDeveloperModeState(on);
+    storage.setItem(DEV_MODE_KEY, on ? "1" : "0");
+  }, [storage]);
   const setFilter = React.useCallback((patch) => {
     setFilterState((prev) => ({ ...prev, ...patch }));
   }, []);
@@ -5464,6 +5767,7 @@ function QaProvider({
     // Config passthrough
     namespace: config.namespace,
     brand: config.brand,
+    beta: config.beta === true,
     loginField: config.loginField,
     credentials: config.credentials,
     // Never the raw config value: an unconfigured project falls back to the
@@ -5572,6 +5876,8 @@ function QaProvider({
     simpleMode,
     setSimpleMode,
     compactCapture,
+    developerMode,
+    setDeveloperMode,
     setCompactCapture,
     exportZip: exportZipFn
   };
@@ -5639,6 +5945,16 @@ var ICONS = {
   Square: [
     ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2" }]
   ],
+  Info: [
+    ["circle", { cx: "12", cy: "12", r: "10" }],
+    ["path", { d: "M12 16v-4" }],
+    ["path", { d: "M12 8h.01" }]
+  ],
+  Mic: [
+    ["path", { d: "M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z" }],
+    ["path", { d: "M19 10v2a7 7 0 0 1-14 0v-2" }],
+    ["line", { x1: "12", x2: "12", y1: "19", y2: "22" }]
+  ],
   ImagePlus: [
     ["path", { d: "M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h7" }],
     ["line", { x1: "16", x2: "22", y1: "5", y2: "5" }],
@@ -5872,7 +6188,7 @@ function clampFabPos(p, w = FAB_SIZE_PX, h = FAB_SIZE_PX) {
   };
 }
 function QaFab() {
-  const { isOpen, setIsOpen, notes, captureActive, namespace, t } = useQa();
+  const { isOpen, setIsOpen, notes, captureActive, namespace, beta, t } = useQa();
   const [pos, setPos] = React.useState(() => loadFabPos(namespace));
   const dragRef = React.useRef(null);
   const didDragRef = React.useRef(false);
@@ -5985,6 +6301,15 @@ function QaFab() {
           }
         ),
         /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: isOpen ? "X" : "ClipboardList", size: 24 }),
+        beta && !isOpen && /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: "qa-absolute qa-rounded-full qa-text-10 qa-font-bold qa-bg-1 qa-text-mid qa-border qa-border-subtle",
+            style: { bottom: "-6px", left: "50%", transform: "translateX(-50%)", padding: "0 5px", lineHeight: "1.3" },
+            "aria-hidden": "true",
+            children: "beta"
+          }
+        ),
         !isOpen && notes.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
           "span",
           {
@@ -7678,6 +8003,154 @@ function NoteFilterBar() {
     ) })
   ] });
 }
+
+// src/lib/doctor.ts
+var HEAVY_PAGE = 6e3;
+function canvasIsReadable() {
+  try {
+    const c = document.createElement("canvas");
+    c.width = 1;
+    c.height = 1;
+    const ctx = c.getContext("2d");
+    if (!ctx) return false;
+    ctx.fillStyle = "#000";
+    ctx.fillRect(0, 0, 1, 1);
+    c.toDataURL();
+    return true;
+  } catch {
+    return false;
+  }
+}
+function taintingImages() {
+  let count = 0;
+  const here = location.origin;
+  for (const img of Array.from(document.images)) {
+    const src = img.currentSrc || img.src;
+    if (!src || src.startsWith("data:") || src.startsWith("blob:")) continue;
+    try {
+      if (new URL(src, here).origin !== here && !img.crossOrigin) count++;
+    } catch {
+    }
+  }
+  return count;
+}
+async function runDoctor() {
+  const out = [];
+  if (typeof document === "undefined") return out;
+  const supported = isExactCaptureSupported();
+  const status = getExactCaptureStatus();
+  out.push(
+    !supported ? {
+      label: "Screenshot engine",
+      verdict: "warn",
+      detail: "This browser cannot photograph the tab, so screenshots are re-drawn. Charts, maps and anything on a canvas may come out blank. Chrome or Edge can photograph."
+    } : status === "live" ? { label: "Screenshot engine", verdict: "ok", detail: "Real photographs. This is the accurate one." } : {
+      label: "Screenshot engine",
+      verdict: "warn",
+      detail: "Photographs are switched off, so screenshots are re-drawn and may not match the page."
+    }
+  );
+  const readable = canvasIsReadable();
+  const risky = taintingImages();
+  out.push(
+    !readable ? {
+      label: "Screenshot encoding",
+      verdict: "bad",
+      detail: "This page cannot turn a drawing into an image at all. Re-drawn screenshots will fail here; use photographs."
+    } : risky > 0 ? {
+      label: "Screenshot encoding",
+      verdict: "info",
+      detail: `${risky} image(s) come from another site without permission to be read. They are skipped and appear blank in a re-drawn screenshot; photographs are unaffected.`
+    } : { label: "Screenshot encoding", verdict: "ok", detail: "Nothing on this page blocks screenshot encoding." }
+  );
+  const nodes = document.getElementsByTagName("*").length;
+  out.push({
+    label: "Page size",
+    verdict: nodes > HEAVY_PAGE ? "warn" : "ok",
+    detail: nodes > HEAVY_PAGE ? `${nodes.toLocaleString()} elements. Too many to re-draw without freezing the tab, so re-drawn screenshots are refused here. Photographs work fine.` : `${nodes.toLocaleString()} elements. Comfortable for either engine.`
+  });
+  try {
+    await import('html2canvas');
+    out.push({ label: "Screenshot library", verdict: "ok", detail: "Loads correctly." });
+  } catch {
+    out.push({
+      label: "Screenshot library",
+      verdict: "bad",
+      detail: "Blocked or unreachable \u2014 often a strict Content-Security-Policy. Re-drawn screenshots cannot work here."
+    });
+  }
+  try {
+    const est = await navigator.storage?.estimate?.();
+    if (est?.quota) {
+      const usedPct = Math.round((est.usage ?? 0) / est.quota * 100);
+      out.push({
+        label: "Storage",
+        verdict: usedPct > 90 ? "bad" : usedPct > 70 ? "warn" : "ok",
+        detail: `${usedPct}% of this site's storage used. Notes are kept in this browser until you export them.`
+      });
+    }
+  } catch {
+  }
+  const voice = typeof window !== "undefined" && !!(window.SpeechRecognition || window.webkitSpeechRecognition);
+  out.push({
+    label: "Voice input",
+    verdict: voice ? "ok" : "info",
+    detail: voice ? "Available \u2014 you can speak your notes." : "Not available in this browser. Typing still works."
+  });
+  out.push({
+    label: "Secure connection",
+    verdict: window.isSecureContext ? "ok" : "bad",
+    detail: window.isSecureContext ? "https \u2014 photographs and voice are allowed." : "Not https. Photographs and voice are blocked by the browser on an insecure page."
+  });
+  return out;
+}
+
+// src/lib/versionCheck.ts
+var CACHE_KEY = "qa.versionCheck";
+var A_DAY = 24 * 60 * 60 * 1e3;
+var REGISTRY = "https://registry.npmjs.org/qapture2/latest";
+function isNewer(latest, current) {
+  const norm = (v) => v.replace(/^[^\d]*/, "").split("-")[0].split(".").map((n) => parseInt(n, 10) || 0);
+  const a = norm(latest);
+  const b = norm(current);
+  for (let i = 0; i < Math.max(a.length, b.length); i++) {
+    const x = a[i] ?? 0;
+    const y = b[i] ?? 0;
+    if (x !== y) return x > y;
+  }
+  return false;
+}
+async function latestVersion() {
+  if (typeof window === "undefined") return null;
+  try {
+    const raw = window.localStorage.getItem(CACHE_KEY);
+    if (raw) {
+      const cached = JSON.parse(raw);
+      if (Date.now() - cached.at < A_DAY && cached.latest) return cached.latest;
+    }
+  } catch {
+  }
+  try {
+    const res = await fetch(REGISTRY, { headers: { accept: "application/json" } });
+    if (!res.ok) return null;
+    const body = await res.json();
+    const latest = body.version;
+    if (!latest) return null;
+    try {
+      window.localStorage.setItem(CACHE_KEY, JSON.stringify({ at: Date.now(), latest }));
+    } catch {
+    }
+    return latest;
+  } catch {
+    return null;
+  }
+}
+function upgradeHint(latest) {
+  return `npm i qapture2@${latest}`;
+}
+
+// src/version.ts
+var QA_VERSION = "0.9.0" ;
 function Section({
   icon,
   title,
@@ -7740,8 +8213,24 @@ function SettingsSheet({ onClose }) {
     setSimpleMode,
     compactCapture,
     setCompactCapture,
+    developerMode,
+    setDeveloperMode,
     notes
   } = useQa();
+  const [checks, setChecks] = React.useState([]);
+  const [running, setRunning] = React.useState(false);
+  const [faults2, setFaults] = React.useState(() => readFaults());
+  const [latest, setLatest] = React.useState(null);
+  React.useEffect(() => {
+    let alive = true;
+    void latestVersion().then((v) => {
+      if (alive) setLatest(v);
+    });
+    setFaults(readFaults());
+    return () => {
+      alive = false;
+    };
+  }, []);
   const [project, setProject] = React.useState(lastCampaign.project);
   const [campaign2, setCampaign] = React.useState(lastCampaign.campaign || suggestCampaignName());
   const [tester, setTester] = React.useState(lastCampaign.tester);
@@ -8016,6 +8505,20 @@ function SettingsSheet({ onClose }) {
           ] }),
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "qa-h-px qa-bg-3 qa-mt-3 qa-mb-4" }),
           /* @__PURE__ */ jsxRuntime.jsxs(Section, { icon: "Settings", title: t("settings"), children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "qa-flex qa-items-start qa-gap-2 qa-text-xs qa-text-hi", style: { cursor: "pointer" }, children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "input",
+                {
+                  type: "checkbox",
+                  checked: developerMode,
+                  onChange: (e) => setDeveloperMode(e.target.checked)
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
+                t("dev_mode_label"),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "qa-block qa-text-10 qa-text-mid", children: t("dev_mode_hint") })
+              ] })
+            ] }),
             /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "qa-flex qa-items-center qa-gap-2 qa-text-xs qa-text-hi", style: { cursor: "pointer" }, children: [
               /* @__PURE__ */ jsxRuntime.jsx(
                 "input",
@@ -8038,6 +8541,91 @@ function SettingsSheet({ onClose }) {
               ),
               t("compact_mode")
             ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs(Section, { icon: "Info", title: t("diag_title"), children: [
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "qa-text-10 qa-text-mid", children: t("diag_hint") }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "qa-flex qa-items-center qa-gap-2 qa-flex-wrap", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => void (async () => {
+                    setRunning(true);
+                    try {
+                      setChecks(await runDoctor());
+                    } finally {
+                      setRunning(false);
+                    }
+                  })(),
+                  disabled: running,
+                  "data-qa-doctor": "true",
+                  className: "qa-tap qa-inline-flex qa-items-center qa-gap-1.5 qa-rounded-md qa-border qa-border-subtle qa-px-2 qa-py-1 qa-text-xs qa-text-hi qa-focus-ring",
+                  style: { background: "transparent", cursor: "pointer" },
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: "Check", size: 13 }),
+                    running ? t("diag_running") : t("diag_run")
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "qa-text-10 qa-text-mid", children: [
+                t("diag_version", { v: QA_VERSION }),
+                latest && isNewer(latest, QA_VERSION) ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                  " \xB7 ",
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "qa-text-warn", children: t("diag_outdated", { v: latest }) }),
+                  /* @__PURE__ */ jsxRuntime.jsx("code", { className: "qa-ms-1", children: upgradeHint(latest) })
+                ] }) : latest ? ` \xB7 ${t("diag_current")}` : ""
+              ] })
+            ] }),
+            checks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "qa-space-y-1", "data-qa-doctor-results": "true", children: checks.map((c) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "qa-text-11 qa-text-hi", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "span",
+                {
+                  "aria-hidden": true,
+                  className: c.verdict === "ok" ? "qa-text-success" : c.verdict === "bad" ? "qa-text-danger" : c.verdict === "warn" ? "qa-text-warn" : "qa-text-mid",
+                  children: c.verdict === "ok" ? "\u25CF" : c.verdict === "bad" ? "\u25B2" : c.verdict === "warn" ? "\u25B2" : "\u25CB"
+                }
+              ),
+              " ",
+              /* @__PURE__ */ jsxRuntime.jsx("strong", { children: c.label }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "qa-block qa-text-10 qa-text-mid qa-ms-3", children: c.detail })
+            ] }, c.label)) }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "qa-flex qa-items-center qa-gap-2 qa-flex-wrap", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "qa-text-11 qa-text-mid", children: t("diag_faults", { n: faults2.length }) }),
+              faults2.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => void navigator.clipboard?.writeText(faultsAsText(QA_VERSION)),
+                    className: "qa-tap qa-rounded-md qa-border qa-border-subtle qa-px-2 qa-py-0.5 qa-text-10 qa-text-hi",
+                    style: { background: "transparent", cursor: "pointer" },
+                    children: t("copy_prompt")
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => {
+                      clearFaults();
+                      setFaults([]);
+                    },
+                    className: "qa-tap qa-rounded-md qa-border qa-border-subtle qa-px-2 qa-py-0.5 qa-text-10 qa-text-mid",
+                    style: { background: "transparent", cursor: "pointer" },
+                    children: t("clear_all")
+                  }
+                )
+              ] })
+            ] }),
+            faults2.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "qa-space-y-0.5", children: faults2.slice(0, 5).map((f, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "qa-text-10 qa-text-mid", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("code", { children: [
+                "[",
+                f.where,
+                "]"
+              ] }),
+              " ",
+              f.what
+            ] }, `${f.at}-${i}`)) })
           ] })
         ] })
       ]
@@ -8372,17 +8960,17 @@ function QaPanel() {
       if (typeof window === "undefined") return 0;
       const vv = window.visualViewport;
       if (!vv) return 0;
-      const overlap = Math.max(0, window.innerHeight - vv.height - vv.offsetTop);
-      if (overlap <= KEYBOARD_OVERLAP_THRESHOLD) return 0;
+      const overlap2 = Math.max(0, window.innerHeight - vv.height - vv.offsetTop);
+      if (overlap2 <= KEYBOARD_OVERLAP_THRESHOLD) return 0;
       const panel = panelRef.current;
       if (!panel) return 0;
       const root2 = panel.getRootNode();
       const active = root2.activeElement;
       if (!active || !panel.contains(active)) return 0;
       const tag = active.tagName;
-      if (tag === "TEXTAREA") return Math.round(overlap) + KEYBOARD_LIFT_GAP;
+      if (tag === "TEXTAREA") return Math.round(overlap2) + KEYBOARD_LIFT_GAP;
       if (tag === "INPUT" && !NON_TEXT_INPUT_TYPES.has(active.type)) {
-        return Math.round(overlap) + KEYBOARD_LIFT_GAP;
+        return Math.round(overlap2) + KEYBOARD_LIFT_GAP;
       }
       return 0;
     } catch {
@@ -9322,6 +9910,209 @@ function unlockPageScroll() {
     window.removeEventListener("touchmove", preventScroll, LISTENER_OPTIONS);
   }
 }
+
+// src/lib/origin.ts
+function fiberOf(el) {
+  for (const key in el) {
+    if (key.startsWith("__reactFiber$") || key.startsWith("__reactInternalInstance$")) {
+      return el[key] ?? null;
+    }
+  }
+  return null;
+}
+function nameOf(fiber) {
+  const type = fiber.type;
+  if (!type || typeof type === "string") return null;
+  const direct = type.displayName || type.name;
+  if (direct) return direct;
+  const inner = type.render?.displayName || type.render?.name;
+  return inner || null;
+}
+function tidyPath(file) {
+  const marks = ["/src/", "/app/", "/components/", "/pages/", "/lib/"];
+  for (const mark of marks) {
+    const at = file.lastIndexOf(mark);
+    if (at !== -1) return file.slice(at + 1);
+  }
+  return file.split("/").slice(-2).join("/");
+}
+var MAX_WALK = 30;
+function resolveOrigin(el) {
+  if (!el || typeof window === "undefined") return void 0;
+  let fiber;
+  try {
+    fiber = fiberOf(el);
+  } catch {
+    return void 0;
+  }
+  if (!fiber) return void 0;
+  const out = {};
+  let hops = 0;
+  for (let f = fiber; f && hops < MAX_WALK; f = f.return ?? null, hops++) {
+    if (!out.component) {
+      const name = nameOf(f);
+      if (name) out.component = name;
+    }
+    if (!out.file) {
+      const src = f._debugSource;
+      if (src?.fileName) {
+        out.file = tidyPath(src.fileName);
+        if (typeof src.lineNumber === "number") out.line = src.lineNumber;
+      }
+    }
+    if (out.component && out.file) break;
+  }
+  return out.component || out.file ? out : void 0;
+}
+
+// src/lib/duplicate.ts
+var NOISE = /* @__PURE__ */ new Set([
+  "the",
+  "this",
+  "that",
+  "a",
+  "an",
+  "is",
+  "it",
+  "to",
+  "and",
+  "of",
+  "in",
+  "on",
+  "for",
+  "be",
+  "should",
+  "i",
+  "we",
+  "please",
+  "here",
+  "\u0647\u0630\u0627",
+  "\u0647\u0630\u0647",
+  "\u0641\u064A",
+  "\u0645\u0646",
+  "\u0639\u0644\u0649",
+  "\u0627\u0644\u0649",
+  "\u0625\u0644\u0649",
+  "\u0627\u0646",
+  "\u0623\u0646",
+  "\u0648",
+  "\u0627\u0644"
+]);
+function words(text) {
+  return new Set(
+    (text || "").toLowerCase().replace(/[^\p{L}\p{N}\s]/gu, " ").split(/\s+/).filter((w) => w.length > 1 && !NOISE.has(w))
+  );
+}
+function overlap(a, b) {
+  if (!a.size || !b.size) return 0;
+  let shared = 0;
+  for (const w of a) if (b.has(w)) shared++;
+  return shared / (a.size + b.size - shared);
+}
+var SAME_ENOUGH = 0.7;
+function findDuplicate(text, selector, existing) {
+  const typed = words(text);
+  if (typed.size < 3) return null;
+  for (const note of existing) {
+    if (selector && note.target?.selector && note.target.selector !== selector) continue;
+    if (selector && !note.target?.selector) continue;
+    if (!selector && note.target?.selector) continue;
+    if (overlap(typed, words(note.description)) >= SAME_ENOUGH) return note;
+  }
+  return null;
+}
+function recogniser() {
+  if (typeof window === "undefined") return null;
+  const w = window;
+  return w.SpeechRecognition ?? w.webkitSpeechRecognition ?? null;
+}
+function VoiceButton({
+  onText,
+  onInterim
+}) {
+  const { lang, t } = useQa();
+  const [listening, setListening] = React.useState(false);
+  const [failed, setFailed] = React.useState(null);
+  const ref = React.useRef(null);
+  React.useEffect(() => () => {
+    ref.current?.abort();
+    ref.current = null;
+  }, []);
+  const Ctor = recogniser();
+  if (!Ctor) return null;
+  const stop = () => {
+    ref.current?.stop();
+    ref.current = null;
+    setListening(false);
+    onInterim?.("");
+  };
+  const start = () => {
+    if (listening) {
+      stop();
+      return;
+    }
+    setFailed(null);
+    let rec;
+    try {
+      rec = new Ctor();
+    } catch {
+      setFailed(t("voice_failed"));
+      return;
+    }
+    rec.lang = lang === "ar" ? "ar-IQ" : "en-US";
+    rec.continuous = true;
+    rec.interimResults = true;
+    rec.onresult = (e) => {
+      let done = "";
+      let partial = "";
+      for (let i = e.resultIndex; i < e.results.length; i++) {
+        const r = e.results[i];
+        const text = r[0]?.transcript ?? "";
+        if (r.isFinal) done += text;
+        else partial += text;
+      }
+      if (done.trim()) onText(done.trim());
+      onInterim?.(partial);
+    };
+    rec.onerror = (e) => {
+      if (e.error && e.error !== "no-speech" && e.error !== "aborted") {
+        setFailed(e.error === "not-allowed" ? t("voice_denied") : t("voice_failed"));
+      }
+      setListening(false);
+      onInterim?.("");
+    };
+    rec.onend = () => {
+      setListening(false);
+      onInterim?.("");
+    };
+    try {
+      rec.start();
+      ref.current = rec;
+      setListening(true);
+    } catch {
+      setFailed(t("voice_failed"));
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "qa-inline-flex qa-items-center qa-gap-1.5", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: start,
+        "aria-pressed": listening,
+        title: listening ? t("voice_stop") : t("voice_start"),
+        "data-qa-voice": listening ? "listening" : "idle",
+        className: `qa-tap qa-inline-flex qa-items-center qa-gap-1 qa-rounded-full qa-border qa-border-subtle qa-px-2 qa-py-1 qa-text-11 qa-focus-ring ${listening ? "qa-bg-danger-tint qa-text-danger" : "qa-bg-2 qa-text-mid"}`,
+        style: { cursor: "pointer" },
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Icon, { name: listening ? "Square" : "Mic", size: 12 }),
+          listening ? t("voice_stop") : t("voice_start")
+        ]
+      }
+    ),
+    failed && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "qa-text-10 qa-text-danger", children: failed })
+  ] });
+}
 var DRAG_THRESHOLD2 = 6;
 var TOUCH_DRAG_THRESHOLD = 12;
 var MIN_REGION_SIZE = 8;
@@ -9376,6 +10167,8 @@ function CaptureMode() {
     setCompactCapture,
     exactShots,
     photographNow,
+    developerMode,
+    notes,
     capturePrefill
   } = useQa();
   const coarse = useCoarsePointer();
@@ -9391,12 +10184,21 @@ function CaptureMode() {
   const [shot, setShot] = React.useState(null);
   const stillRef = React.useRef(null);
   const [notesFromThisShot, setNotesFromThisShot] = React.useState(0);
+  const [wanted, setWanted] = React.useState("");
+  const [why, setWhy] = React.useState("");
+  const [fixHint, setFixHint] = React.useState("");
+  const [origin, setOrigin] = React.useState(void 0);
+  const [spoken, setSpoken] = React.useState("");
   const [shotEngine, setShotEngine] = React.useState(null);
   const [shotUrl, setShotUrl] = React.useState(null);
   const [capturing, setCapturing] = React.useState(false);
   const [captureError, setCaptureError] = React.useState(false);
   const [tooHeavy, setTooHeavy] = React.useState(false);
   const [description, setDescription] = React.useState(capturePrefill);
+  const twin = React.useMemo(
+    () => description.trim().length > 8 ? findDuplicate(description, selection?.selector, notes) : null,
+    [description, selection, notes]
+  );
   const [severity, setSeverity] = React.useState("bug");
   const [targetForensics, setTargetForensics] = React.useState(void 0);
   const taRef = React.useRef(null);
@@ -9538,6 +10340,7 @@ function CaptureMode() {
     if (regionRect) {
       const sel2 = { kind: "region", rect: regionRect };
       setTargetForensics(void 0);
+      setOrigin(void 0);
       if (coarse) {
         setCandidate(sel2);
         setPhase("confirming");
@@ -9560,6 +10363,7 @@ function CaptureMode() {
       tagName: el.tagName.toLowerCase()
     };
     setTargetForensics(collectTargetForensics(el));
+    setOrigin(resolveOrigin(el));
     if (coarse) {
       setCandidate(sel);
       setHover({ rect: sel.rect, selector: sel.selector || "" });
@@ -9704,8 +10508,12 @@ function CaptureMode() {
     setShot(null);
     setShotEngine(null);
     setDescription("");
+    setWanted("");
+    setWhy("");
+    setFixHint("");
     setSeverity("bug");
     setTargetForensics(void 0);
+    setOrigin(void 0);
     setCaptureError(false);
   }, []);
   const save = async (keepGoing = false) => {
@@ -9725,9 +10533,14 @@ function CaptureMode() {
     };
     await addNote({
       description,
+      wanted,
+      why,
+      fixHint,
       screenshot: shot ?? void 0,
+      shotEngine: shotEngine ?? void 0,
       target,
       severity,
+      origin,
       forensics: selection.kind === "element" ? targetForensics : void 0
     });
     if (keepGoing) {
@@ -10357,8 +11170,8 @@ function CaptureMode() {
                 ]
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx(LocationReveal, { target: selection }),
-            /* @__PURE__ */ jsxRuntime.jsxs(
+            developerMode && /* @__PURE__ */ jsxRuntime.jsx(LocationReveal, { target: selection }),
+            developerMode && /* @__PURE__ */ jsxRuntime.jsxs(
               "div",
               {
                 role: "group",
@@ -10388,24 +11201,98 @@ function CaptureMode() {
                 ]
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "textarea",
-              {
-                ref: taRef,
-                value: description,
-                onChange: (e) => setDescription(e.target.value),
-                onKeyDown: (e) => {
-                  if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) void save(e.shiftKey);
-                  if ((e.altKey || e.metaKey || e.ctrlKey) && SEVERITIES2[Number(e.key) - 1]) {
-                    e.preventDefault();
-                    setSeverity(SEVERITIES2[Number(e.key) - 1]);
+            twin && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "qa-text-10 qa-text-warn", "data-qa-duplicate": "true", children: [
+              t("dup_notice", { when: new Date(twin.timestamp).toLocaleTimeString() }),
+              " \u201C",
+              twin.description.slice(0, 70),
+              twin.description.length > 70 ? "\u2026" : "",
+              "\u201D"
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "qa-flex qa-flex-col qa-gap-1", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "qa-flex qa-items-center qa-justify-between qa-gap-2", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "qa-text-11 qa-font-semibold qa-text-hi", children: t("q_observed") }),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  VoiceButton,
+                  {
+                    onText: (text) => setDescription((d) => d ? `${d} ${text}` : text),
+                    onInterim: setSpoken
                   }
-                },
-                rows: 3,
-                placeholder: t("annotate_placeholder"),
-                className: "qa-w-full qa-resize-y qa-rounded-lg qa-border qa-border-subtle qa-bg-0 qa-text-hi qa-px-2 qa-py-1.5 qa-text-sm qa-focus-ring"
-              }
-            ),
+                )
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "textarea",
+                {
+                  ref: taRef,
+                  value: description + (spoken ? ` ${spoken}` : ""),
+                  onChange: (e) => setDescription(e.target.value),
+                  onKeyDown: (e) => {
+                    if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) void save(e.shiftKey);
+                    if ((e.altKey || e.metaKey || e.ctrlKey) && SEVERITIES2[Number(e.key) - 1]) {
+                      e.preventDefault();
+                      setSeverity(SEVERITIES2[Number(e.key) - 1]);
+                    }
+                  },
+                  rows: 2,
+                  placeholder: t("q_observed_hint"),
+                  className: "qa-w-full qa-resize-y qa-rounded-lg qa-border qa-border-subtle qa-bg-0 qa-text-hi qa-px-2 qa-py-1.5 qa-text-sm qa-focus-ring"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "qa-flex qa-flex-col qa-gap-1", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "qa-flex qa-items-center qa-justify-between qa-gap-2", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "qa-text-11 qa-font-semibold qa-text-hi", children: t("q_wanted") }),
+                /* @__PURE__ */ jsxRuntime.jsx(VoiceButton, { onText: (x) => setWanted((d) => d ? `${d} ${x}` : x) })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "textarea",
+                {
+                  value: wanted,
+                  onChange: (e) => setWanted(e.target.value),
+                  onKeyDown: (e) => {
+                    if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) void save(e.shiftKey);
+                  },
+                  rows: 2,
+                  placeholder: t("q_wanted_hint"),
+                  className: "qa-w-full qa-resize-y qa-rounded-lg qa-border qa-border-subtle qa-bg-0 qa-text-hi qa-px-2 qa-py-1.5 qa-text-sm qa-focus-ring"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "qa-flex qa-flex-col qa-gap-1", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "qa-flex qa-items-center qa-justify-between qa-gap-2", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "qa-text-11 qa-text-mid", children: t("q_why") }),
+                /* @__PURE__ */ jsxRuntime.jsx(VoiceButton, { onText: (x) => setWhy((d) => d ? `${d} ${x}` : x) })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "textarea",
+                {
+                  value: why,
+                  onChange: (e) => setWhy(e.target.value),
+                  onKeyDown: (e) => {
+                    if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) void save(e.shiftKey);
+                  },
+                  rows: 1,
+                  placeholder: t("q_why_hint"),
+                  className: "qa-w-full qa-resize-y qa-rounded-lg qa-border qa-border-subtle qa-bg-0 qa-text-hi qa-px-2 qa-py-1.5 qa-text-sm qa-focus-ring"
+                }
+              )
+            ] }),
+            developerMode && /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "qa-flex qa-flex-col qa-gap-1", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "qa-text-11 qa-text-mid", children: t("q_fix") }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "textarea",
+                {
+                  value: fixHint,
+                  onChange: (e) => setFixHint(e.target.value),
+                  rows: 1,
+                  placeholder: t("q_fix_hint"),
+                  className: "qa-w-full qa-resize-y qa-rounded-lg qa-border qa-border-subtle qa-bg-0 qa-text-hi qa-px-2 qa-py-1.5 qa-text-sm qa-focus-ring"
+                }
+              )
+            ] }),
+            developerMode && origin && (origin.component || origin.file) && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "qa-text-10 qa-text-mid", "data-qa-origin": "true", children: [
+              origin.component ?? "\u2014",
+              origin.file ? ` \xB7 ${origin.file}${origin.line ? `:${origin.line}` : ""}` : ""
+            ] }),
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "qa-flex qa-items-center qa-gap-2", children: [
               /* @__PURE__ */ jsxRuntime.jsxs(
                 "button",
@@ -10447,8 +11334,7 @@ function CaptureMode() {
             ] }),
             /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "qa-text-center qa-text-10 qa-text-slate-400", children: [
               t("save_hint"),
-              " \xB7 ",
-              t("severity_keys")
+              developerMode ? ` \xB7 ${t("severity_keys")}` : ""
             ] })
           ] })
         ]
@@ -10656,5 +11542,5 @@ function Qapture({ config }) {
 exports.Qapture = Qapture;
 exports.deleteQaDatabase = deleteQaDatabase;
 exports.initQaStudio = initQaStudio;
-//# sourceMappingURL=chunk-IYQ5JZJX.cjs.map
-//# sourceMappingURL=chunk-IYQ5JZJX.cjs.map
+//# sourceMappingURL=chunk-5EWNGJ2N.cjs.map
+//# sourceMappingURL=chunk-5EWNGJ2N.cjs.map