clarity-js 0.8.48 → 0.8.50-beta

package/src/interaction/click.ts

@@ -1,5 +1,5 @@
 import { BooleanFlag, Constant, Event, Setting } from "@clarity-types/data";
-import { BrowsingContext, ClickState, TextInfo } from "@clarity-types/interaction";
+import { BrowsingContext, ClickSource, ClickState, TextInfo } from "@clarity-types/interaction";
 import { Box } from "@clarity-types/layout";
 import { bind } from "@src/core/event";
 import { schedule } from "@src/core/task";
@@ -75,6 +75,7 @@ function handler(event: Event, root: Node, evt: MouseEvent): void {
                 tag: getElementAttribute(t, "tagName").substring(0, Setting.ClickTag),
                 class: getElementAttribute(t, "className").substring(0, Setting.ClickClass),
                 id: getElementAttribute(t, "id").substring(0, Setting.ClickId),
+                source: evt.isTrusted ? ClickSource.Undefined : source()
             }
         });
         schedule(encode.bind(this, event));
@@ -164,6 +165,28 @@ function context(a: HTMLAnchorElement): BrowsingContext {
     return BrowsingContext.Self;
 }
 
+function source(): ClickSource {
+    try {
+        const stack = new Error().stack || "";
+        const origin = location.origin;
+        let result = ClickSource.Unknown;
+
+        for (const line of stack.split("\n")) {
+            if (line.indexOf("://") >= 0) {
+                result = line.indexOf("extension") < 0 && line.indexOf(origin) >= 0
+                    ? ClickSource.FirstParty
+                    : ClickSource.ThirdParty;
+            } else if (line.indexOf("eval") >= 0 || line.indexOf("Function") >= 0 || line.indexOf("<a") >= 0 || /VM\d/.test(line)) {
+                result = ClickSource.Eval;
+            }
+        }
+
+        return result;
+    } catch {
+        return ClickSource.Unknown;
+    }
+}
+
 export function reset(): void {
     state = [];
 }

package/src/interaction/encode.ts

@@ -77,6 +77,7 @@ export default async function (type: Event, ts: number = null): Promise<void> {
                 tokens.push(entry.data.tag);
                 tokens.push(entry.data.class);
                 tokens.push(entry.data.id);
+                tokens.push(entry.data.source);
                 queue(tokens);
                 timeline.track(entry.time, entry.event, cHash, entry.data.x, entry.data.y, entry.data.reaction, entry.data.context);
             }
@@ -147,6 +148,7 @@ export default async function (type: Event, ts: number = null): Promise<void> {
                     tokens.push(entry.data.y);
                     tokens.push(sTopHash);
                     tokens.push(sBottomHash);
+                    tokens.push(entry.data.trust);
                     queue(tokens);
                     baseline.track(entry.event, entry.data.x, entry.data.y, entry.time);
                 }

package/src/interaction/index.ts

@@ -11,6 +11,7 @@ import * as timeline from "@src/interaction/timeline";
 import * as unload from "@src/interaction/unload";
 import * as visibility from "@src/interaction/visibility";
 import * as focus from "@src/interaction/focus";
+import * as pageshow from "@src/interaction/pageshow";
 
 export function start(): void {
     timeline.start();
@@ -21,6 +22,7 @@ export function start(): void {
     resize.start();
     visibility.start();
     focus.start();
+    pageshow.start();
     scroll.start();
     selection.start();
     change.start();
@@ -37,6 +39,7 @@ export function stop(): void {
     resize.stop();
     visibility.stop();
     focus.stop();
+    pageshow.stop();
     scroll.stop();
     selection.stop();
     change.stop();

package/src/interaction/pageshow.ts

@@ -0,0 +1,35 @@
+import { Constant } from "@clarity-types/core";
+import { Code, Severity } from "@clarity-types/data";
+import * as clarity from "@src/clarity";
+import api from "@src/core/api";
+import measure from "@src/core/measure";
+import * as internal from "@src/diagnostic/internal";
+
+let bound = false;
+
+export function start(): void {
+    // Only bind once - this listener must persist even when Clarity stops
+    // to detect when the page is restored from bfcache
+    if (!bound) {
+        try {
+            window[api(Constant.AddEventListener)]("pageshow", measure(handler) as EventListener, { capture: false, passive: true });
+            bound = true;
+        } catch {
+            /* do nothing */
+        }
+    }
+}
+
+function handler(evt: PageTransitionEvent): void {
+    // The persisted property indicates if the page was loaded from bfcache
+    if (evt && evt.persisted) {
+        // Restart Clarity since it was stopped when the page entered bfcache
+        clarity.start();
+        internal.log(Code.BFCache, Severity.Info);
+    }
+}
+
+export function stop(): void {
+    // Intentionally don't remove the listener or reset 'bound' flag
+    // We need the listener to persist to detect bfcache restoration
+}

package/src/interaction/scroll.ts

@@ -1,4 +1,4 @@
-import { Constant, Dimension, Event } from "@clarity-types/data";
+import { BooleanFlag, Constant, Dimension, Event } from "@clarity-types/data";
 import { ScrollState, Setting } from "@clarity-types/interaction";
 import { bind } from "@src/core/event";
 import { schedule } from "@src/core/task";
@@ -55,8 +55,9 @@ function recompute(event: UIEvent = null): void {
     const endYPosition = height - yOffset;
     const top = getPositionNode(xPosition, startYPosition);
     const bottom = getPositionNode(xPosition, endYPosition);
+    const trust = event && event.isTrusted ? BooleanFlag.True : BooleanFlag.False;
 
-    let current: ScrollState = { time: time(event), event: Event.Scroll, data: {target: element, x, y, top, bottom} };
+    let current: ScrollState = { time: time(event), event: Event.Scroll, data: {target: element, x, y, top, bottom, trust} };
 
     // We don't send any scroll events if this is the first event and the current position is top (0,0)
     if ((event === null && x === 0 && y === 0) || (x === null || y === null)) {

package/types/core.d.ts

@@ -140,6 +140,7 @@ export interface Config {
     throttleDom?: boolean;
     conversions?: boolean;
     includeSubdomains?: boolean;
+    modules?: string[];
 }
 
 export const enum Constant {

package/types/data.d.ts

@@ -212,6 +212,7 @@ export const enum Code {
     Config = 8,
     FunctionExecutionTime = 9,
     LeanLimit = 10,
+    BFCache = 11,
 }
 
 export const enum Severity {

package/types/interaction.d.ts

@@ -11,6 +11,14 @@ export const enum BrowsingContext {
     Top = 3
 }
 
+export const enum ClickSource {
+    Undefined = 0,
+    FirstParty = 1,
+    ThirdParty = 2,
+    Eval = 3,
+    Unknown = 4
+}
+
 export const enum Setting {
     LookAhead = 500, // 500ms
     InputLookAhead = 1000, // 1s
@@ -131,6 +139,7 @@ export interface ClickData {
     tag: string;
     class: string;
     id: string;
+    source: ClickSource;
 }
 
 export interface TextInfo {
@@ -154,6 +163,7 @@ export interface ScrollData {
     y: number;
     top: Node | string;
     bottom: Node | string;
+    trust: BooleanFlag;
 }
 
 export interface SelectionData {