@openreplay/tracker 5.0.2-beta → 5.0.2

package/cjs/app/observer/top_observer.js

@@ -0,0 +1,113 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const observer_js_1 = require("./observer.js");
+const guards_js_1 = require("../guards.js");
+const iframe_observer_js_1 = require("./iframe_observer.js");
+const shadow_root_observer_js_1 = require("./shadow_root_observer.js");
+const iframe_offsets_js_1 = require("./iframe_offsets.js");
+const messages_gen_js_1 = require("../messages.gen.js");
+const utils_js_1 = require("../../utils.js");
+const attachShadowNativeFn = utils_js_1.IN_BROWSER ? Element.prototype.attachShadow : () => new ShadowRoot();
+class TopObserver extends observer_js_1.default {
+    constructor(app, options) {
+        super(app, true);
+        this.iframeOffsets = new iframe_offsets_js_1.default();
+        this.contextCallbacks = [];
+        // Attached once per Tracker instance
+        this.contextsSet = new Set();
+        this.iframeObservers = [];
+        this.shadowRootObservers = [];
+        this.options = Object.assign({
+            captureIFrames: true,
+        }, options);
+        // IFrames
+        this.app.nodes.attachNodeCallback((node) => {
+            if ((0, guards_js_1.hasTag)(node, 'iframe') &&
+                ((this.options.captureIFrames && !(0, utils_js_1.hasOpenreplayAttribute)(node, 'obscured')) ||
+                    (0, utils_js_1.hasOpenreplayAttribute)(node, 'capture'))) {
+                this.handleIframe(node);
+            }
+        });
+        // ShadowDOM
+        this.app.nodes.attachNodeCallback((node) => {
+            if ((0, guards_js_1.isElementNode)(node) && node.shadowRoot !== null) {
+                this.handleShadowRoot(node.shadowRoot);
+            }
+        });
+    }
+    attachContextCallback(cb) {
+        this.contextCallbacks.push(cb);
+    }
+    getDocumentOffset(doc) {
+        return this.iframeOffsets.getDocumentOffset(doc);
+    }
+    handleIframe(iframe) {
+        let doc = null;
+        // setTimeout is required. Otherwise some event listeners (scroll, mousemove) applied in modules
+        //     do not work on the iframe document when it 've been loaded dynamically ((why?))
+        const handle = this.app.safe(() => setTimeout(() => {
+            const id = this.app.nodes.getID(iframe);
+            if (id === undefined) {
+                //log
+                return;
+            }
+            const currentWin = iframe.contentWindow;
+            const currentDoc = iframe.contentDocument;
+            if (currentDoc && currentDoc !== doc) {
+                const observer = new iframe_observer_js_1.default(this.app);
+                this.iframeObservers.push(observer);
+                observer.observe(iframe); // TODO: call unregisterNode for the previous doc if present (incapsulate: one iframe - one observer)
+                doc = currentDoc;
+                this.iframeOffsets.observe(iframe);
+            }
+            if (currentWin &&
+                // Sometimes currentWin.window is null (not in specification). Such window object is not functional
+                currentWin === currentWin.window &&
+                !this.contextsSet.has(currentWin) // for each context callbacks called once per Tracker (TopObserver) instance
+            //TODO: more explicit logic
+            ) {
+                this.contextsSet.add(currentWin);
+                //@ts-ignore https://github.com/microsoft/TypeScript/issues/41684
+                this.contextCallbacks.forEach((cb) => cb(currentWin));
+            }
+        }, 0));
+        iframe.addEventListener('load', handle); // why app.attachEventListener not working?
+        handle();
+    }
+    handleShadowRoot(shRoot) {
+        const observer = new shadow_root_observer_js_1.default(this.app);
+        this.shadowRootObservers.push(observer);
+        observer.observe(shRoot.host);
+    }
+    observe() {
+        // Protection from several subsequent calls?
+        const observer = this;
+        Element.prototype.attachShadow = function () {
+            // eslint-disable-next-line
+            const shadow = attachShadowNativeFn.apply(this, arguments);
+            observer.handleShadowRoot(shadow);
+            return shadow;
+        };
+        // Can observe documentElement (<html>) here, because it is not supposed to be changing.
+        // However, it is possible in some exotic cases and may cause an ignorance of the newly created <html>
+        // In this case context.document have to be observed, but this will cause
+        // the change in the re-player behaviour caused by CreateDocument message:
+        //   the 0-node ("fRoot") will become #document rather than documentElement as it is now.
+        // Alternatively - observe(#document) then bindNode(documentElement)
+        this.observeRoot(window.document, () => {
+            this.app.send((0, messages_gen_js_1.CreateDocument)());
+            // it has no node_id here
+            this.app.nodes.callNodeCallbacks(document, true);
+        }, window.document.documentElement);
+    }
+    disconnect() {
+        this.iframeOffsets.clear();
+        Element.prototype.attachShadow = attachShadowNativeFn;
+        this.iframeObservers.forEach((o) => o.disconnect());
+        this.iframeObservers = [];
+        this.shadowRootObservers.forEach((o) => o.disconnect());
+        this.shadowRootObservers = [];
+        super.disconnect();
+    }
+}
+exports.default = TopObserver;

package/cjs/app/sanitizer.d.ts

@@ -0,0 +1,24 @@
+import type App from './index.js';
+export declare enum SanitizeLevel {
+    Plain = 0,
+    Obscured = 1,
+    Hidden = 2
+}
+export interface Options {
+    obscureTextEmails: boolean;
+    obscureTextNumbers: boolean;
+    domSanitizer?: (node: Element) => SanitizeLevel;
+}
+export default class Sanitizer {
+    private readonly app;
+    private readonly obscured;
+    private readonly hidden;
+    private readonly options;
+    constructor(app: App, options: Partial<Options>);
+    handleNode(id: number, parentID: number, node: Node): void;
+    sanitize(id: number, data: string): string;
+    isObscured(id: number): boolean;
+    isHidden(id: number): boolean;
+    getInnerTextSecure(el: HTMLElement): string;
+    clear(): void;
+}

package/cjs/app/sanitizer.js

@@ -0,0 +1,76 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SanitizeLevel = void 0;
+const utils_js_1 = require("../utils.js");
+const guards_js_1 = require("./guards.js");
+var SanitizeLevel;
+(function (SanitizeLevel) {
+    SanitizeLevel[SanitizeLevel["Plain"] = 0] = "Plain";
+    SanitizeLevel[SanitizeLevel["Obscured"] = 1] = "Obscured";
+    SanitizeLevel[SanitizeLevel["Hidden"] = 2] = "Hidden";
+})(SanitizeLevel = exports.SanitizeLevel || (exports.SanitizeLevel = {}));
+class Sanitizer {
+    constructor(app, options) {
+        this.app = app;
+        this.obscured = new Set();
+        this.hidden = new Set();
+        this.options = Object.assign({
+            obscureTextEmails: true,
+            obscureTextNumbers: false,
+        }, options);
+    }
+    handleNode(id, parentID, node) {
+        if (this.obscured.has(parentID) ||
+            ((0, guards_js_1.isElementNode)(node) &&
+                ((0, utils_js_1.hasOpenreplayAttribute)(node, 'masked') || (0, utils_js_1.hasOpenreplayAttribute)(node, 'obscured')))) {
+            this.obscured.add(id);
+        }
+        if (this.hidden.has(parentID) ||
+            ((0, guards_js_1.isElementNode)(node) &&
+                ((0, utils_js_1.hasOpenreplayAttribute)(node, 'htmlmasked') || (0, utils_js_1.hasOpenreplayAttribute)(node, 'hidden')))) {
+            this.hidden.add(id);
+        }
+        if (this.options.domSanitizer !== undefined && (0, guards_js_1.isElementNode)(node)) {
+            const sanitizeLevel = this.options.domSanitizer(node);
+            if (sanitizeLevel === SanitizeLevel.Obscured) {
+                this.obscured.add(id);
+            }
+            if (sanitizeLevel === SanitizeLevel.Hidden) {
+                this.hidden.add(id);
+            }
+        }
+    }
+    sanitize(id, data) {
+        if (this.obscured.has(id)) {
+            // TODO: is it the best place to put trim() ? Might trimmed spaces be considered in layout in certain cases?
+            return data
+                .trim()
+                .replace(/[^\f\n\r\t\v\u00a0\u1680\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]/g, '█');
+        }
+        if (this.options.obscureTextNumbers) {
+            data = data.replace(/\d/g, '0');
+        }
+        if (this.options.obscureTextEmails) {
+            data = data.replace(/([^\s]+)@([^\s]+)\.([^\s]+)/g, (...f) => (0, utils_js_1.stars)(f[1]) + '@' + (0, utils_js_1.stars)(f[2]) + '.' + (0, utils_js_1.stars)(f[3]));
+        }
+        return data;
+    }
+    isObscured(id) {
+        return this.obscured.has(id);
+    }
+    isHidden(id) {
+        return this.hidden.has(id);
+    }
+    getInnerTextSecure(el) {
+        const id = this.app.nodes.getID(el);
+        if (!id) {
+            return '';
+        }
+        return this.sanitize(id, el.innerText);
+    }
+    clear() {
+        this.obscured.clear();
+        this.hidden.clear();
+    }
+}
+exports.default = Sanitizer;

package/cjs/app/session.d.ts

@@ -0,0 +1,38 @@
+import type App from './index.js';
+interface SessionInfo {
+    sessionID: string | undefined;
+    metadata: Record<string, string>;
+    userID: string | null;
+    timestamp: number;
+    projectID?: string;
+}
+type OnUpdateCallback = (i: Partial<SessionInfo>) => void;
+export type Options = {
+    session_token_key: string;
+    session_pageno_key: string;
+};
+export default class Session {
+    private readonly app;
+    private readonly options;
+    private metadata;
+    private userID;
+    private sessionID;
+    private readonly callbacks;
+    private timestamp;
+    private projectID;
+    constructor(app: App, options: Options);
+    attachUpdateCallback(cb: OnUpdateCallback): void;
+    private handleUpdate;
+    assign(newInfo: Partial<SessionInfo>): void;
+    setMetadata(key: string, value: string): void;
+    setUserID(userID: string): void;
+    private getPageNumber;
+    incPageNo(): number;
+    getSessionToken(): string | undefined;
+    setSessionToken(token: string): void;
+    applySessionHash(hash: string): void;
+    getSessionHash(): string | undefined;
+    getInfo(): SessionInfo;
+    reset(): void;
+}
+export {};

package/cjs/app/session.js

@@ -0,0 +1,114 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+class Session {
+    constructor(app, options) {
+        this.app = app;
+        this.options = options;
+        this.metadata = {};
+        this.userID = null;
+        this.callbacks = [];
+        this.timestamp = 0;
+    }
+    attachUpdateCallback(cb) {
+        this.callbacks.push(cb);
+    }
+    handleUpdate(newInfo) {
+        if (newInfo.userID == null) {
+            delete newInfo.userID;
+        }
+        if (newInfo.sessionID == null) {
+            delete newInfo.sessionID;
+        }
+        this.callbacks.forEach((cb) => cb(newInfo));
+    }
+    assign(newInfo) {
+        if (newInfo.userID !== undefined) {
+            // TODO clear nullable/undefinable types
+            this.userID = newInfo.userID;
+        }
+        if (newInfo.metadata !== undefined) {
+            Object.entries(newInfo.metadata).forEach(([k, v]) => (this.metadata[k] = v));
+        }
+        if (newInfo.sessionID !== undefined) {
+            this.sessionID = newInfo.sessionID;
+        }
+        if (newInfo.timestamp !== undefined) {
+            this.timestamp = newInfo.timestamp;
+        }
+        if (newInfo.projectID !== undefined) {
+            this.projectID = newInfo.projectID;
+        }
+        this.handleUpdate(newInfo);
+    }
+    setMetadata(key, value) {
+        this.metadata[key] = value;
+        this.handleUpdate({ metadata: { [key]: value } });
+    }
+    setUserID(userID) {
+        this.userID = userID;
+        this.handleUpdate({ userID });
+    }
+    getPageNumber() {
+        const pageNoStr = this.app.sessionStorage.getItem(this.options.session_pageno_key);
+        if (pageNoStr == null) {
+            return undefined;
+        }
+        return parseInt(pageNoStr);
+    }
+    incPageNo() {
+        let pageNo = this.getPageNumber();
+        if (pageNo === undefined) {
+            pageNo = 0;
+        }
+        else {
+            pageNo++;
+        }
+        this.app.sessionStorage.setItem(this.options.session_pageno_key, pageNo.toString());
+        return pageNo;
+    }
+    getSessionToken() {
+        return this.app.sessionStorage.getItem(this.options.session_token_key) || undefined;
+    }
+    setSessionToken(token) {
+        this.app.sessionStorage.setItem(this.options.session_token_key, token);
+    }
+    applySessionHash(hash) {
+        const hashParts = decodeURI(hash).split('&');
+        let token = hash;
+        let pageNoStr = '100500'; // back-compat for sessionToken
+        if (hashParts.length == 2) {
+            ;
+            [pageNoStr, token] = hashParts;
+        }
+        if (!pageNoStr || !token) {
+            return;
+        }
+        this.app.sessionStorage.setItem(this.options.session_token_key, token);
+        this.app.sessionStorage.setItem(this.options.session_pageno_key, pageNoStr);
+    }
+    getSessionHash() {
+        const pageNo = this.getPageNumber();
+        const token = this.getSessionToken();
+        if (pageNo === undefined || token === undefined) {
+            return;
+        }
+        return encodeURI(String(pageNo) + '&' + token);
+    }
+    getInfo() {
+        return {
+            sessionID: this.sessionID,
+            metadata: this.metadata,
+            userID: this.userID,
+            timestamp: this.timestamp,
+            projectID: this.projectID,
+        };
+    }
+    reset() {
+        this.app.sessionStorage.removeItem(this.options.session_token_key);
+        this.metadata = {};
+        this.userID = null;
+        this.sessionID = undefined;
+        this.timestamp = 0;
+    }
+}
+exports.default = Session;

package/cjs/app/ticker.d.ts

@@ -0,0 +1,12 @@
+import App from './index.js';
+type Callback = () => void;
+export default class Ticker {
+    private readonly app;
+    private timer;
+    private readonly callbacks;
+    constructor(app: App);
+    attach(callback: Callback, n?: number, useSafe?: boolean, thisArg?: any): void;
+    start(): void;
+    stop(): void;
+}
+export {};

package/cjs/app/ticker.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function wrap(callback, n) {
+    let t = 0;
+    return () => {
+        if (t++ >= n) {
+            t = 0;
+            callback();
+        }
+    };
+}
+class Ticker {
+    constructor(app) {
+        this.app = app;
+        this.timer = null;
+        this.callbacks = [];
+    }
+    attach(callback, n = 0, useSafe = true, thisArg) {
+        if (thisArg) {
+            callback = callback.bind(thisArg);
+        }
+        if (useSafe) {
+            callback = this.app.safe(callback);
+        }
+        this.callbacks.unshift(n ? wrap(callback, n) : callback) - 1;
+    }
+    start() {
+        if (this.timer === null) {
+            this.timer = setInterval(() => this.callbacks.forEach((cb) => {
+                if (cb)
+                    cb();
+            }), 30);
+        }
+    }
+    stop() {
+        if (this.timer !== null) {
+            clearInterval(this.timer);
+            this.timer = null;
+        }
+    }
+}
+exports.default = Ticker;

package/cjs/common/interaction.d.ts

@@ -0,0 +1,24 @@
+import Message from './messages.gen.js';
+export interface Options {
+    connAttemptCount?: number;
+    connAttemptGap?: number;
+}
+type Start = {
+    type: 'start';
+    ingestPoint: string;
+    pageNo: number;
+    timestamp: number;
+    url: string;
+} & Options;
+type Auth = {
+    type: 'auth';
+    token: string;
+    beaconSizeLimit?: number;
+};
+export type ToWorkerData = null | 'stop' | Start | Auth | Array<Message>;
+type Failure = {
+    type: 'failure';
+    reason: string;
+};
+export type FromWorkerData = 'restart' | Failure | 'not_init';
+export {};

package/cjs/common/interaction.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });