@openreplay/tracker 9.0.11-beta.0 → 9.0.11-beta.14

package/CHANGELOG.md

@@ -1,6 +1,6 @@
 # 9.0.11
 
-- fix window.open issue with sessionStorage being inherited (replicating tabId bug)
+- new `resetTabOnWindowOpen` option to fix window.open issue with sessionStorage being inherited (replicating tabId bug), users still should use 'noopener=true' in window.open to prevent it in general... 
 
 # 9.0.10
 

package/cjs/app/index.d.ts

@@ -83,6 +83,7 @@ export default class App {
     private compressionThreshold;
     private restartAttempts;
     private readonly bc;
+    private readonly contextId;
     attributeSender: AttributeSender;
     constructor(projectKey: string, sessionToken: string | undefined, options: Partial<Options>);
     private _debug;

package/cjs/app/index.js

@@ -33,21 +33,22 @@ function getTimezone() {
 }
 class App {
     constructor(projectKey, sessionToken, options) {
-        // if (options.onStart !== undefined) {
-        //   deprecationWarn("'onStart' option", "tracker.start().then(/* handle session info */)")
-        // } ?? maybe onStart is good
         var _a, _b;
         this.messages = [];
         this.startCallbacks = [];
         this.stopCallbacks = [];
         this.commitCallbacks = [];
         this.activityState = ActivityState.NotActive;
-        this.version = '9.0.11-beta.0'; // TODO: version compatability check inside each plugin.
+        this.version = '9.0.11-beta.14'; // TODO: version compatability check inside each plugin.
         this.compressionThreshold = 24 * 1000;
         this.restartAttempts = 0;
         this.bc = null;
         this._usingOldFetchPlugin = false;
         this.delay = 0;
+        // if (options.onStart !== undefined) {
+        //   deprecationWarn("'onStart' option", "tracker.start().then(/* handle session info */)")
+        // } ?? maybe onStart is good
+        this.contextId = Math.random().toString(36).slice(2);
         this.projectKey = projectKey;
         this.networkOptions = options.network;
         this.options = Object.assign({
@@ -69,7 +70,7 @@ class App {
             forceSingleTab: false,
         }, options);
         if (!this.options.forceSingleTab && globalThis && 'BroadcastChannel' in globalThis) {
-            this.bc = new BroadcastChannel('rick');
+            this.bc = (0, utils_js_1.inIframe)() ? null : new BroadcastChannel('rick');
         }
         this.revID = this.options.revID;
         this.localStorage = (_a = this.options.localStorage) !== null && _a !== void 0 ? _a : window.localStorage;
@@ -152,24 +153,43 @@ class App {
             this._debug('worker_start', e);
         }
         const thisTab = this.session.getTabId();
-        if (!this.session.getSessionToken() && this.bc) {
-            this.bc.postMessage({ line: 'never-gonna-give-you-up', source: thisTab });
-        }
+        const proto = {
+            // ask if there are any tabs alive
+            ask: 'never-gonna-give-you-up',
+            // yes, there are someone out there
+            resp: 'never-gonna-let-you-down',
+            // you stole someone's identity
+            reg: 'never-gonna-run-around-and-desert-you',
+        };
         if (this.bc) {
+            this.bc.postMessage({
+                line: proto.ask,
+                source: thisTab,
+                context: this.contextId,
+            });
+        }
+        if (this.bc !== null) {
             this.bc.onmessage = (ev) => {
-                if (ev.data.source === thisTab)
+                if (ev.data.context === this.contextId) {
                     return;
-                if (ev.data.line === 'never-gonna-let-you-down') {
+                }
+                if (ev.data.line === proto.resp) {
+                    const sessionToken = ev.data.token;
+                    this.session.setSessionToken(sessionToken);
+                }
+                if (ev.data.line === proto.reg) {
                     const sessionToken = ev.data.token;
+                    this.session.regenerateTabId();
                     this.session.setSessionToken(sessionToken);
                 }
-                if (ev.data.line === 'never-gonna-give-you-up') {
+                if (ev.data.line === proto.ask) {
                     const token = this.session.getSessionToken();
                     if (token && this.bc) {
                         this.bc.postMessage({
-                            line: 'never-gonna-let-you-down',
+                            line: ev.data.source === thisTab ? proto.reg : proto.resp,
                             token,
                             source: thisTab,
+                            context: this.contextId,
                         });
                     }
                 }
@@ -498,7 +518,7 @@ class App {
             return new Promise((resolve) => {
                 setTimeout(() => {
                     resolve(this._start(...args));
-                }, 10);
+                }, 25);
             });
         }
         else {
@@ -508,7 +528,7 @@ class App {
                         document.removeEventListener('visibilitychange', onVisibilityChange);
                         setTimeout(() => {
                             resolve(this._start(...args));
-                        }, 10);
+                        }, 25);
                     }
                 };
                 document.addEventListener('visibilitychange', onVisibilityChange);

package/cjs/app/session.d.ts

@@ -45,6 +45,7 @@ export default class Session {
     applySessionHash(hash: string): void;
     getSessionHash(): string | undefined;
     getTabId(): string;
+    regenerateTabId(): void;
     private createTabId;
     getInfo(): SessionInfo;
     reset(): void;

package/cjs/app/session.js

@@ -104,15 +104,18 @@ class Session {
             this.createTabId();
         return this.tabId;
     }
+    regenerateTabId() {
+        const randomId = (0, utils_js_1.generateRandomId)(12);
+        this.app.sessionStorage.setItem(this.options.session_tabid_key, randomId);
+        this.tabId = randomId;
+    }
     createTabId() {
         const localId = this.app.sessionStorage.getItem(this.options.session_tabid_key);
         if (localId) {
             this.tabId = localId;
         }
         else {
-            const randomId = (0, utils_js_1.generateRandomId)(12);
-            this.app.sessionStorage.setItem(this.options.session_tabid_key, randomId);
-            this.tabId = randomId;
+            this.regenerateTabId();
         }
     }
     getInfo() {

package/cjs/index.d.ts

@@ -20,6 +20,7 @@ export type Options = Partial<AppOptions & ConsoleOptions & ExceptionOptions & I
     sessionToken?: string;
     respectDoNotTrack?: boolean;
     autoResetOnWindowOpen?: boolean;
+    resetTabOnWindowOpen?: boolean;
     network?: Partial<NetworkOptions>;
     mouse?: Partial<MouseHandlerOptions>;
     flags?: {

package/cjs/index.js

@@ -131,34 +131,28 @@ class API {
                 void this.featureFlags.reloadFlags();
             });
             const wOpen = window.open;
-            if (options.autoResetOnWindowOpen) {
+            if (options.autoResetOnWindowOpen || options.resetTabOnWindowOpen) {
                 app.attachStartCallback(() => {
+                    var _a;
+                    const tabId = app.getTabId();
+                    const sessStorage = (_a = app.sessionStorage) !== null && _a !== void 0 ? _a : window.sessionStorage;
                     // @ts-ignore ?
                     window.open = function (...args) {
-                        app.resetNextPageSession(true);
+                        if (options.autoResetOnWindowOpen) {
+                            app.resetNextPageSession(true);
+                        }
+                        if (options.resetTabOnWindowOpen) {
+                            sessStorage.removeItem(options.session_tabid_key || '__openreplay_tabid');
+                        }
                         wOpen.call(window, ...args);
                         app.resetNextPageSession(false);
+                        sessStorage.setItem(options.session_tabid_key || '__openreplay_tabid', tabId);
                     };
                 });
                 app.attachStopCallback(() => {
                     window.open = wOpen;
                 });
             }
-            else {
-                app.attachStartCallback(() => {
-                    // this function causes new tab to inherit sessionStorage completely,
-                    // we don't really want that so we remove tabId for a short period
-                    // @ts-ignore
-                    window.open = function (...args) {
-                        var _a;
-                        const tabId = app.getTabId();
-                        const sessStorage = (_a = app.sessionStorage) !== null && _a !== void 0 ? _a : window.sessionStorage;
-                        sessStorage.removeItem(options.session_tabid_key || '__openreplay_tabid');
-                        wOpen.call(window, ...args);
-                        sessStorage.setItem(options.session_tabid_key || '__openreplay_tabid', tabId);
-                    };
-                });
-            }
         }
         else {
             console.log("OpenReplay: browser doesn't support API required for tracking or doNotTrack is set to 1.");
@@ -168,7 +162,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: '9.0.11-beta.0',
+                trackerVersion: '9.0.11-beta.14',
                 projectKey: options.projectKey,
                 doNotTrack,
                 // TODO: add precise reason (an exact API missing)

package/cjs/utils.d.ts

@@ -16,3 +16,4 @@ 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;

package/cjs/utils.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-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.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);
@@ -93,3 +93,12 @@ function generateRandomId(len) {
     return Array.from(arr, dec2hex).join('');
 }
 exports.generateRandomId = generateRandomId;
+function inIframe() {
+    try {
+        return window.self !== window.top;
+    }
+    catch (e) {
+        return true;
+    }
+}
+exports.inIframe = inIframe;

package/lib/app/index.d.ts

@@ -83,6 +83,7 @@ export default class App {
     private compressionThreshold;
     private restartAttempts;
     private readonly bc;
+    private readonly contextId;
     attributeSender: AttributeSender;
     constructor(projectKey: string, sessionToken: string | undefined, options: Partial<Options>);
     private _debug;

package/lib/app/index.js

@@ -1,5 +1,5 @@
 import { Timestamp, Metadata, UserID, TabChange, TabData } from './messages.gen.js';
-import { now, adjustTimeOrigin, deprecationWarn } from '../utils.js';
+import { now, adjustTimeOrigin, deprecationWarn, inIframe } from '../utils.js';
 import Nodes from './nodes.js';
 import Observer from './observer/top_observer.js';
 import Sanitizer from './sanitizer.js';
@@ -30,21 +30,22 @@ function getTimezone() {
 }
 export default class App {
     constructor(projectKey, sessionToken, options) {
-        // if (options.onStart !== undefined) {
-        //   deprecationWarn("'onStart' option", "tracker.start().then(/* handle session info */)")
-        // } ?? maybe onStart is good
         var _a, _b;
         this.messages = [];
         this.startCallbacks = [];
         this.stopCallbacks = [];
         this.commitCallbacks = [];
         this.activityState = ActivityState.NotActive;
-        this.version = '9.0.11-beta.0'; // TODO: version compatability check inside each plugin.
+        this.version = '9.0.11-beta.14'; // TODO: version compatability check inside each plugin.
         this.compressionThreshold = 24 * 1000;
         this.restartAttempts = 0;
         this.bc = null;
         this._usingOldFetchPlugin = false;
         this.delay = 0;
+        // if (options.onStart !== undefined) {
+        //   deprecationWarn("'onStart' option", "tracker.start().then(/* handle session info */)")
+        // } ?? maybe onStart is good
+        this.contextId = Math.random().toString(36).slice(2);
         this.projectKey = projectKey;
         this.networkOptions = options.network;
         this.options = Object.assign({
@@ -66,7 +67,7 @@ export default class App {
             forceSingleTab: false,
         }, options);
         if (!this.options.forceSingleTab && globalThis && 'BroadcastChannel' in globalThis) {
-            this.bc = new BroadcastChannel('rick');
+            this.bc = inIframe() ? null : new BroadcastChannel('rick');
         }
         this.revID = this.options.revID;
         this.localStorage = (_a = this.options.localStorage) !== null && _a !== void 0 ? _a : window.localStorage;
@@ -149,24 +150,43 @@ export default class App {
             this._debug('worker_start', e);
         }
         const thisTab = this.session.getTabId();
-        if (!this.session.getSessionToken() && this.bc) {
-            this.bc.postMessage({ line: 'never-gonna-give-you-up', source: thisTab });
-        }
+        const proto = {
+            // ask if there are any tabs alive
+            ask: 'never-gonna-give-you-up',
+            // yes, there are someone out there
+            resp: 'never-gonna-let-you-down',
+            // you stole someone's identity
+            reg: 'never-gonna-run-around-and-desert-you',
+        };
         if (this.bc) {
+            this.bc.postMessage({
+                line: proto.ask,
+                source: thisTab,
+                context: this.contextId,
+            });
+        }
+        if (this.bc !== null) {
             this.bc.onmessage = (ev) => {
-                if (ev.data.source === thisTab)
+                if (ev.data.context === this.contextId) {
                     return;
-                if (ev.data.line === 'never-gonna-let-you-down') {
+                }
+                if (ev.data.line === proto.resp) {
+                    const sessionToken = ev.data.token;
+                    this.session.setSessionToken(sessionToken);
+                }
+                if (ev.data.line === proto.reg) {
                     const sessionToken = ev.data.token;
+                    this.session.regenerateTabId();
                     this.session.setSessionToken(sessionToken);
                 }
-                if (ev.data.line === 'never-gonna-give-you-up') {
+                if (ev.data.line === proto.ask) {
                     const token = this.session.getSessionToken();
                     if (token && this.bc) {
                         this.bc.postMessage({
-                            line: 'never-gonna-let-you-down',
+                            line: ev.data.source === thisTab ? proto.reg : proto.resp,
                             token,
                             source: thisTab,
+                            context: this.contextId,
                         });
                     }
                 }
@@ -495,7 +515,7 @@ export default class App {
             return new Promise((resolve) => {
                 setTimeout(() => {
                     resolve(this._start(...args));
-                }, 10);
+                }, 25);
             });
         }
         else {
@@ -505,7 +525,7 @@ export default class App {
                         document.removeEventListener('visibilitychange', onVisibilityChange);
                         setTimeout(() => {
                             resolve(this._start(...args));
-                        }, 10);
+                        }, 25);
                     }
                 };
                 document.addEventListener('visibilitychange', onVisibilityChange);

package/lib/app/session.d.ts

@@ -45,6 +45,7 @@ export default class Session {
     applySessionHash(hash: string): void;
     getSessionHash(): string | undefined;
     getTabId(): string;
+    regenerateTabId(): void;
     private createTabId;
     getInfo(): SessionInfo;
     reset(): void;

package/lib/app/session.js

@@ -102,15 +102,18 @@ export default class Session {
             this.createTabId();
         return this.tabId;
     }
+    regenerateTabId() {
+        const randomId = generateRandomId(12);
+        this.app.sessionStorage.setItem(this.options.session_tabid_key, randomId);
+        this.tabId = randomId;
+    }
     createTabId() {
         const localId = this.app.sessionStorage.getItem(this.options.session_tabid_key);
         if (localId) {
             this.tabId = localId;
         }
         else {
-            const randomId = generateRandomId(12);
-            this.app.sessionStorage.setItem(this.options.session_tabid_key, randomId);
-            this.tabId = randomId;
+            this.regenerateTabId();
         }
     }
     getInfo() {

package/lib/index.d.ts

@@ -20,6 +20,7 @@ export type Options = Partial<AppOptions & ConsoleOptions & ExceptionOptions & I
     sessionToken?: string;
     respectDoNotTrack?: boolean;
     autoResetOnWindowOpen?: boolean;
+    resetTabOnWindowOpen?: boolean;
     network?: Partial<NetworkOptions>;
     mouse?: Partial<MouseHandlerOptions>;
     flags?: {

package/lib/index.js

@@ -126,34 +126,28 @@ export default class API {
                 void this.featureFlags.reloadFlags();
             });
             const wOpen = window.open;
-            if (options.autoResetOnWindowOpen) {
+            if (options.autoResetOnWindowOpen || options.resetTabOnWindowOpen) {
                 app.attachStartCallback(() => {
+                    var _a;
+                    const tabId = app.getTabId();
+                    const sessStorage = (_a = app.sessionStorage) !== null && _a !== void 0 ? _a : window.sessionStorage;
                     // @ts-ignore ?
                     window.open = function (...args) {
-                        app.resetNextPageSession(true);
+                        if (options.autoResetOnWindowOpen) {
+                            app.resetNextPageSession(true);
+                        }
+                        if (options.resetTabOnWindowOpen) {
+                            sessStorage.removeItem(options.session_tabid_key || '__openreplay_tabid');
+                        }
                         wOpen.call(window, ...args);
                         app.resetNextPageSession(false);
+                        sessStorage.setItem(options.session_tabid_key || '__openreplay_tabid', tabId);
                     };
                 });
                 app.attachStopCallback(() => {
                     window.open = wOpen;
                 });
             }
-            else {
-                app.attachStartCallback(() => {
-                    // this function causes new tab to inherit sessionStorage completely,
-                    // we don't really want that so we remove tabId for a short period
-                    // @ts-ignore
-                    window.open = function (...args) {
-                        var _a;
-                        const tabId = app.getTabId();
-                        const sessStorage = (_a = app.sessionStorage) !== null && _a !== void 0 ? _a : window.sessionStorage;
-                        sessStorage.removeItem(options.session_tabid_key || '__openreplay_tabid');
-                        wOpen.call(window, ...args);
-                        sessStorage.setItem(options.session_tabid_key || '__openreplay_tabid', tabId);
-                    };
-                });
-            }
         }
         else {
             console.log("OpenReplay: browser doesn't support API required for tracking or doNotTrack is set to 1.");
@@ -163,7 +157,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: '9.0.11-beta.0',
+                trackerVersion: '9.0.11-beta.14',
                 projectKey: options.projectKey,
                 doNotTrack,
                 // TODO: add precise reason (an exact API missing)

package/lib/utils.d.ts

@@ -16,3 +16,4 @@ 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;

package/lib/utils.js

@@ -81,3 +81,11 @@ export function generateRandomId(len) {
     safeCrypto.getRandomValues(arr);
     return Array.from(arr, dec2hex).join('');
 }
+export function inIframe() {
+    try {
+        return window.self !== window.top;
+    }
+    catch (e) {
+        return true;
+    }
+}

package/package.json

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