@openreplay/tracker 5.0.2-beta.1 → 5.0.3

package/cjs/app/index.js

@@ -33,7 +33,7 @@ class App {
         this.stopCallbacks = [];
         this.commitCallbacks = [];
         this.activityState = ActivityState.NotActive;
-        this.version = '5.0.2-beta.1'; // TODO: version compatability check inside each plugin.
+        this.version = '5.0.3'; // TODO: version compatability check inside each plugin.
         this._usingOldFetchPlugin = false;
         this.delay = 0;
         this.projectKey = projectKey;

package/cjs/app/nodes.d.ts

@@ -2,6 +2,7 @@ type NodeCallback = (node: Node, isStart: boolean) => void;
 export default class Nodes {
     private readonly node_id;
     private nodes;
+    private totalNodeAmount;
     private readonly nodeCallbacks;
     private readonly elementListeners;
     constructor(node_id: string);

package/cjs/app/nodes.js

@@ -4,6 +4,7 @@ class Nodes {
     constructor(node_id) {
         this.node_id = node_id;
         this.nodes = [];
+        this.totalNodeAmount = 0;
         this.nodeCallbacks = [];
         this.elementListeners = new Map();
     }
@@ -28,6 +29,7 @@ class Nodes {
         let id = node[this.node_id];
         const isNew = id === undefined;
         if (isNew) {
+            this.totalNodeAmount++;
             id = this.nodes.length;
             this.nodes[id] = node;
             node[this.node_id] = id;
@@ -44,6 +46,7 @@ class Nodes {
                 this.elementListeners.delete(id);
                 listeners.forEach((listener) => node.removeEventListener(listener[0], listener[1], listener[2]));
             }
+            this.totalNodeAmount--;
         }
         return id;
     }

package/cjs/index.d.ts

@@ -12,6 +12,7 @@ import type { Options as TimingOptions } from './modules/timing.js';
 import type { Options as NetworkOptions } from './modules/network.js';
 import type { StartOptions } from './app/index.js';
 import type { StartPromiseReturn } from './app/index.js';
+import type { MouseHandlerOptions } from './modules/mouse.js';
 export type Options = Partial<AppOptions & ConsoleOptions & ExceptionOptions & InputOptions & PerformanceOptions & TimingOptions> & {
     projectID?: number;
     projectKey: string;
@@ -19,6 +20,7 @@ export type Options = Partial<AppOptions & ConsoleOptions & ExceptionOptions & I
     respectDoNotTrack?: boolean;
     autoResetOnWindowOpen?: boolean;
     network?: NetworkOptions;
+    mouse?: MouseHandlerOptions;
     __DISABLE_SECURE_MODE?: boolean;
 };
 export default class API {

package/cjs/index.js

@@ -109,7 +109,7 @@ class API {
             (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);
+            (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);
@@ -140,7 +140,7 @@ class API {
             // no-cors issue only with text/plain or not-set Content-Type
             // req.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
             req.send(JSON.stringify({
-                trackerVersion: '5.0.2-beta.1',
+                trackerVersion: '5.0.3',
                 projectKey: options.projectKey,
                 doNotTrack,
                 // TODO: add precise reason (an exact API missing)

package/cjs/modules/mouse.d.ts

@@ -1,2 +1,24 @@
 import type App from '../app/index.js';
-export default function (app: App): void;
+export interface MouseHandlerOptions {
+    disableClickmaps?: boolean;
+    /** minimum length of an optimised selector.
+     *
+     * body > div > div > p => body > p for example
+     *
+     * default 2
+     * */
+    minSelectorDepth?: number;
+    /** how many selectors to try before falling back to nth-child selectors
+     * performance expensive operation
+     *
+     * default 1000
+     * */
+    nthThreshold?: number;
+    /**
+     * how many tries to optimise and shorten the selector
+     *
+     * default 10_000
+     * */
+    maxOptimiseTries?: number;
+}
+export default function (app: App, options?: MouseHandlerOptions): void;

package/cjs/modules/mouse.js

@@ -5,13 +5,13 @@ const utils_js_1 = require("../utils.js");
 const messages_gen_js_1 = require("../app/messages.gen.js");
 const input_js_1 = require("./input.js");
 const finder_1 = require("@medv/finder");
-function _getSelector(target, document) {
+function _getSelector(target, document, options) {
     const selector = (0, finder_1.finder)(target, {
         root: document.body,
         seedMinLength: 3,
-        optimizedMinLength: 2,
-        threshold: 1000,
-        maxNumberOfTries: 10000,
+        optimizedMinLength: (options === null || options === void 0 ? void 0 : options.minSelectorDepth) || 2,
+        threshold: (options === null || options === void 0 ? void 0 : options.nthThreshold) || 1000,
+        maxNumberOfTries: (options === null || options === void 0 ? void 0 : options.maxOptimiseTries) || 10000,
     });
     return selector;
 }
@@ -26,7 +26,7 @@ function isClickable(element) {
         element.onclick != null ||
         element.getAttribute('role') === 'button');
     //|| element.className.includes("btn")
-    // MBTODO: intersept addEventListener
+    // MBTODO: intercept addEventListener
 }
 //TODO: fix (typescript is not sure about target variable after assignation of svg)
 function getTarget(target, document) {
@@ -66,7 +66,8 @@ function _getTarget(target, document) {
     }
     return target === document.documentElement ? null : target;
 }
-function default_1(app) {
+function default_1(app, options) {
+    const { disableClickmaps = false } = options || {};
     function getTargetLabel(target) {
         const dl = (0, utils_js_1.getLabelAttribute)(target);
         if (dl !== null) {
@@ -105,8 +106,8 @@ function default_1(app) {
         }
     };
     const patchDocument = (document, topframe = false) => {
-        function getSelector(id, target) {
-            return (selectorMap[id] = selectorMap[id] || _getSelector(target, document));
+        function getSelector(id, target, options) {
+            return (selectorMap[id] = selectorMap[id] || _getSelector(target, document, options));
         }
         const attachListener = topframe
             ? app.attachEventListener.bind(app) // attached/removed on start/stop
@@ -132,7 +133,7 @@ function default_1(app) {
             const id = app.nodes.getID(target);
             if (id !== undefined) {
                 sendMouseMove();
-                app.send((0, messages_gen_js_1.MouseClick)(id, mouseTarget === target ? Math.round(performance.now() - mouseTargetTime) : 0, getTargetLabel(target), isClickable(target) ? getSelector(id, target) : ''), 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) : ''), true);
             }
             mouseTarget = null;
         });

package/lib/app/index.js

@@ -30,7 +30,7 @@ export default class App {
         this.stopCallbacks = [];
         this.commitCallbacks = [];
         this.activityState = ActivityState.NotActive;
-        this.version = '5.0.2-beta.1'; // TODO: version compatability check inside each plugin.
+        this.version = '5.0.3'; // TODO: version compatability check inside each plugin.
         this._usingOldFetchPlugin = false;
         this.delay = 0;
         this.projectKey = projectKey;

package/lib/app/nodes.d.ts

@@ -2,6 +2,7 @@ type NodeCallback = (node: Node, isStart: boolean) => void;
 export default class Nodes {
     private readonly node_id;
     private nodes;
+    private totalNodeAmount;
     private readonly nodeCallbacks;
     private readonly elementListeners;
     constructor(node_id: string);

package/lib/app/nodes.js

@@ -2,6 +2,7 @@ export default class Nodes {
     constructor(node_id) {
         this.node_id = node_id;
         this.nodes = [];
+        this.totalNodeAmount = 0;
         this.nodeCallbacks = [];
         this.elementListeners = new Map();
     }
@@ -26,6 +27,7 @@ export default class Nodes {
         let id = node[this.node_id];
         const isNew = id === undefined;
         if (isNew) {
+            this.totalNodeAmount++;
             id = this.nodes.length;
             this.nodes[id] = node;
             node[this.node_id] = id;
@@ -42,6 +44,7 @@ export default class Nodes {
                 this.elementListeners.delete(id);
                 listeners.forEach((listener) => node.removeEventListener(listener[0], listener[1], listener[2]));
             }
+            this.totalNodeAmount--;
         }
         return id;
     }

package/lib/index.d.ts

@@ -12,6 +12,7 @@ import type { Options as TimingOptions } from './modules/timing.js';
 import type { Options as NetworkOptions } from './modules/network.js';
 import type { StartOptions } from './app/index.js';
 import type { StartPromiseReturn } from './app/index.js';
+import type { MouseHandlerOptions } from './modules/mouse.js';
 export type Options = Partial<AppOptions & ConsoleOptions & ExceptionOptions & InputOptions & PerformanceOptions & TimingOptions> & {
     projectID?: number;
     projectKey: string;
@@ -19,6 +20,7 @@ export type Options = Partial<AppOptions & ConsoleOptions & ExceptionOptions & I
     respectDoNotTrack?: boolean;
     autoResetOnWindowOpen?: boolean;
     network?: NetworkOptions;
+    mouse?: MouseHandlerOptions;
     __DISABLE_SECURE_MODE?: boolean;
 };
 export default class API {

package/lib/index.js

@@ -104,7 +104,7 @@ export default class API {
             Exception(app, options);
             Img(app);
             Input(app, options);
-            Mouse(app);
+            Mouse(app, options.mouse);
             Timing(app, options);
             Performance(app, options);
             Scroll(app);
@@ -135,7 +135,7 @@ export default class API {
             // no-cors issue only with text/plain or not-set Content-Type
             // req.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
             req.send(JSON.stringify({
-                trackerVersion: '5.0.2-beta.1',
+                trackerVersion: '5.0.3',
                 projectKey: options.projectKey,
                 doNotTrack,
                 // TODO: add precise reason (an exact API missing)

package/lib/modules/mouse.d.ts

@@ -1,2 +1,24 @@
 import type App from '../app/index.js';
-export default function (app: App): void;
+export interface MouseHandlerOptions {
+    disableClickmaps?: boolean;
+    /** minimum length of an optimised selector.
+     *
+     * body > div > div > p => body > p for example
+     *
+     * default 2
+     * */
+    minSelectorDepth?: number;
+    /** how many selectors to try before falling back to nth-child selectors
+     * performance expensive operation
+     *
+     * default 1000
+     * */
+    nthThreshold?: number;
+    /**
+     * how many tries to optimise and shorten the selector
+     *
+     * default 10_000
+     * */
+    maxOptimiseTries?: number;
+}
+export default function (app: App, options?: MouseHandlerOptions): void;

package/lib/modules/mouse.js

@@ -3,13 +3,13 @@ import { normSpaces, hasOpenreplayAttribute, getLabelAttribute } from '../utils.
 import { MouseMove, MouseClick } from '../app/messages.gen.js';
 import { getInputLabel } from './input.js';
 import { finder } from '@medv/finder';
-function _getSelector(target, document) {
+function _getSelector(target, document, options) {
     const selector = finder(target, {
         root: document.body,
         seedMinLength: 3,
-        optimizedMinLength: 2,
-        threshold: 1000,
-        maxNumberOfTries: 10000,
+        optimizedMinLength: (options === null || options === void 0 ? void 0 : options.minSelectorDepth) || 2,
+        threshold: (options === null || options === void 0 ? void 0 : options.nthThreshold) || 1000,
+        maxNumberOfTries: (options === null || options === void 0 ? void 0 : options.maxOptimiseTries) || 10000,
     });
     return selector;
 }
@@ -24,7 +24,7 @@ function isClickable(element) {
         element.onclick != null ||
         element.getAttribute('role') === 'button');
     //|| element.className.includes("btn")
-    // MBTODO: intersept addEventListener
+    // MBTODO: intercept addEventListener
 }
 //TODO: fix (typescript is not sure about target variable after assignation of svg)
 function getTarget(target, document) {
@@ -64,7 +64,8 @@ function _getTarget(target, document) {
     }
     return target === document.documentElement ? null : target;
 }
-export default function (app) {
+export default function (app, options) {
+    const { disableClickmaps = false } = options || {};
     function getTargetLabel(target) {
         const dl = getLabelAttribute(target);
         if (dl !== null) {
@@ -103,8 +104,8 @@ export default function (app) {
         }
     };
     const patchDocument = (document, topframe = false) => {
-        function getSelector(id, target) {
-            return (selectorMap[id] = selectorMap[id] || _getSelector(target, document));
+        function getSelector(id, target, options) {
+            return (selectorMap[id] = selectorMap[id] || _getSelector(target, document, options));
         }
         const attachListener = topframe
             ? app.attachEventListener.bind(app) // attached/removed on start/stop
@@ -130,7 +131,7 @@ export default function (app) {
             const id = app.nodes.getID(target);
             if (id !== undefined) {
                 sendMouseMove();
-                app.send(MouseClick(id, mouseTarget === target ? Math.round(performance.now() - mouseTargetTime) : 0, getTargetLabel(target), isClickable(target) ? getSelector(id, target) : ''), true);
+                app.send(MouseClick(id, mouseTarget === target ? Math.round(performance.now() - mouseTargetTime) : 0, getTargetLabel(target), isClickable(target) && !disableClickmaps ? getSelector(id, target, options) : ''), true);
             }
             mouseTarget = null;
         });

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@openreplay/tracker",
   "description": "The OpenReplay tracker main package",
-  "version": "5.0.2-beta.1",
+  "version": "5.0.3",
   "keywords": [
     "logging",
     "replay"