@sailfish-ai/recorder 1.10.5 → 1.10.6

package/dist/chunkSerializer.js

@@ -0,0 +1,210 @@
+// Async chunked DOM serializer producing rrweb-compatible node trees.
+// Used when chunkSnapshot is enabled to break the initial DOM walk into
+// yielding chunks, reducing Total Blocking Time.
+import { yieldToMain } from "./scheduler";
+// rrweb serialized node type IDs (matches @sailfish-rrweb/types NodeType)
+const DOCUMENT = 0;
+const DOCUMENT_TYPE = 1;
+const ELEMENT = 2;
+const TEXT = 3;
+const CDATA = 4;
+const COMMENT = 5;
+/**
+ * ID offset for chunked serialization. Avoids collision with rrweb's internal
+ * genId counter (starts at 1, increments per node) which is used by the
+ * MutationObserver for nodes added after recording starts.
+ */
+const CHUNK_ID_BASE = 100_001;
+/**
+ * Async chunked DOM serializer. Walks the document tree producing an
+ * rrweb-compatible serialized node tree, yielding to the main thread
+ * every `chunkSize` nodes or `maxChunkMs` milliseconds (whichever first).
+ *
+ * Nodes removed between yield points are silently skipped.
+ * Returns null if the document cannot be serialized.
+ */
+export async function chunkedSnapshot(doc, mirror, options = {}) {
+    const chunkSize = options.chunkSize ?? 500;
+    const maxChunkMs = options.maxChunkMs ?? 16;
+    const { blockClass, blockSelector, maskTextClass, maskTextSelector } = options;
+    let nextId = CHUNK_ID_BASE;
+    let nodeCount = 0;
+    let chunkStart = performance.now();
+    function genId(node) {
+        if (mirror.hasNode(node))
+            return mirror.getId(node);
+        const id = nextId++;
+        mirror.add(node, { id });
+        return id;
+    }
+    async function maybeYield() {
+        nodeCount++;
+        if (nodeCount % chunkSize === 0 ||
+            performance.now() - chunkStart > maxChunkMs) {
+            await yieldToMain();
+            chunkStart = performance.now();
+        }
+    }
+    function isBlocked(el) {
+        if (blockClass && el.classList?.contains(blockClass))
+            return true;
+        if (blockSelector) {
+            try {
+                if (el.matches(blockSelector))
+                    return true;
+            }
+            catch {
+                /* invalid selector */
+            }
+        }
+        return false;
+    }
+    function shouldMaskText(node) {
+        const parent = node.parentElement;
+        if (!parent)
+            return false;
+        if (maskTextClass && parent.closest(`.${maskTextClass}`))
+            return true;
+        if (maskTextSelector) {
+            try {
+                if (parent.closest(maskTextSelector))
+                    return true;
+            }
+            catch {
+                /* invalid selector */
+            }
+        }
+        return false;
+    }
+    function getAttributes(el) {
+        const attrs = {};
+        for (let i = 0; i < el.attributes.length; i++) {
+            const attr = el.attributes[i];
+            attrs[attr.name] = attr.value;
+        }
+        const tag = el.tagName;
+        // Capture live input/textarea/select values
+        if (tag === "INPUT" || tag === "TEXTAREA" || tag === "SELECT") {
+            const input = el;
+            if (input.value !== undefined && input.value !== "") {
+                attrs.value = input.value;
+            }
+        }
+        if (tag === "INPUT") {
+            const input = el;
+            if (input.type === "checkbox" || input.type === "radio") {
+                attrs.checked = input.checked;
+            }
+        }
+        if (tag === "OPTION") {
+            attrs.selected = el.selected;
+        }
+        return attrs;
+    }
+    async function serialize(node) {
+        // Node removed from DOM during a yield — skip silently
+        if (node !== doc && !node.parentNode)
+            return null;
+        await maybeYield();
+        switch (node.nodeType) {
+            case Node.DOCUMENT_NODE: {
+                const id = genId(node);
+                const childNodes = [];
+                for (const child of Array.from(node.childNodes)) {
+                    const s = await serialize(child);
+                    if (s)
+                        childNodes.push(s);
+                }
+                return { type: DOCUMENT, childNodes, id };
+            }
+            case Node.DOCUMENT_TYPE_NODE: {
+                const dt = node;
+                return {
+                    type: DOCUMENT_TYPE,
+                    childNodes: [],
+                    id: genId(node),
+                    name: dt.name,
+                    publicId: dt.publicId,
+                    systemId: dt.systemId,
+                };
+            }
+            case Node.ELEMENT_NODE: {
+                const el = node;
+                const id = genId(node);
+                const tagName = el.tagName.toLowerCase();
+                const isSVG = el.namespaceURI === "http://www.w3.org/2000/svg" || undefined;
+                // Blocked elements: placeholder without children
+                if (isBlocked(el)) {
+                    return {
+                        type: ELEMENT,
+                        tagName,
+                        attributes: getAttributes(el),
+                        childNodes: [],
+                        id,
+                        isSVG,
+                        needBlock: true,
+                    };
+                }
+                const childNodes = [];
+                for (const child of Array.from(el.childNodes)) {
+                    if (!child.parentNode)
+                        continue; // removed during yield
+                    const s = await serialize(child);
+                    if (s)
+                        childNodes.push(s);
+                }
+                const result = {
+                    type: ELEMENT,
+                    tagName,
+                    attributes: getAttributes(el),
+                    childNodes,
+                    id,
+                };
+                if (isSVG)
+                    result.isSVG = true;
+                return result;
+            }
+            case Node.TEXT_NODE: {
+                let textContent = node.textContent || "";
+                const parent = node.parentElement;
+                const isStyle = parent?.tagName === "STYLE" || undefined;
+                // Mask text content when under maskTextClass/maskTextSelector
+                if (!isStyle && shouldMaskText(node) && textContent) {
+                    textContent = textContent.replace(/\S/g, "*");
+                }
+                const result = {
+                    type: TEXT,
+                    textContent,
+                    childNodes: [],
+                    id: genId(node),
+                };
+                if (isStyle)
+                    result.isStyle = true;
+                return result;
+            }
+            case Node.COMMENT_NODE:
+                return {
+                    type: COMMENT,
+                    textContent: node.textContent || "",
+                    childNodes: [],
+                    id: genId(node),
+                };
+            case Node.CDATA_SECTION_NODE:
+                return {
+                    type: CDATA,
+                    textContent: "",
+                    childNodes: [],
+                    id: genId(node),
+                };
+            default:
+                return null;
+        }
+    }
+    try {
+        return await serialize(doc);
+    }
+    catch (e) {
+        console.warn("[Sailfish] chunkSnapshot serialization error:", e);
+        return null;
+    }
+}

package/dist/chunks/chunkSerializer-BFe33uXR.js

@@ -0,0 +1,95 @@
+import { y as e } from "./index-CJhJKC_I.js";
+async function chunkedSnapshot(t, n, o = {}) {
+  const s = o.chunkSize ?? 500, r = o.maxChunkMs ?? 16, { blockClass: c, blockSelector: a, maskTextClass: i, maskTextSelector: d } = o;
+  let u = 100001, l = 0, N = performance.now();
+  function genId(e2) {
+    if (n.hasNode(e2)) return n.getId(e2);
+    const t2 = u++;
+    return n.add(e2, { id: t2 }), t2;
+  }
+  function getAttributes(e2) {
+    const t2 = {};
+    for (let n3 = 0; n3 < e2.attributes.length; n3++) {
+      const o2 = e2.attributes[n3];
+      t2[o2.name] = o2.value;
+    }
+    const n2 = e2.tagName;
+    if ("INPUT" === n2 || "TEXTAREA" === n2 || "SELECT" === n2) {
+      const n3 = e2;
+      void 0 !== n3.value && "" !== n3.value && (t2.value = n3.value);
+    }
+    if ("INPUT" === n2) {
+      const n3 = e2;
+      "checkbox" !== n3.type && "radio" !== n3.type || (t2.checked = n3.checked);
+    }
+    return "OPTION" === n2 && (t2.selected = e2.selected), t2;
+  }
+  try {
+    return await (async function serialize(n2) {
+      if (n2 !== t && !n2.parentNode) return null;
+      switch (await (async function maybeYield() {
+        l++, (l % s === 0 || performance.now() - N > r) && (await e(), N = performance.now());
+      })(), n2.nodeType) {
+        case Node.DOCUMENT_NODE: {
+          const e2 = genId(n2), t2 = [];
+          for (const e3 of Array.from(n2.childNodes)) {
+            const n3 = await serialize(e3);
+            n3 && t2.push(n3);
+          }
+          return { type: 0, childNodes: t2, id: e2 };
+        }
+        case Node.DOCUMENT_TYPE_NODE: {
+          const e2 = n2;
+          return { type: 1, childNodes: [], id: genId(n2), name: e2.name, publicId: e2.publicId, systemId: e2.systemId };
+        }
+        case Node.ELEMENT_NODE: {
+          const e2 = n2, t2 = genId(n2), o2 = e2.tagName.toLowerCase(), s2 = "http://www.w3.org/2000/svg" === e2.namespaceURI || void 0;
+          if ((function isBlocked(e3) {
+            var _a;
+            if (c && ((_a = e3.classList) == null ? void 0 : _a.contains(c))) return true;
+            if (a) try {
+              if (e3.matches(a)) return true;
+            } catch {
+            }
+            return false;
+          })(e2)) return { type: 2, tagName: o2, attributes: getAttributes(e2), childNodes: [], id: t2, isSVG: s2, needBlock: true };
+          const r2 = [];
+          for (const t3 of Array.from(e2.childNodes)) {
+            if (!t3.parentNode) continue;
+            const e3 = await serialize(t3);
+            e3 && r2.push(e3);
+          }
+          const i2 = { type: 2, tagName: o2, attributes: getAttributes(e2), childNodes: r2, id: t2 };
+          return s2 && (i2.isSVG = true), i2;
+        }
+        case Node.TEXT_NODE: {
+          let e2 = n2.textContent || "";
+          const t2 = n2.parentElement, o2 = "STYLE" === (t2 == null ? void 0 : t2.tagName) || void 0;
+          !o2 && (function shouldMaskText(e3) {
+            const t3 = e3.parentElement;
+            if (!t3) return false;
+            if (i && t3.closest(`.${i}`)) return true;
+            if (d) try {
+              if (t3.closest(d)) return true;
+            } catch {
+            }
+            return false;
+          })(n2) && e2 && (e2 = e2.replace(/\S/g, "*"));
+          const s2 = { type: 3, textContent: e2, childNodes: [], id: genId(n2) };
+          return o2 && (s2.isStyle = true), s2;
+        }
+        case Node.COMMENT_NODE:
+          return { type: 5, textContent: n2.textContent || "", childNodes: [], id: genId(n2) };
+        case Node.CDATA_SECTION_NODE:
+          return { type: 4, textContent: "", childNodes: [], id: genId(n2) };
+        default:
+          return null;
+      }
+    })(t);
+  } catch (e2) {
+    return console.warn("[Sailfish] chunkSnapshot serialization error:", e2), null;
+  }
+}
+export {
+  chunkedSnapshot
+};

package/dist/chunks/chunkSerializer-BKUFGtBu.js

@@ -0,0 +1,94 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const e = require("./index-CywnXnF8.js");
+exports.chunkedSnapshot = async function chunkedSnapshot(t, n, o = {}) {
+  const s = o.chunkSize ?? 500, r = o.maxChunkMs ?? 16, { blockClass: c, blockSelector: a, maskTextClass: i, maskTextSelector: d } = o;
+  let u = 100001, l = 0, N = performance.now();
+  function genId(e2) {
+    if (n.hasNode(e2)) return n.getId(e2);
+    const t2 = u++;
+    return n.add(e2, { id: t2 }), t2;
+  }
+  function getAttributes(e2) {
+    const t2 = {};
+    for (let n3 = 0; n3 < e2.attributes.length; n3++) {
+      const o2 = e2.attributes[n3];
+      t2[o2.name] = o2.value;
+    }
+    const n2 = e2.tagName;
+    if ("INPUT" === n2 || "TEXTAREA" === n2 || "SELECT" === n2) {
+      const n3 = e2;
+      void 0 !== n3.value && "" !== n3.value && (t2.value = n3.value);
+    }
+    if ("INPUT" === n2) {
+      const n3 = e2;
+      "checkbox" !== n3.type && "radio" !== n3.type || (t2.checked = n3.checked);
+    }
+    return "OPTION" === n2 && (t2.selected = e2.selected), t2;
+  }
+  try {
+    return await (async function serialize(n2) {
+      if (n2 !== t && !n2.parentNode) return null;
+      switch (await (async function maybeYield() {
+        l++, (l % s === 0 || performance.now() - N > r) && (await e.yieldToMain(), N = performance.now());
+      })(), n2.nodeType) {
+        case Node.DOCUMENT_NODE: {
+          const e2 = genId(n2), t2 = [];
+          for (const e3 of Array.from(n2.childNodes)) {
+            const n3 = await serialize(e3);
+            n3 && t2.push(n3);
+          }
+          return { type: 0, childNodes: t2, id: e2 };
+        }
+        case Node.DOCUMENT_TYPE_NODE: {
+          const e2 = n2;
+          return { type: 1, childNodes: [], id: genId(n2), name: e2.name, publicId: e2.publicId, systemId: e2.systemId };
+        }
+        case Node.ELEMENT_NODE: {
+          const e2 = n2, t2 = genId(n2), o2 = e2.tagName.toLowerCase(), s2 = "http://www.w3.org/2000/svg" === e2.namespaceURI || void 0;
+          if ((function isBlocked(e3) {
+            var _a;
+            if (c && ((_a = e3.classList) == null ? void 0 : _a.contains(c))) return true;
+            if (a) try {
+              if (e3.matches(a)) return true;
+            } catch {
+            }
+            return false;
+          })(e2)) return { type: 2, tagName: o2, attributes: getAttributes(e2), childNodes: [], id: t2, isSVG: s2, needBlock: true };
+          const r2 = [];
+          for (const t3 of Array.from(e2.childNodes)) {
+            if (!t3.parentNode) continue;
+            const e3 = await serialize(t3);
+            e3 && r2.push(e3);
+          }
+          const i2 = { type: 2, tagName: o2, attributes: getAttributes(e2), childNodes: r2, id: t2 };
+          return s2 && (i2.isSVG = true), i2;
+        }
+        case Node.TEXT_NODE: {
+          let e2 = n2.textContent || "";
+          const t2 = n2.parentElement, o2 = "STYLE" === (t2 == null ? void 0 : t2.tagName) || void 0;
+          !o2 && (function shouldMaskText(e3) {
+            const t3 = e3.parentElement;
+            if (!t3) return false;
+            if (i && t3.closest(`.${i}`)) return true;
+            if (d) try {
+              if (t3.closest(d)) return true;
+            } catch {
+            }
+            return false;
+          })(n2) && e2 && (e2 = e2.replace(/\S/g, "*"));
+          const s2 = { type: 3, textContent: e2, childNodes: [], id: genId(n2) };
+          return o2 && (s2.isStyle = true), s2;
+        }
+        case Node.COMMENT_NODE:
+          return { type: 5, textContent: n2.textContent || "", childNodes: [], id: genId(n2) };
+        case Node.CDATA_SECTION_NODE:
+          return { type: 4, textContent: "", childNodes: [], id: genId(n2) };
+        default:
+          return null;
+      }
+    })(t);
+  } catch (e2) {
+    return console.warn("[Sailfish] chunkSnapshot serialization error:", e2), null;
+  }
+};