@specific.dev/spectest 0.28.3 → 0.29.0

package/dist/browser.js

@@ -550,6 +550,87 @@ const RRWEB_BOOTSTRAP = `
       }, true);
     } catch (e) { log("init FAIL " + (e && e.message)); }
   })();
+  // ── Record form resets as synthetic Input events ───────────────────
+  // rrweb learns that a control's value changed through exactly two
+  // channels: the \`input\`/\`change\` events, and setters it hooks on the
+  // HTMLInput/TextArea/SelectElement prototypes. A **form reset** uses
+  // neither — the browser clears the controls internally — so the
+  // recording keeps the last typed value forever while the real page
+  // shows an empty field. Measured, not assumed: \`el.value = x\` IS
+  // captured (even through React's own per-node \`value\` accessor, since
+  // that delegates to the prototype descriptor we hooked first), and
+  // \`form.reset()\` is NOT. The shape is everywhere in chat/prompt UIs —
+  // shadcn/ai-elements' PromptInput resets the form on submit, as does
+  // React 19's automatic \`<form action>\` reset — where it reads as
+  // "clicking send didn't clear the box".
+  //
+  // The \`reset\` event is the hook: it fires (cancelable) BEFORE the
+  // controls are reset, for both \`form.reset()\` and a user-clicked
+  // \`type="reset"\` button. Snapshot the values there, diff on the next
+  // task, and push an Input event per control that actually moved —
+  // byte-identical in shape to what rrweb emits for a real input, so
+  // the replayer applies it the same way. A prevented or no-op reset
+  // changes nothing and therefore emits nothing. We never touch the
+  // page's DOM to provoke a recording (\`el.value = el.value\` would
+  // work, but it sets the control's dirty-value flag and would change
+  // how the app's own later attribute writes render).
+  (function () {
+    if (window.__spectestFormReset) return;
+    window.__spectestFormReset = true;
+    var INPUT_TAGS = ["INPUT", "TEXTAREA", "SELECT"];
+    function snap(form) {
+      var out = [], els;
+      try { els = form.elements; } catch (e) { return out; }
+      if (!els) return out;
+      for (var i = 0; i < els.length; i++) {
+        var el = els[i];
+        if (!el || !el.tagName) continue;
+        if (INPUT_TAGS.indexOf(String(el.tagName).toUpperCase()) < 0) continue;
+        out.push({ el: el, value: el.value, checked: !!el.checked });
+      }
+      return out;
+    }
+    function emitChanged(before) {
+      var mirror = rec && rec.mirror;
+      if (!mirror || typeof mirror.getId !== "function") return;
+      for (var i = 0; i < before.length; i++) {
+        var el = before[i].el;
+        if (el.value === before[i].value && !!el.checked === before[i].checked) continue;
+        if (el.classList && el.classList.contains("rr-ignore")) continue;
+        var id = mirror.getId(el);
+        if (!(id > 0)) continue;
+        var type = el.type ? String(el.type).toLowerCase() : "";
+        var text = String(el.value);
+        // rrweb masks password inputs by default (maskInputOptions
+        // \`{ password: true }\`, default maskInputFn = same-length '*').
+        if (type === "password") {
+          var masked = "";
+          for (var k = 0; k < text.length; k++) masked += "*";
+          text = masked;
+        }
+        window.__spectestRrwebEvents.push({
+          type: 3,
+          data: {
+            source: 5,
+            text: text,
+            isChecked: (type === "radio" || type === "checkbox") ? !!el.checked : false,
+            id: id,
+          },
+          timestamp: Date.now(),
+        });
+      }
+    }
+    try {
+      document.addEventListener("reset", function (ev) {
+        var form = ev.target;
+        if (!form || !form.tagName || String(form.tagName).toUpperCase() !== "FORM") return;
+        var before = snap(form);
+        if (!before.length) return;
+        // The controls are reset after dispatch returns — diff then.
+        setTimeout(function () { emitChanged(before); }, 0);
+      }, true);
+    } catch (e) { /* recording continues without reset capture. */ }
+  })();
 })();
 `;
 // The `;` between parts is load-bearing: a vendored bundle that ends

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@specific.dev/spectest",
-  "version": "0.28.3",
+  "version": "0.29.0",
   "description": "Spectest SDK for defining test environments in TypeScript.",
   "type": "module",
   "main": "./dist/index.js",