clarity-js 0.8.11-beta → 0.8.12

package/src/layout/dom.ts

@@ -1,6 +1,6 @@
 import { Privacy } from "@clarity-types/core";
 import { Code, Setting, Severity } from "@clarity-types/data";
-import { Constant, Mask, NodeInfo, NodeMeta, NodeValue, Selector, SelectorInput, Source } from "@clarity-types/layout";
+import { Constant, Mask, type NodeInfo, type NodeMeta, type NodeValue, Selector, type SelectorInput, Source } from "@clarity-types/layout";
 import config from "@src/core/config";
 import { bind } from "@src/core/event";
 import hash from "@src/core/hash";
@@ -9,8 +9,8 @@ import * as internal from "@src/diagnostic/internal";
 import { removeObserver } from "@src/layout/node";
 import * as region from "@src/layout/region";
 import * as selector from "@src/layout/selector";
-let index: number = 1;
-let nodesMap: Map<Number, Node> = null; // Maps id => node to retrieve further node details using id.
+let index = 1;
+let nodesMap: Map<number, Node> = null; // Maps id => node to retrieve further node details using id.
 let values: NodeValue[] = [];
 let updateMap: number[] = [];
 let hashMap: { [hash: string]: number } = {};
@@ -24,7 +24,7 @@ let maskTags = [];
 // The WeakMap object is a collection of key/value pairs in which the keys are weakly referenced
 let idMap: WeakMap<Node, number> = null; // Maps node => id.
 let iframeMap: WeakMap<Document, HTMLIFrameElement> = null; // Maps iframe's contentDocument => parent iframe element
-let iframeContentMap: WeakMap<HTMLIFrameElement, { doc: Document, win: Window }> = null; // Maps parent iframe element => iframe's contentDocument & contentWindow
+let iframeContentMap: WeakMap<HTMLIFrameElement, { doc: Document; win: Window }> = null; // Maps parent iframe element => iframe's contentDocument & contentWindow
 let privacyMap: WeakMap<Node, Privacy> = null; // Maps node => Privacy (enum)
 let fraudMap: WeakMap<Node, number> = null; // Maps node => FraudId (number)
 
@@ -59,26 +59,54 @@ function reset(): void {
 
 // We parse new root nodes for any regions or masked nodes in the beginning (document) and
 // later whenever there are new additions or modifications to DOM (mutations)
-export function parse(root: ParentNode, init: boolean = false): void {
+export function parse(root: ParentNode, init = false): void {
     // Wrap selectors in a try / catch block.
     // It's possible for script to receive invalid selectors, e.g. "'#id'" with extra quotes, and cause the code below to fail
     try {
-        // Parse unmask configuration into separate query selectors and override tokens as part of initialization
-        if (init) { config.unmask.forEach(x => x.indexOf(Constant.Bang) < 0 ? unmask.push(x) : override.push(x.substr(1))); }
+        if (init) {
+             // Parse unmask configuration into separate query selectors and override tokens as part of initialization
+            for (const x of config.unmask) {
+                if (x.indexOf(Constant.Bang) < 0) {
+                    unmask.push(x);
+                } else {
+                    override.push(x.substr(1));
+                }
+            }
+        }
 
         // Since mutations may happen on leaf nodes too, e.g. text nodes, which may not support all selector APIs.
         // We ensure that the root note supports querySelectorAll API before executing the code below to identify new regions.
         if ("querySelectorAll" in root) {
-            config.regions.forEach(x => root.querySelectorAll(x[1]).forEach(e => region.observe(e, `${x[0]}`))); // Regions
-            config.mask.forEach(x => root.querySelectorAll(x).forEach(e => privacyMap.set(e, Privacy.TextImage))); // Masked Elements
-            config.checksum.forEach(x => root.querySelectorAll(x[1]).forEach(e => fraudMap.set(e, x[0]))); // Fraud Checksum Check
-            unmask.forEach(x => root.querySelectorAll(x).forEach(e => privacyMap.set(e, Privacy.None))); // Unmasked Elements
+            for (const x of config.regions) {
+                for (const e of Array.from(root.querySelectorAll(x[1]))) {
+                    region.observe(e, `${x[0]}`);
+                }
+            }
+            for (const x of config.mask) {
+                for (const e of Array.from(root.querySelectorAll(x))) {
+                    privacyMap.set(e, Privacy.TextImage);
+                }
+            } 
+            for (const x of config.checksum) {
+                for (const e of Array.from(root.querySelectorAll(x[1]))) {
+                    fraudMap.set(e, x[0]);
+                }
+            }
+            for (const x of unmask) {
+                for (const e of Array.from(root.querySelectorAll(x))) {
+                    privacyMap.set(e, Privacy.None);
+                }
+            }
         }
-    } catch (e) { internal.log(Code.Selector, Severity.Warning, e ? e.name : null); }
+    } catch (e) {
+        internal.log(Code.Selector, Severity.Warning, e ? e.name : null);
+    }
 }
 
-export function getId(node: Node, autogen: boolean = false): number {
-    if (node === null) { return null; }
+export function getId(node: Node, autogen = false): number {
+    if (node === null) {
+        return null;
+    }
     let id = idMap.get(node);
     if (!id && autogen) {
         id = index++;
@@ -89,19 +117,19 @@ export function getId(node: Node, autogen: boolean = false): number {
 }
 
 export function add(node: Node, parent: Node, data: NodeInfo, source: Source): void {
-    let parentId = parent ? getId(parent) : null;
+    const parentId = parent ? getId(parent) : null;
 
     // Do not add detached nodes
     if ((!parent || !parentId) && (node as ShadowRoot).host == null && node.nodeType !== Node.DOCUMENT_TYPE_NODE) {
         return;
     }
 
-    let id = getId(node, true);
-    let previousId = getPreviousId(node);
+    const id = getId(node, true);
+    const previousId = getPreviousId(node);
     let parentValue: NodeValue = null;
     let regionId = region.exists(node) ? id : null;
     let fraudId = fraudMap.has(node) ? fraudMap.get(node) : null;
-    let privacyId = config.content ? Privacy.Sensitive : Privacy.TextImage
+    let privacyId = config.content ? Privacy.Sensitive : Privacy.TextImage;
     if (parentId >= 0 && values[parentId]) {
         parentValue = values[parentId];
         parentValue.children.push(id);
@@ -136,14 +164,14 @@ export function add(node: Node, parent: Node, data: NodeInfo, source: Source): v
 }
 
 export function update(node: Node, parent: Node, data: NodeInfo, source: Source): void {
-    let id = getId(node);
-    let parentId = parent ? getId(parent) : null;
-    let previousId = getPreviousId(node);
+    const id = getId(node);
+    const parentId = parent ? getId(parent) : null;
+    const previousId = getPreviousId(node);
     let changed = false;
     let parentChanged = false;
 
     if (id in values) {
-        let value = values[id];
+        const value = values[id];
         value.metadata.active = true;
 
         // Handle case where internal ordering may have changed
@@ -155,11 +183,11 @@ export function update(node: Node, parent: Node, data: NodeInfo, source: Source)
         // Handle case where parent might have been updated
         if (value.parent !== parentId) {
             changed = true;
-            let oldParentId = value.parent;
+            const oldParentId = value.parent;
             value.parent = parentId;
             // Move this node to the right location under new parent
             if (parentId !== null && parentId >= 0) {
-                let childIndex = previousId === null ? 0 : values[parentId].children.indexOf(previousId) + 1;
+                const childIndex = previousId === null ? 0 : values[parentId].children.indexOf(previousId) + 1;
                 values[parentId].children.splice(childIndex, 0, id);
                 // Update region after the move
                 value.region = region.exists(node) ? id : values[parentId].region;
@@ -170,7 +198,7 @@ export function update(node: Node, parent: Node, data: NodeInfo, source: Source)
 
             // Remove reference to this node from the old parent
             if (oldParentId !== null && oldParentId >= 0) {
-                let nodeIndex = values[oldParentId].children.indexOf(id);
+                const nodeIndex = values[oldParentId].children.indexOf(id);
                 if (nodeIndex >= 0) {
                     values[oldParentId].children.splice(nodeIndex, 1);
                 }
@@ -179,10 +207,10 @@ export function update(node: Node, parent: Node, data: NodeInfo, source: Source)
         }
 
         // Update data
-        for (let key in data) {
-            if (diff(value["data"], data, key)) {
+        for (const key in data) {
+            if (diff(value.data, data, key)) {
                 changed = true;
-                value["data"][key] = data[key];
+                value.data[key] = data[key];
             }
         }
 
@@ -195,28 +223,30 @@ export function update(node: Node, parent: Node, data: NodeInfo, source: Source)
 export function sameorigin(node: Node): boolean {
     let output = false;
     if (node.nodeType === Node.ELEMENT_NODE && (node as HTMLElement).tagName === Constant.IFrameTag) {
-        let frame = node as HTMLIFrameElement;
+        const frame = node as HTMLIFrameElement;
         // To determine if the iframe is same-origin or not, we try accessing it's contentDocument.
         // If the browser throws an exception, we assume it's cross-origin and move on.
         // However, if we do a get a valid document object back, we assume the contents are accessible and iframe is same-origin.
         try {
-            let doc = frame.contentDocument;
+            const doc = frame.contentDocument;
             if (doc) {
                 iframeMap.set(frame.contentDocument, frame);
                 iframeContentMap.set(frame, { doc: frame.contentDocument, win: frame.contentWindow });
                 output = true;
             }
-        } catch { /* do nothing */ }
+        } catch {
+            /* do nothing */
+        }
     }
     return output;
 }
 
 export function iframe(node: Node): HTMLIFrameElement {
-    let doc = node.nodeType === Node.DOCUMENT_NODE ? node as Document : null;
+    const doc = node.nodeType === Node.DOCUMENT_NODE ? (node as Document) : null;
     return doc && iframeMap.has(doc) ? iframeMap.get(doc) : null;
 }
 
-export function iframeContent(frame: HTMLIFrameElement): {doc: Document, win: Window } {
+export function iframeContent(frame: HTMLIFrameElement): { doc: Document; win: Window } {
     if (iframeContentMap.has(frame)) {
         return iframeContentMap.get(frame);
     }
@@ -229,26 +259,28 @@ export function removeIFrame(frame: HTMLIFrameElement, doc: Document): void {
 }
 
 function privacy(node: Node, value: NodeValue, parent: NodeValue): void {
-    let data = value.data;
-    let metadata = value.metadata;
-    let current = metadata.privacy;
-    let attributes = data.attributes || {};
-    let tag = data.tag.toUpperCase();
+    const data = value.data;
+    const metadata = value.metadata;
+    const current = metadata.privacy;
+    const attributes = data.attributes || {};
+    const tag = data.tag.toUpperCase();
 
     switch (true) {
-        case maskTags.indexOf(tag) >= 0:
-            let type = attributes[Constant.Type];
+        case maskTags.indexOf(tag) >= 0: {
+            const type = attributes[Constant.Type];
             let meta: string = Constant.Empty;
-            const excludedPrivacyAttributes = [Constant.Class, Constant.Style]
-            Object.keys(attributes)
-              .filter((x) => !excludedPrivacyAttributes.includes(x as Constant))
-              .forEach((x) => (meta += attributes[x].toLowerCase()));
-            let exclude = maskExclude.some((x) => meta.indexOf(x) >= 0);
+            const excludedPrivacyAttributes = [Constant.Class, Constant.Style];
+            for (const x of Object.keys(attributes).filter((x) => !excludedPrivacyAttributes.includes(x as Constant))) {
+                meta += attributes[x].toLowerCase();
+            }
+            const exclude = maskExclude.some((x) => meta.indexOf(x) >= 0);
             // Regardless of privacy mode, always mask off user input from input boxes or drop downs with two exceptions:
             // (1) The node is detected to be one of the excluded fields, in which case we drop everything
             // (2) The node's type is one of the allowed types (like checkboxes)
-            metadata.privacy = tag === Constant.InputTag && maskDisable.indexOf(type) >= 0 ? current : (exclude ? Privacy.Exclude : Privacy.Text);
+            metadata.privacy =
+                tag === Constant.InputTag && maskDisable.indexOf(type) >= 0 ? current : exclude ? Privacy.Exclude : Privacy.Text;
             break;
+        }
         case Constant.MaskData in attributes:
             metadata.privacy = Privacy.TextImage;
             break;
@@ -263,28 +295,29 @@ function privacy(node: Node, value: NodeValue, parent: NodeValue): void {
             // If this node was explicitly configured to be evaluated for fraud, then also mask content
             metadata.privacy = Privacy.Text;
             break;
-        case tag === Constant.TextTag:
+        case tag === Constant.TextTag: {
             // If it's a text node belonging to a STYLE or TITLE tag or one of scrub exceptions, then capture content
-            let pTag = parent && parent.data ? parent.data.tag : Constant.Empty;
-            let pSelector = parent && parent.selector ? parent.selector[Selector.Default] : Constant.Empty;
-            let tags: string[] = [Constant.StyleTag, Constant.TitleTag, Constant.SvgStyle];
-            metadata.privacy = tags.includes(pTag) || override.some(x => pSelector.indexOf(x) >= 0) ? Privacy.None : current;
+            const pTag = parent?.data ? parent.data.tag : Constant.Empty;
+            const pSelector = parent?.selector ? parent.selector[Selector.Default] : Constant.Empty;
+            const tags: string[] = [Constant.StyleTag, Constant.TitleTag, Constant.SvgStyle];
+            metadata.privacy = tags.includes(pTag) || override.some((x) => pSelector.indexOf(x) >= 0) ? Privacy.None : current;
             break;
+        }
         case current === Privacy.Sensitive:
             // In a mode where we mask sensitive information by default, look through class names to aggressively mask content
             metadata.privacy = inspect(attributes[Constant.Class], maskText, metadata);
             break;
         case tag === Constant.ImageTag:
             // Mask images with blob src as it is not publicly available anyway.
-            if(attributes.src?.startsWith('blob:')){
+            if (attributes.src?.startsWith("blob:")) {
                 metadata.privacy = Privacy.TextImage;
             }
-        break;
+            break;
     }
 }
 
 function inspect(input: string, lookup: string[], metadata: NodeMeta): Privacy {
-    if (input && lookup.some(x => input.indexOf(x) >= 0)) {
+    if (input && lookup.some((x) => input.indexOf(x) >= 0)) {
         return Privacy.Text;
     }
     return metadata.privacy;
@@ -292,8 +325,16 @@ function inspect(input: string, lookup: string[], metadata: NodeMeta): Privacy {
 
 function diff(a: NodeInfo, b: NodeInfo, field: string): boolean {
     if (typeof a[field] === "object" && typeof b[field] === "object") {
-        for (let key in a[field]) { if (a[field][key] !== b[field][key]) { return true; } }
-        for (let key in b[field]) { if (b[field][key] !== a[field][key]) { return true; } }
+        for (const key in a[field]) {
+            if (a[field][key] !== b[field][key]) {
+                return true;
+            }
+        }
+        for (const key in b[field]) {
+            if (b[field][key] !== a[field][key]) {
+                return true;
+            }
+        }
         return false;
     }
     return a[field] !== b[field];
@@ -303,7 +344,7 @@ function position(parent: NodeValue, child: NodeValue): number {
     child.metadata.position = 1;
     let idx = parent ? parent.children.indexOf(child.id) : -1;
     while (idx-- > 0) {
-        let sibling = values[parent.children[idx]];
+        const sibling = values[parent.children[idx]];
         if (child.data.tag === sibling.data.tag) {
             child.metadata.position = sibling.metadata.position + 1;
             break;
@@ -313,20 +354,22 @@ function position(parent: NodeValue, child: NodeValue): number {
 }
 
 function updateSelector(value: NodeValue): void {
-    let parent = value.parent && value.parent in values ? values[value.parent] : null;
-    let prefix = parent ? parent.selector : null;
-    let d = value.data;
-    let p = position(parent, value);
-    let s: SelectorInput = { id: value.id, tag: d.tag, prefix, position: p, attributes: d.attributes };
+    const parent = value.parent && value.parent in values ? values[value.parent] : null;
+    const prefix = parent ? parent.selector : null;
+    const d = value.data;
+    const p = position(parent, value);
+    const s: SelectorInput = { id: value.id, tag: d.tag, prefix, position: p, attributes: d.attributes };
     value.selector = [selector.get(s, Selector.Alpha), selector.get(s, Selector.Beta)];
-    value.hash = value.selector.map(x => x ? hash(x) : null) as [string, string];
-    value.hash.forEach(h => hashMap[h] = value.id);
+    value.hash = value.selector.map((x) => (x ? hash(x) : null)) as [string, string];
+    for (const h of value.hash) {
+        hashMap[h] = value.id;
+    }
 }
 
 export function hashText(hash: string): string {
-    let id = lookup(hash);
-    let node = getNode(id);
-    return node !== null && node.textContent !== null ? node.textContent.substr(0, Setting.ClickText) : '';
+    const id = lookup(hash);
+    const node = getNode(id);
+    return node !== null && node.textContent !== null ? node.textContent.substr(0, Setting.ClickText) : "";
 }
 
 export function getNode(id: number): Node {
@@ -341,7 +384,7 @@ export function getValue(id: number): NodeValue {
 }
 
 export function get(node: Node): NodeValue {
-    let id = getId(node);
+    const id = getId(node);
     return id in values ? values[id] : null;
 }
 
@@ -354,9 +397,11 @@ export function has(node: Node): boolean {
 }
 
 export function updates(): NodeValue[] {
-    let output = [];
-    for (let id of updateMap) {
-        if (id in values) { output.push(values[id]); }
+    const output = [];
+    for (const id of updateMap) {
+        if (id in values) {
+            output.push(values[id]);
+        }
     }
     updateMap = [];
 
@@ -365,7 +410,7 @@ export function updates(): NodeValue[] {
 
 function remove(id: number, source: Source): void {
     if (id in values) {
-        let value = values[id];
+        const value = values[id];
         value.metadata.active = false;
         value.parent = null;
         track(id, source);
@@ -377,22 +422,22 @@ function remove(id: number, source: Source): void {
 
 function removeNodeFromNodesMap(id: number) {
     const nodeToBeRemoved = nodesMap.get(id);
-    // Shadow dom roots shouldn't be deleted, 
+    // Shadow dom roots shouldn't be deleted,
     // we should keep listening to the mutations there even they're not rendered in the DOM.
-    if(nodeToBeRemoved?.nodeType === Node.DOCUMENT_FRAGMENT_NODE){
+    if (nodeToBeRemoved?.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {
         return;
     }
 
-    if (nodeToBeRemoved && nodeToBeRemoved?.nodeType === Node.ELEMENT_NODE && nodeToBeRemoved["tagName"] === "IFRAME") {
+    if (nodeToBeRemoved?.nodeType === Node.ELEMENT_NODE && (nodeToBeRemoved as Element).tagName === "IFRAME") {
         const iframe = nodeToBeRemoved as HTMLIFrameElement;
         removeObserver(iframe);
     }
 
     nodesMap.delete(id);
 
-    let value = id in values ? values[id] : null;
-    if (value && value.children) {
-        for (let childId of value.children) {
+    const value = id in values ? values[id] : null;
+    if (value?.children) {
+        for (const childId of value.children) {
             removeNodeFromNodesMap(childId);
         }
     }
@@ -400,21 +445,22 @@ function removeNodeFromNodesMap(id: number) {
 
 function updateImageSize(value: NodeValue): void {
     // If this element is a image node, and is masked, then track box model for the current element
-    if (value.data.tag === Constant.ImageTag && value.metadata.privacy === Privacy.TextImage) { 
-        let img = getNode(value.id) as HTMLImageElement;
-        // We will not capture the natural image dimensions until it loads. 
-        if(img && (!img.complete || img.naturalWidth === 0)){
+    if (value.data.tag === Constant.ImageTag && value.metadata.privacy === Privacy.TextImage) {
+        const img = getNode(value.id) as HTMLImageElement;
+        // We will not capture the natural image dimensions until it loads.
+        if (img && (!img.complete || img.naturalWidth === 0)) {
             // This will trigger mutation to update the original width and height after image loads.
-            bind(img, 'load', () => {
-                img.setAttribute('data-clarity-loaded', `${shortid()}`);
-            })
+            bind(img, "load", () => {
+                img.setAttribute("data-clarity-loaded", `${shortid()}`);
+            });
         }
         value.metadata.size = [];
-     }
+    }
 }
 
-function getPreviousId(node: Node): number {
+function getPreviousId(inputNode: Node): number {
     let id = null;
+    let node = inputNode;
 
     // Some nodes may not have an ID by design since Clarity skips over tags like SCRIPT, NOSCRIPT, META, COMMENTS, etc..
     // In that case, we keep going back and check for their sibling until we find a sibling with ID or no more sibling nodes are left.
@@ -425,15 +471,19 @@ function getPreviousId(node: Node): number {
     return id;
 }
 
-function track(id: number, source: Source, changed: boolean = true, parentChanged: boolean = false): void {
-  if (config.lean && config.lite) { return; }
+function track(id: number, source: Source, changed = true, parentChanged = false): void {
+    if (config.lean && config.lite) {
+        return;
+    }
 
     // Keep track of the order in which mutations happened, they may not be sequential
     // Edge case: If an element is added later on, and pre-discovered element is moved as a child.
     // In that case, we need to reorder the pre-discovered element in the update list to keep visualization consistent.
-    let uIndex = updateMap.indexOf(id);
+    const uIndex = updateMap.indexOf(id);
     if (uIndex >= 0 && source === Source.ChildListAdd && parentChanged) {
         updateMap.splice(uIndex, 1);
         updateMap.push(id);
-    } else if (uIndex === -1 && changed) { updateMap.push(id); }
+    } else if (uIndex === -1 && changed) {
+        updateMap.push(id);
+    }
 }

package/src/layout/encode.ts

@@ -1,33 +1,34 @@
-import { Privacy, Task, Timer } from "@clarity-types/core";
-import { Event, Setting, Token } from "@clarity-types/data";
-import { Constant, NodeInfo, NodeValue } from "@clarity-types/layout";
+import { Privacy, Task, type Timer } from "@clarity-types/core";
+import { Event, Setting, type Token } from "@clarity-types/data";
+import { Constant, type NodeInfo, type NodeValue } from "@clarity-types/layout";
 import config from "@src/core/config";
 import * as scrub from "@src/core/scrub";
 import * as task from "@src/core/task";
 import { time } from "@src/core/time";
-import tokenize from "@src/data/token";
 import * as baseline from "@src/data/baseline";
+import tokenize from "@src/data/token";
 import { queue } from "@src/data/upload";
 import * as fraud from "@src/diagnostic/fraud";
+import * as animation from "@src/layout/animation";
 import * as doc from "@src/layout/document";
 import * as dom from "@src/layout/dom";
 import * as region from "@src/layout/region";
 import * as style from "@src/layout/style";
-import * as animation from "@src/layout/animation";
 
 export default async function (type: Event, timer: Timer = null, ts: number = null): Promise<void> {
-    let eventTime = ts || time()
+    const eventTime = ts || time();
     let tokens: Token[] = [eventTime, type];
     switch (type) {
-        case Event.Document:
-            let d = doc.data;
+        case Event.Document: {
+            const d = doc.data;
             tokens.push(d.width);
             tokens.push(d.height);
             baseline.track(type, d.width, d.height);
             queue(tokens);
             break;
+        }
         case Event.Region:
-            for (let r of region.state) {
+            for (const r of region.state) {
                 tokens = [r.time, Event.Region];
                 tokens.push(r.data.id);
                 tokens.push(r.data.interaction);
@@ -39,14 +40,14 @@ export default async function (type: Event, timer: Timer = null, ts: number = nu
             break;
         case Event.StyleSheetAdoption:
         case Event.StyleSheetUpdate:
-            for (let entry of style.sheetAdoptionState) {
+            for (const entry of style.sheetAdoptionState) {
                 tokens = [entry.time, entry.event];
                 tokens.push(entry.data.id);
                 tokens.push(entry.data.operation);
                 tokens.push(entry.data.newIds);
                 queue(tokens);
             }
-            for (let entry of style.sheetUpdateState) {
+            for (const entry of style.sheetUpdateState) {
                 tokens = [entry.time, entry.event];
                 tokens.push(entry.data.id);
                 tokens.push(entry.data.operation);
@@ -56,7 +57,7 @@ export default async function (type: Event, timer: Timer = null, ts: number = nu
             style.reset();
             break;
         case Event.Animation:
-            for (let entry of animation.state) {
+            for (const entry of animation.state) {
                 tokens = [entry.time, entry.event];
                 tokens.push(entry.data.id);
                 tokens.push(entry.data.operation);
@@ -69,40 +70,51 @@ export default async function (type: Event, timer: Timer = null, ts: number = nu
             animation.reset();
             break;
         case Event.Discover:
-        case Event.Mutation:
+        case Event.Mutation: {
             // Check if we are operating within the context of the current page
-            if (task.state(timer) === Task.Stop) { break; }
-            let values = dom.updates();
+            if (task.state(timer) === Task.Stop) {
+                break;
+            }
+            const values = dom.updates();
             // Only encode and queue DOM updates if we have valid updates to report back
             if (values.length > 0) {
-                for (let value of values) {
+                for (const value of values) {
                     let state = task.state(timer);
-                    if (state === Task.Wait) { state = await task.suspend(timer); }
-                    if (state === Task.Stop) { break; }
-                    let data: NodeInfo = value.data;
-                    let active = value.metadata.active;
-                    let suspend = value.metadata.suspend;
-                    let privacy = value.metadata.privacy;
-                    let mangle = shouldMangle(value);
-                    let keys = active ? ["tag", "attributes", "value"] : ["tag"];
-                    for (let key of keys) {
+                    if (state === Task.Wait) {
+                        state = await task.suspend(timer);
+                    }
+                    if (state === Task.Stop) {
+                        break;
+                    }
+                    const data: NodeInfo = value.data;
+                    const active = value.metadata.active;
+                    const suspend = value.metadata.suspend;
+                    const privacy = value.metadata.privacy;
+                    const mangle = shouldMangle(value);
+                    const keys = active ? ["tag", "attributes", "value"] : ["tag"];
+                    for (const key of keys) {
                         // we check for data[key] === '' because we want to encode empty strings as well, especially for value - which if skipped can cause our decoder to assume the final
                         // attribute was the value for the node
-                        if (data[key] || data[key] === '') {
+                        if (data[key] || data[key] === "") {
                             switch (key) {
-                                case "tag":
-                                    let box = size(value);
-                                    let factor = mangle ? -1 : 1;
+                                case "tag": {
+                                    const box = size(value);
+                                    const factor = mangle ? -1 : 1;
                                     tokens.push(value.id * factor);
-                                    if (value.parent && active) { 
-                                        tokens.push(value.parent); 
-                                        if (value.previous) { tokens.push(value.previous); }
+                                    if (value.parent && active) {
+                                        tokens.push(value.parent);
+                                        if (value.previous) {
+                                            tokens.push(value.previous);
+                                        }
                                     }
                                     tokens.push(suspend ? Constant.SuspendMutationTag : data[key]);
-                                    if (box && box.length === 2) { tokens.push(`${Constant.Hash}${str(box[0])}.${str(box[1])}`); }
+                                    if (box && box.length === 2) {
+                                        tokens.push(`${Constant.Hash}${str(box[0])}.${str(box[1])}`);
+                                    }
                                     break;
+                                }
                                 case "attributes":
-                                    for (let attr in data[key]) {
+                                    for (const attr in data[key]) {
                                         if (data[key][attr] !== undefined) {
                                             tokens.push(attribute(attr, data[key][attr], privacy));
                                         }
@@ -116,21 +128,24 @@ export default async function (type: Event, timer: Timer = null, ts: number = nu
                         }
                     }
                 }
-                if (type === Event.Mutation) { baseline.activity(eventTime); }
+                if (type === Event.Mutation) {
+                    baseline.activity(eventTime);
+                }
                 queue(tokenize(tokens), !config.lean);
             }
             break;
+        }
     }
 }
 
 function shouldMangle(value: NodeValue): boolean {
-    let privacy = value.metadata.privacy;
+    const privacy = value.metadata.privacy;
     return value.data.tag === Constant.TextTag && !(privacy === Privacy.None || privacy === Privacy.Sensitive);
 }
 
 function size(value: NodeValue): number[] {
     if (value.metadata.size !== null && value.metadata.size.length === 0) {
-        let img = dom.getNode(value.id) as HTMLImageElement;
+        const img = dom.getNode(value.id) as HTMLImageElement;
         if (img) {
             return [Math.floor(img.offsetWidth * Setting.BoxPrecision), Math.floor(img.offsetHeight * Setting.BoxPrecision)];
         }