@openreplay/tracker 13.0.1 → 14.0.0

package/cjs/app/messages.gen.d.ts

@@ -1,7 +1,7 @@
 import * as Messages from '../common/messages.gen.js';
 export { default, Type } from '../common/messages.gen.js';
 export declare function Timestamp(timestamp: number): Messages.Timestamp;
-export declare function SetPageLocation(url: string, referrer: string, navigationStart: number): Messages.SetPageLocation;
+export declare function SetPageLocationDeprecated(url: string, referrer: string, navigationStart: number): Messages.SetPageLocationDeprecated;
 export declare function SetViewportSize(width: number, height: number): Messages.SetViewportSize;
 export declare function SetViewportScroll(x: number, y: number): Messages.SetViewportScroll;
 export declare function CreateDocument(): Messages.CreateDocument;
@@ -35,7 +35,7 @@ export declare function ReduxDeprecated(action: string, state: string, duration:
 export declare function Vuex(mutation: string, state: string): Messages.Vuex;
 export declare function MobX(type: string, payload: string): Messages.MobX;
 export declare function NgRx(action: string, state: string, duration: number): Messages.NgRx;
-export declare function GraphQL(operationKind: string, operationName: string, variables: string, response: string): Messages.GraphQL;
+export declare function GraphQLDeprecated(operationKind: string, operationName: string, variables: string, response: string, duration: number): Messages.GraphQLDeprecated;
 export declare function PerformanceTrack(frames: number, ticks: number, totalJSHeapSize: number, usedJSHeapSize: number): Messages.PerformanceTrack;
 export declare function StringDict(key: number, value: string): Messages.StringDict;
 export declare function SetNodeAttributeDict(id: number, nameKey: number, valueKey: number): Messages.SetNodeAttributeDict;
@@ -50,7 +50,8 @@ export declare function SetCSSDataURLBased(id: number, data: string, baseURL: st
 export declare function TechnicalInfo(type: string, value: string): Messages.TechnicalInfo;
 export declare function CustomIssue(name: string, payload: string): Messages.CustomIssue;
 export declare function CSSInsertRuleURLBased(id: number, rule: string, index: number, baseURL: string): Messages.CSSInsertRuleURLBased;
-export declare function MouseClick(id: number, hesitationTime: number, label: string, selector: string): Messages.MouseClick;
+export declare function MouseClick(id: number, hesitationTime: number, label: string, selector: string, normalizedX: number, normalizedY: number): Messages.MouseClick;
+export declare function MouseClickDeprecated(id: number, hesitationTime: number, label: string, selector: string): Messages.MouseClickDeprecated;
 export declare function CreateIFrameDocument(frameID: number, id: number): Messages.CreateIFrameDocument;
 export declare function AdoptedSSReplaceURLBased(sheetID: number, text: string, baseURL: string): Messages.AdoptedSSReplaceURLBased;
 export declare function AdoptedSSInsertRuleURLBased(sheetID: number, rule: string, index: number, baseURL: string): Messages.AdoptedSSInsertRuleURLBased;
@@ -73,3 +74,5 @@ export declare function TabData(tabId: string): Messages.TabData;
 export declare function CanvasNode(nodeId: string, timestamp: number): Messages.CanvasNode;
 export declare function TagTrigger(tagId: number): Messages.TagTrigger;
 export declare function Redux(action: string, state: string, duration: number, actionTime: number): Messages.Redux;
+export declare function SetPageLocation(url: string, referrer: string, navigationStart: number, documentTitle: string): Messages.SetPageLocation;
+export declare function GraphQL(operationKind: string, operationName: string, variables: string, response: string, duration: number): Messages.GraphQL;

package/cjs/app/messages.gen.js

@@ -2,8 +2,8 @@
 // Auto-generated, do not edit
 /* eslint-disable */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.CSSInsertRuleURLBased = exports.CustomIssue = exports.TechnicalInfo = exports.SetCSSDataURLBased = exports.SetNodeAttributeURLBased = exports.LongTask = exports.SetNodeFocus = exports.LoadFontFace = exports.SetPageVisibility = exports.ConnectionInformation = exports.ResourceTimingDeprecated = exports.SetNodeAttributeDict = exports.StringDict = exports.PerformanceTrack = exports.GraphQL = exports.NgRx = exports.MobX = exports.Vuex = exports.ReduxDeprecated = exports.StateAction = exports.OTable = exports.Profiler = exports.Fetch = exports.CSSDeleteRule = exports.CSSInsertRule = exports.Metadata = exports.UserAnonymousID = exports.UserID = exports.CustomEvent = exports.PageRenderTiming = exports.PageLoadTiming = exports.ConsoleLog = exports.NetworkRequestDeprecated = exports.MouseMove = exports.SetInputChecked = exports.SetInputValue = exports.SetInputTarget = exports.SetNodeScroll = exports.SetNodeData = exports.RemoveNodeAttribute = exports.SetNodeAttribute = exports.RemoveNode = exports.MoveNode = exports.CreateTextNode = exports.CreateElementNode = exports.CreateDocument = exports.SetViewportScroll = exports.SetViewportSize = exports.SetPageLocation = exports.Timestamp = void 0;
-exports.Redux = exports.TagTrigger = exports.CanvasNode = exports.TabData = exports.TabChange = exports.ResourceTiming = exports.UnbindNodes = exports.MouseThrashing = exports.SelectionChange = exports.InputChange = exports.WSChannel = exports.NetworkRequest = exports.PartitionedMessage = exports.BatchMetadata = exports.Zustand = exports.JSException = exports.AdoptedSSRemoveOwner = exports.AdoptedSSAddOwner = exports.AdoptedSSDeleteRule = exports.AdoptedSSInsertRuleURLBased = exports.AdoptedSSReplaceURLBased = exports.CreateIFrameDocument = exports.MouseClick = void 0;
+exports.CSSInsertRuleURLBased = exports.CustomIssue = exports.TechnicalInfo = exports.SetCSSDataURLBased = exports.SetNodeAttributeURLBased = exports.LongTask = exports.SetNodeFocus = exports.LoadFontFace = exports.SetPageVisibility = exports.ConnectionInformation = exports.ResourceTimingDeprecated = exports.SetNodeAttributeDict = exports.StringDict = exports.PerformanceTrack = exports.GraphQLDeprecated = exports.NgRx = exports.MobX = exports.Vuex = exports.ReduxDeprecated = exports.StateAction = exports.OTable = exports.Profiler = exports.Fetch = exports.CSSDeleteRule = exports.CSSInsertRule = exports.Metadata = exports.UserAnonymousID = exports.UserID = exports.CustomEvent = exports.PageRenderTiming = exports.PageLoadTiming = exports.ConsoleLog = exports.NetworkRequestDeprecated = exports.MouseMove = exports.SetInputChecked = exports.SetInputValue = exports.SetInputTarget = exports.SetNodeScroll = exports.SetNodeData = exports.RemoveNodeAttribute = exports.SetNodeAttribute = exports.RemoveNode = exports.MoveNode = exports.CreateTextNode = exports.CreateElementNode = exports.CreateDocument = exports.SetViewportScroll = exports.SetViewportSize = exports.SetPageLocationDeprecated = exports.Timestamp = void 0;
+exports.GraphQL = exports.SetPageLocation = exports.Redux = exports.TagTrigger = exports.CanvasNode = exports.TabData = exports.TabChange = exports.ResourceTiming = exports.UnbindNodes = exports.MouseThrashing = exports.SelectionChange = exports.InputChange = exports.WSChannel = exports.NetworkRequest = exports.PartitionedMessage = exports.BatchMetadata = exports.Zustand = exports.JSException = exports.AdoptedSSRemoveOwner = exports.AdoptedSSAddOwner = exports.AdoptedSSDeleteRule = exports.AdoptedSSInsertRuleURLBased = exports.AdoptedSSReplaceURLBased = exports.CreateIFrameDocument = exports.MouseClickDeprecated = exports.MouseClick = void 0;
 function Timestamp(timestamp) {
     return [
         0 /* Messages.Type.Timestamp */,
@@ -11,15 +11,15 @@ function Timestamp(timestamp) {
     ];
 }
 exports.Timestamp = Timestamp;
-function SetPageLocation(url, referrer, navigationStart) {
+function SetPageLocationDeprecated(url, referrer, navigationStart) {
     return [
-        4 /* Messages.Type.SetPageLocation */,
+        4 /* Messages.Type.SetPageLocationDeprecated */,
         url,
         referrer,
         navigationStart,
     ];
 }
-exports.SetPageLocation = SetPageLocation;
+exports.SetPageLocationDeprecated = SetPageLocationDeprecated;
 function SetViewportSize(width, height) {
     return [
         5 /* Messages.Type.SetViewportSize */,
@@ -310,16 +310,17 @@ function NgRx(action, state, duration) {
     ];
 }
 exports.NgRx = NgRx;
-function GraphQL(operationKind, operationName, variables, response) {
+function GraphQLDeprecated(operationKind, operationName, variables, response, duration) {
     return [
-        48 /* Messages.Type.GraphQL */,
+        48 /* Messages.Type.GraphQLDeprecated */,
         operationKind,
         operationName,
         variables,
         response,
+        duration,
     ];
 }
-exports.GraphQL = GraphQL;
+exports.GraphQLDeprecated = GraphQLDeprecated;
 function PerformanceTrack(frames, ticks, totalJSHeapSize, usedJSHeapSize) {
     return [
         49 /* Messages.Type.PerformanceTrack */,
@@ -451,16 +452,28 @@ function CSSInsertRuleURLBased(id, rule, index, baseURL) {
     ];
 }
 exports.CSSInsertRuleURLBased = CSSInsertRuleURLBased;
-function MouseClick(id, hesitationTime, label, selector) {
+function MouseClick(id, hesitationTime, label, selector, normalizedX, normalizedY) {
     return [
-        69 /* Messages.Type.MouseClick */,
+        68 /* Messages.Type.MouseClick */,
         id,
         hesitationTime,
         label,
         selector,
+        normalizedX,
+        normalizedY,
     ];
 }
 exports.MouseClick = MouseClick;
+function MouseClickDeprecated(id, hesitationTime, label, selector) {
+    return [
+        69 /* Messages.Type.MouseClickDeprecated */,
+        id,
+        hesitationTime,
+        label,
+        selector,
+    ];
+}
+exports.MouseClickDeprecated = MouseClickDeprecated;
 function CreateIFrameDocument(frameID, id) {
     return [
         70 /* Messages.Type.CreateIFrameDocument */,
@@ -666,3 +679,24 @@ function Redux(action, state, duration, actionTime) {
     ];
 }
 exports.Redux = Redux;
+function SetPageLocation(url, referrer, navigationStart, documentTitle) {
+    return [
+        122 /* Messages.Type.SetPageLocation */,
+        url,
+        referrer,
+        navigationStart,
+        documentTitle,
+    ];
+}
+exports.SetPageLocation = SetPageLocation;
+function GraphQL(operationKind, operationName, variables, response, duration) {
+    return [
+        123 /* Messages.Type.GraphQL */,
+        operationKind,
+        operationName,
+        variables,
+        response,
+        duration,
+    ];
+}
+exports.GraphQL = GraphQL;

package/cjs/app/nodes.d.ts

@@ -5,7 +5,9 @@ export default class Nodes {
     private totalNodeAmount;
     private readonly nodeCallbacks;
     private readonly elementListeners;
+    private nextNodeId;
     constructor(node_id: string);
+    syntheticMode(frameOrder: number): void;
     attachNodeCallback(nodeCallback: NodeCallback): void;
     scanTree: (cb: (node: Node | void) => void) => void;
     attachNodeListener(node: Node, type: string, listener: EventListener, useCapture?: boolean): void;

package/cjs/app/nodes.js

@@ -8,10 +8,22 @@ class Nodes {
         this.totalNodeAmount = 0;
         this.nodeCallbacks = [];
         this.elementListeners = new Map();
+        this.nextNodeId = 0;
         this.scanTree = (cb) => {
             this.nodes.forEach((node) => cb(node));
         };
     }
+    syntheticMode(frameOrder) {
+        const maxSafeNumber = 9007199254740900;
+        const placeholderSize = 99999999;
+        const nextFrameId = placeholderSize * frameOrder;
+        // I highly doubt that this will ever happen,
+        // but it will be easier to debug if it does
+        if (nextFrameId > maxSafeNumber) {
+            throw new Error('Placeholder id overflow');
+        }
+        this.nextNodeId = nextFrameId;
+    }
     // Attached once per Tracker instance
     attachNodeCallback(nodeCallback) {
         this.nodeCallbacks.push(nodeCallback);
@@ -33,8 +45,9 @@ class Nodes {
         let id = node[this.node_id];
         const isNew = id === undefined;
         if (isNew) {
+            id = this.nextNodeId;
             this.totalNodeAmount++;
-            id = this.nodes.length;
+            this.nextNodeId++;
             this.nodes[id] = node;
             node[this.node_id] = id;
         }
@@ -90,6 +103,7 @@ class Nodes {
             }
             this.unregisterNode(node);
         }
+        this.nextNodeId = 0;
         this.nodes.length = 0;
     }
 }

package/cjs/app/observer/iframe_observer.d.ts

@@ -1,4 +1,5 @@
 import Observer from './observer.js';
 export default class IFrameObserver extends Observer {
     observe(iframe: HTMLIFrameElement): void;
+    syntheticObserve(selfId: number, doc: Document): void;
 }

package/cjs/app/observer/iframe_observer.js

@@ -22,5 +22,14 @@ class IFrameObserver extends observer_js_1.default {
             this.app.send((0, messages_gen_js_1.CreateIFrameDocument)(hostID, docID));
         });
     }
+    syntheticObserve(selfId, doc) {
+        this.observeRoot(doc, (docID) => {
+            if (docID === undefined) {
+                this.app.debug.log('OpenReplay: Iframe document not bound');
+                return;
+            }
+            this.app.send((0, messages_gen_js_1.CreateIFrameDocument)(selfId, docID));
+        });
+    }
 }
 exports.default = IFrameObserver;

package/cjs/app/observer/iframe_offsets.js

@@ -1,5 +1,4 @@
 "use strict";
-// Le truc - for defining an absolute offset for (nested) iframe documents. (To track mouse movments)
 Object.defineProperty(exports, "__esModule", { value: true });
 class IFrameOffsets {
     constructor() {

package/cjs/app/observer/top_observer.d.ts

@@ -19,6 +19,7 @@ export default class TopObserver extends Observer {
     private shadowRootObservers;
     private handleShadowRoot;
     observe(): void;
+    crossdomainObserve(selfId: number, frameOder: number): void;
     disconnect(): void;
 }
 export {};

package/cjs/app/observer/top_observer.js

@@ -107,6 +107,20 @@ class TopObserver extends observer_js_1.default {
             this.app.nodes.callNodeCallbacks(document, true);
         }, window.document.documentElement);
     }
+    crossdomainObserve(selfId, frameOder) {
+        const observer = this;
+        Element.prototype.attachShadow = function () {
+            // eslint-disable-next-line
+            const shadow = attachShadowNativeFn.apply(this, arguments);
+            observer.handleShadowRoot(shadow);
+            return shadow;
+        };
+        this.app.nodes.clear();
+        this.app.nodes.syntheticMode(frameOder);
+        const iframeObserver = new iframe_observer_js_1.default(this.app);
+        this.iframeObservers.push(iframeObserver);
+        iframeObserver.syntheticObserve(selfId, window.document);
+    }
     disconnect() {
         this.iframeOffsets.clear();
         Element.prototype.attachShadow = attachShadowNativeFn;

package/cjs/common/messages.gen.d.ts

@@ -1,6 +1,6 @@
 export declare const enum Type {
     Timestamp = 0,
-    SetPageLocation = 4,
+    SetPageLocationDeprecated = 4,
     SetViewportSize = 5,
     SetViewportScroll = 6,
     CreateDocument = 7,
@@ -34,7 +34,7 @@ export declare const enum Type {
     Vuex = 45,
     MobX = 46,
     NgRx = 47,
-    GraphQL = 48,
+    GraphQLDeprecated = 48,
     PerformanceTrack = 49,
     StringDict = 50,
     SetNodeAttributeDict = 51,
@@ -49,7 +49,8 @@ export declare const enum Type {
     TechnicalInfo = 63,
     CustomIssue = 64,
     CSSInsertRuleURLBased = 67,
-    MouseClick = 69,
+    MouseClick = 68,
+    MouseClickDeprecated = 69,
     CreateIFrameDocument = 70,
     AdoptedSSReplaceURLBased = 71,
     AdoptedSSInsertRuleURLBased = 73,
@@ -71,14 +72,16 @@ export declare const enum Type {
     TabData = 118,
     CanvasNode = 119,
     TagTrigger = 120,
-    Redux = 121
+    Redux = 121,
+    SetPageLocation = 122,
+    GraphQL = 123
 }
 export type Timestamp = [
     Type.Timestamp,
     number
 ];
-export type SetPageLocation = [
-    Type.SetPageLocation,
+export type SetPageLocationDeprecated = [
+    Type.SetPageLocationDeprecated,
     string,
     string,
     number
@@ -274,12 +277,13 @@ export type NgRx = [
     string,
     number
 ];
-export type GraphQL = [
-    Type.GraphQL,
+export type GraphQLDeprecated = [
+    Type.GraphQLDeprecated,
     string,
     string,
     string,
-    string
+    string,
+    number
 ];
 export type PerformanceTrack = [
     Type.PerformanceTrack,
@@ -375,6 +379,15 @@ export type MouseClick = [
     number,
     number,
     string,
+    string,
+    number,
+    number
+];
+export type MouseClickDeprecated = [
+    Type.MouseClickDeprecated,
+    number,
+    number,
+    string,
     string
 ];
 export type CreateIFrameDocument = [
@@ -516,5 +529,20 @@ export type Redux = [
     number,
     number
 ];
-type Message = Timestamp | SetPageLocation | SetViewportSize | SetViewportScroll | CreateDocument | CreateElementNode | CreateTextNode | MoveNode | RemoveNode | SetNodeAttribute | RemoveNodeAttribute | SetNodeData | SetNodeScroll | SetInputTarget | SetInputValue | SetInputChecked | MouseMove | NetworkRequestDeprecated | ConsoleLog | PageLoadTiming | PageRenderTiming | CustomEvent | UserID | UserAnonymousID | Metadata | CSSInsertRule | CSSDeleteRule | Fetch | Profiler | OTable | StateAction | ReduxDeprecated | Vuex | MobX | NgRx | GraphQL | PerformanceTrack | StringDict | SetNodeAttributeDict | ResourceTimingDeprecated | ConnectionInformation | SetPageVisibility | LoadFontFace | SetNodeFocus | LongTask | SetNodeAttributeURLBased | SetCSSDataURLBased | TechnicalInfo | CustomIssue | CSSInsertRuleURLBased | MouseClick | CreateIFrameDocument | AdoptedSSReplaceURLBased | AdoptedSSInsertRuleURLBased | AdoptedSSDeleteRule | AdoptedSSAddOwner | AdoptedSSRemoveOwner | JSException | Zustand | BatchMetadata | PartitionedMessage | NetworkRequest | WSChannel | InputChange | SelectionChange | MouseThrashing | UnbindNodes | ResourceTiming | TabChange | TabData | CanvasNode | TagTrigger | Redux;
+export type SetPageLocation = [
+    Type.SetPageLocation,
+    string,
+    string,
+    number,
+    string
+];
+export type GraphQL = [
+    Type.GraphQL,
+    string,
+    string,
+    string,
+    string,
+    number
+];
+type Message = Timestamp | SetPageLocationDeprecated | SetViewportSize | SetViewportScroll | CreateDocument | CreateElementNode | CreateTextNode | MoveNode | RemoveNode | SetNodeAttribute | RemoveNodeAttribute | SetNodeData | SetNodeScroll | SetInputTarget | SetInputValue | SetInputChecked | MouseMove | NetworkRequestDeprecated | ConsoleLog | PageLoadTiming | PageRenderTiming | CustomEvent | UserID | UserAnonymousID | Metadata | CSSInsertRule | CSSDeleteRule | Fetch | Profiler | OTable | StateAction | ReduxDeprecated | Vuex | MobX | NgRx | GraphQLDeprecated | PerformanceTrack | StringDict | SetNodeAttributeDict | ResourceTimingDeprecated | ConnectionInformation | SetPageVisibility | LoadFontFace | SetNodeFocus | LongTask | SetNodeAttributeURLBased | SetCSSDataURLBased | TechnicalInfo | CustomIssue | CSSInsertRuleURLBased | MouseClick | MouseClickDeprecated | CreateIFrameDocument | AdoptedSSReplaceURLBased | AdoptedSSInsertRuleURLBased | AdoptedSSDeleteRule | AdoptedSSAddOwner | AdoptedSSRemoveOwner | JSException | Zustand | BatchMetadata | PartitionedMessage | NetworkRequest | WSChannel | InputChange | SelectionChange | MouseThrashing | UnbindNodes | ResourceTiming | TabChange | TabData | CanvasNode | TagTrigger | Redux | SetPageLocation | GraphQL;
 export default Message;

package/cjs/index.d.ts

@@ -33,6 +33,7 @@ export default class API {
     private readonly options;
     featureFlags: FeatureFlags;
     private readonly app;
+    private readonly crossdomainMode;
     constructor(options: Options);
     checkDoNotTrack: () => boolean | undefined;
     signalStartIssue: (reason: string, missingApi: string[]) => void;

package/cjs/index.js

@@ -85,6 +85,7 @@ class API {
     constructor(options) {
         this.options = options;
         this.app = null;
+        this.crossdomainMode = false;
         this.checkDoNotTrack = () => {
             return (this.options.respectDoNotTrack &&
                 (navigator.doNotTrack == '1' ||
@@ -97,7 +98,7 @@ class API {
             const orig = this.options.ingestPoint || index_js_1.DEFAULT_INGEST_POINT;
             req.open('POST', orig + '/v1/web/not-started');
             req.send(JSON.stringify({
-                trackerVersion: '13.0.1',
+                trackerVersion: '14.0.0',
                 projectKey: this.options.projectKey,
                 doNotTrack,
                 reason: missingApi.length ? `missing api: ${missingApi.join(',')}` : reason,
@@ -125,6 +126,7 @@ class API {
                 }
             }
         };
+        this.crossdomainMode = Boolean((0, utils_js_1.inIframe)() && options.crossdomain?.enabled);
         if (!utils_js_1.IN_BROWSER || !processOptions(options)) {
             return;
         }
@@ -179,25 +181,32 @@ class API {
             this.signalStartIssue('missing_api', failReason);
             return;
         }
-        const app = new index_js_1.default(options.projectKey, options.sessionToken, options, this.signalStartIssue);
+        const app = new index_js_1.default(options.projectKey, options.sessionToken, options, this.signalStartIssue, this.crossdomainMode);
         this.app = app;
-        (0, viewport_js_1.default)(app);
+        if (!this.crossdomainMode) {
+            // no need to send iframe viewport data since its a node for us
+            (0, viewport_js_1.default)(app);
+            // calculated in main window
+            (0, connection_js_1.default)(app);
+            // while we can calculate it here, trying to compute it for all parts is hard
+            (0, performance_js_1.default)(app, options);
+            // no tabs in iframes yet
+            (0, tabs_js_1.default)(app);
+        }
+        (0, mouse_js_1.default)(app, options.mouse);
+        // inside iframe, we ignore viewport scroll
+        (0, scroll_js_1.default)(app, this.crossdomainMode);
         (0, cssrules_js_1.default)(app);
         (0, constructedStyleSheets_js_1.default)(app);
-        (0, connection_js_1.default)(app);
         (0, console_js_1.default)(app, options);
         (0, exception_js_1.default)(app, options);
         (0, img_js_1.default)(app);
         (0, input_js_1.default)(app, options);
-        (0, mouse_js_1.default)(app, options.mouse);
         (0, timing_js_1.default)(app, options);
-        (0, performance_js_1.default)(app, options);
-        (0, scroll_js_1.default)(app);
         (0, focus_js_1.default)(app);
         (0, fonts_js_1.default)(app);
         (0, network_js_1.default)(app, options.network);
         (0, selection_js_1.default)(app);
-        (0, tabs_js_1.default)(app);
         window.__OPENREPLAY__ = this;
         if (options.flags && options.flags.onFlagsLoad) {
             this.onFlagsLoad(options.flags.onFlagsLoad);

package/cjs/modules/conditionsManager.js

@@ -86,10 +86,10 @@ class ConditionsManager {
             case 27 /* Type.CustomEvent */:
                 this.customEvent(message);
                 break;
-            case 69 /* Type.MouseClick */:
+            case 68 /* Type.MouseClick */:
                 this.clickEvent(message);
                 break;
-            case 4 /* Type.SetPageLocation */:
+            case 122 /* Type.SetPageLocation */:
                 this.pageLocationEvent(message);
                 break;
             case 83 /* Type.NetworkRequest */:

package/cjs/modules/mouse.js

@@ -165,8 +165,14 @@ function default_1(app, options) {
             }
             const id = app.nodes.getID(target);
             if (id !== undefined) {
+                const clickX = e.pageX;
+                const clickY = e.pageY;
+                const contentWidth = document.documentElement.scrollWidth;
+                const contentHeight = document.documentElement.scrollHeight;
+                const normalizedX = roundNumber(clickX / contentWidth);
+                const normalizedY = roundNumber(clickY / contentHeight);
                 sendMouseMove();
-                app.send((0, messages_gen_js_1.MouseClick)(id, mouseTarget === target ? Math.round(performance.now() - mouseTargetTime) : 0, getTargetLabel(target), isClickable(target) && !disableClickmaps ? getSelector(id, target, options) : ''), true);
+                app.send((0, messages_gen_js_1.MouseClick)(id, mouseTarget === target ? Math.round(performance.now() - mouseTargetTime) : 0, getTargetLabel(target), isClickable(target) && !disableClickmaps ? getSelector(id, target, options) : '', normalizedX, normalizedY), true);
             }
             mouseTarget = null;
         });
@@ -180,3 +186,10 @@ function default_1(app, options) {
     app.ticker.attach(sendMouseMove, options?.trackingOffset || 7);
 }
 exports.default = default_1;
+/**
+ * we get 0 to 1 decimal number, convert and round it, then turn to %
+ * 0.39643 => 396.43 => 396 => 39.6%
+ * */
+function roundNumber(num) {
+    return Math.round(num * 1e3) / 1e1;
+}

package/cjs/modules/scroll.d.ts

@@ -1,2 +1,2 @@
 import type App from '../app/index.js';
-export default function (app: App): void;
+export default function (app: App, insideIframe: boolean | null): void;

package/cjs/modules/scroll.js

@@ -5,17 +5,17 @@ const guards_js_1 = require("../app/guards.js");
 function getDocumentScroll(doc) {
     const win = doc.defaultView;
     return [
-        (win && win.pageXOffset) ||
+        (win && win.scrollX) ||
             (doc.documentElement && doc.documentElement.scrollLeft) ||
             (doc.body && doc.body.scrollLeft) ||
             0,
-        (win && win.pageYOffset) ||
+        (win && win.scrollY) ||
             (doc.documentElement && doc.documentElement.scrollTop) ||
             (doc.body && doc.body.scrollTop) ||
             0,
     ];
 }
-function default_1(app) {
+function default_1(app, insideIframe) {
     let documentScroll = false;
     const nodeScroll = new Map();
     function setNodeScroll(target) {
@@ -29,7 +29,12 @@ function default_1(app) {
             nodeScroll.set(target, getDocumentScroll(target));
         }
     }
-    const sendSetViewportScroll = app.safe(() => app.send((0, messages_gen_js_1.SetViewportScroll)(...getDocumentScroll(document))));
+    const sendSetViewportScroll = app.safe(() => {
+        if (insideIframe) {
+            return;
+        }
+        app.send((0, messages_gen_js_1.SetViewportScroll)(...getDocumentScroll(document)));
+    });
     const sendSetNodeScroll = app.safe((s, node) => {
         const id = app.nodes.getID(node);
         if (id !== undefined) {

package/cjs/modules/viewport.js

@@ -10,7 +10,7 @@ function default_1(app) {
         const { URL } = document;
         if (URL !== url) {
             url = URL;
-            app.send((0, messages_gen_js_1.SetPageLocation)(url, referrer, navigationStart));
+            app.send((0, messages_gen_js_1.SetPageLocation)(url, referrer, navigationStart, document.title));
             navigationStart = 0;
             referrer = url;
         }
@@ -27,7 +27,7 @@ function default_1(app) {
         ? Function.prototype
         : app.safe(() => app.send((0, messages_gen_js_1.SetPageVisibility)(document.hidden)));
     app.attachStartCallback(() => {
-        url = '';
+        url = null;
         navigationStart = (0, utils_js_1.getTimeOrigin)();
         width = height = -1;
         sendSetPageLocation();

package/cjs/utils.d.ts

@@ -16,7 +16,7 @@ export declare function hasOpenreplayAttribute(e: Element, attr: string): boolea
  **/
 export declare function canAccessIframe(iframe: HTMLIFrameElement): boolean;
 export declare function generateRandomId(len?: number): string;
-export declare function inIframe(): boolean;
+export declare function inIframe(): boolean | null;
 /**
  * Because angular devs decided that its a good idea to override a browser apis
  * we need to use this to achieve safe behavior
@@ -26,3 +26,4 @@ export declare function createMutationObserver(cb: MutationCallback): MutationOb
 export declare function createEventListener(target: EventTarget, event: string, cb: EventListenerOrEventListenerObject, capture?: boolean): void;
 export declare function deleteEventListener(target: EventTarget, event: string, cb: EventListenerOrEventListenerObject, capture?: boolean): void;
 export declare function requestIdleCb(callback: () => void): void;
+export declare function simpleMerge<T>(defaultObj: T, givenObj: Partial<T>): T;

package/cjs/utils.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.requestIdleCb = exports.deleteEventListener = exports.createEventListener = exports.createMutationObserver = exports.ngSafeBrowserMethod = exports.inIframe = exports.generateRandomId = exports.canAccessIframe = exports.hasOpenreplayAttribute = exports.getLabelAttribute = exports.deprecationWarn = exports.DOCS_HOST = exports.isURL = exports.normSpaces = exports.stars = exports.now = exports.getTimeOrigin = exports.adjustTimeOrigin = exports.MAX_STR_LEN = exports.IS_FIREFOX = exports.IN_BROWSER = void 0;
+exports.simpleMerge = exports.requestIdleCb = exports.deleteEventListener = exports.createEventListener = exports.createMutationObserver = exports.ngSafeBrowserMethod = exports.inIframe = exports.generateRandomId = exports.canAccessIframe = exports.hasOpenreplayAttribute = exports.getLabelAttribute = exports.deprecationWarn = exports.DOCS_HOST = exports.isURL = exports.normSpaces = exports.stars = exports.now = exports.getTimeOrigin = exports.adjustTimeOrigin = exports.MAX_STR_LEN = exports.IS_FIREFOX = exports.IN_BROWSER = void 0;
 const DEPRECATED_ATTRS = { htmlmasked: 'hidden', masked: 'obscured' };
 exports.IN_BROWSER = !(typeof window === 'undefined');
 exports.IS_FIREFOX = exports.IN_BROWSER && navigator.userAgent.match(/firefox|fxios/i);
@@ -89,13 +89,18 @@ function generateRandomId(len) {
     // msCrypto = IE11
     // @ts-ignore
     const safeCrypto = window.crypto || window.msCrypto;
-    safeCrypto.getRandomValues(arr);
-    return Array.from(arr, dec2hex).join('');
+    if (safeCrypto) {
+        safeCrypto.getRandomValues(arr);
+        return Array.from(arr, dec2hex).join('');
+    }
+    else {
+        return Array.from({ length: len || 40 }, () => dec2hex(Math.floor(Math.random() * 16))).join('');
+    }
 }
 exports.generateRandomId = generateRandomId;
 function inIframe() {
     try {
-        return window.self !== window.top;
+        return window.self && window.top && window.self !== window.top;
     }
     catch (e) {
         return true;
@@ -125,9 +130,10 @@ function createEventListener(target, event, cb, capture) {
         target[safeAddEventListener](event, cb, capture);
     }
     catch (e) {
+        const msg = e.message;
         console.debug(
         // eslint-disable-next-line @typescript-eslint/restrict-template-expressions
-        `Openreplay: ${e.messages}; if this error is caused by an IframeObserver, ignore it`);
+        `Openreplay: ${msg}; if this error is caused by an IframeObserver, ignore it`);
     }
 }
 exports.createEventListener = createEventListener;
@@ -137,9 +143,10 @@ function deleteEventListener(target, event, cb, capture) {
         target[safeRemoveEventListener](event, cb, capture);
     }
     catch (e) {
+        const msg = e.message;
         console.debug(
         // eslint-disable-next-line @typescript-eslint/restrict-template-expressions
-        `Openreplay: ${e.messages}; if this error is caused by an IframeObserver, ignore it`);
+        `Openreplay: ${msg}; if this error is caused by an IframeObserver, ignore it`);
     }
 }
 exports.deleteEventListener = deleteEventListener;
@@ -201,3 +208,23 @@ function requestIdleCb(callback) {
     // }
 }
 exports.requestIdleCb = requestIdleCb;
+function simpleMerge(defaultObj, givenObj) {
+    const result = { ...defaultObj };
+    for (const key in givenObj) {
+        // eslint-disable-next-line no-prototype-builtins
+        if (givenObj.hasOwnProperty(key)) {
+            const userOptionValue = givenObj[key];
+            const defaultOptionValue = defaultObj[key];
+            if (typeof userOptionValue === 'object' &&
+                !Array.isArray(userOptionValue) &&
+                userOptionValue !== null) {
+                result[key] = simpleMerge(defaultOptionValue || {}, userOptionValue);
+            }
+            else {
+                result[key] = userOptionValue;
+            }
+        }
+    }
+    return result;
+}
+exports.simpleMerge = simpleMerge;

package/lib/app/canvas.d.ts

@@ -5,6 +5,7 @@ interface Options {
     isDebug?: boolean;
     fixedScaling?: boolean;
     useAnimationFrame?: boolean;
+    fileExt?: 'webp' | 'png' | 'jpeg' | 'avif';
 }
 declare class CanvasRecorder {
     private readonly app;
@@ -12,6 +13,7 @@ declare class CanvasRecorder {
     private snapshots;
     private readonly intervals;
     private readonly interval;
+    private readonly fileExt;
     constructor(app: App, options: Options);
     startTracking(): void;
     restartTracking: () => void;