@mparticle/web-sdk 3.8.1 → 3.10.0

package/src/roktManager.ts

@@ -21,6 +21,8 @@ import { ErrorCodes, IErrorReportingService, ILoggingService, WSDKErrorSeverity
 import { IRoktLauncherOptions, normalizeRoktLauncherOptions } from "./roktLauncherOptions";
 import { PARTNER_MODULE_IDS } from "./cookieSyncManager";
 import IntegrationCapture from "./integrationCapture";
+import Constants from "./constants";
+import { subscribeToRouteChange } from "./routeChangeMonitor";
 
 const PASSBACK_CONVERSION_TRACKING_ID = 'passbackconversiontrackingid';
 
@@ -86,6 +88,9 @@ export interface IRoktKit {
     // Optional because the Rokt Kit ships on its own release cadence; a kit
     // published before terminate() existed will not implement it.
     terminate?: () => Promise<void>;
+    // Set by the kit only when it wants route changes; nothing subscribes otherwise. The
+    // manager also calls it once on attach.
+    onRouteChange?: () => void;
     launcherOptions?: Dictionary<any>;
     settings?: IRoktKitSettings;
     integrationName?: string;
@@ -130,6 +135,11 @@ export default class RoktManager {
     private onReadyCallback: (() => void) | null = null;
     private initialized: boolean = false;
     private isShoppableAdsLoaded: boolean = false;
+    private stopRouteChangeWatch: (() => void) | null = null;
+
+    // Keys this manager's route subscription, so a re-executed bundle's manager replaces
+    // it while a second named instance keeps its own.
+    constructor(private readonly instanceName?: string) {}
 
     /**
      * Sets a callback to be invoked when RoktManager becomes ready
@@ -219,6 +229,8 @@ export default class RoktManager {
     public attachKit(kit: IRoktKit): void {
         this.kit = kit;
 
+        this.watchRouteChanges();
+
         if (kit.settings?.accountId) {
             this.store.setRoktAccountId(kit.settings.accountId);
         }
@@ -236,6 +248,50 @@ export default class RoktManager {
         }
     }
 
+    // Core already emits a page view per navigation when AutoLogPageView is on, so the kit
+    // subscribes to route changes only when it is off. The call on attach happens either
+    // way: the auto page view fires once per page load, so a re-init emits none.
+    private watchRouteChanges(): void {
+        if (!isFunction(this.kit?.onRouteChange)) {
+            this.stopRouteChangeWatch?.();
+            this.stopRouteChangeWatch = null;
+            return;
+        }
+
+        if (this.isAutoLogPageViewEnabled()) {
+            this.stopRouteChangeWatch?.();
+            this.stopRouteChangeWatch = null;
+        } else if (!this.stopRouteChangeWatch) {
+            this.stopRouteChangeWatch = subscribeToRouteChange(
+                `rokt:${this.instanceName}`,
+                () => this.notifyRouteChange()
+            );
+        }
+
+        // A full navigation or a re-init lands on the trigger route without a route change
+        // of its own.
+        this.notifyRouteChange();
+    }
+
+    // Reads `this.kit` at call time, so a kit attached by a later init() takes over.
+    private notifyRouteChange(): void {
+        try {
+            this.kit?.onRouteChange?.();
+        } catch (e) {
+            this.logger?.error(
+                `RoktManager: Error in onRouteChange: ${getErrorMessage(e)}`
+            );
+        }
+    }
+
+    private isAutoLogPageViewEnabled(): boolean {
+        return (
+            this.store?.SDKConfig?.flags?.[
+                Constants.FeatureFlags.AutoLogPageView
+            ] === true
+        );
+    }
+
     /**
      * Renders ads based on the options provided
      * 

package/src/routeChangeMonitor.ts

@@ -0,0 +1,207 @@
+import { Dictionary } from './utils';
+
+type HistoryStateMethod = History['pushState'];
+type HistoryMethodName = 'pushState' | 'replaceState';
+export type RouteChangeSource = HistoryMethodName | 'popstate';
+export type RouteChangeListener = (source: RouteChangeSource) => void;
+
+const HISTORY_METHODS: HistoryMethodName[] = ['pushState', 'replaceState'];
+
+const WRAPPED_MARKER = '__mpApvWrapped__';
+
+type MarkedHistoryMethod = HistoryStateMethod & {
+    [WRAPPED_MARKER]?: boolean;
+};
+
+export const supportsHistoryTracking = (win: Window | null): boolean =>
+    !!win &&
+    win.history !== undefined &&
+    typeof win.history.pushState === 'function' &&
+    typeof win.addEventListener === 'function';
+
+// Wraps pushState/replaceState so `onNavigate` runs after the real method, and
+// returns the single function that undoes it — or null when nothing was
+// installed (history is already wrapped, or a frozen/sealed History rejected the
+// assignment). Handing back one undo closure keeps the wrapper and original
+// references out of the tracker entirely: there is no half-patched state for a
+// caller to inspect, and no way to restore the wrong pair.
+export const patchHistory = (
+    onNavigate: RouteChangeListener,
+    log: (message: string) => void
+): (() => void) | null => {
+    if ((window.history.pushState as MarkedHistoryMethod)[WRAPPED_MARKER]) {
+        log(
+            '[patch] history already wrapped, skipping to avoid double-wrap — STACKED WRAPPER DETECTED'
+        );
+        return null;
+    }
+
+    const originals = {} as Record<HistoryMethodName, HistoryStateMethod>;
+    const wrappers = {} as Record<HistoryMethodName, HistoryStateMethod>;
+
+    HISTORY_METHODS.forEach(name => {
+        const original = window.history[name];
+        originals[name] = original;
+
+        const wrapper = function(
+            this: History,
+            ...args: Parameters<HistoryStateMethod>
+        ): void {
+            const result = original.apply(this, args);
+            onNavigate(name);
+            return result;
+        };
+
+        Object.defineProperty(wrapper, WRAPPED_MARKER, {
+            value: true,
+            enumerable: false,
+        });
+
+        wrappers[name] = wrapper;
+    });
+
+    // Restore per method: a third party may have patched one of the two on top of
+    // ours after we installed. Clobbering theirs would break their tracking, so
+    // leave anything that is no longer ours in place.
+    const restore = (): void =>
+        HISTORY_METHODS.forEach(name => {
+            if (window.history[name] === wrappers[name]) {
+                window.history[name] = originals[name];
+                log(`[teardown] restored original ${name}`);
+            } else {
+                log(
+                    `[teardown] ${name} no longer ours; leaving in place, gating callback to no-op`
+                );
+            }
+        });
+
+    try {
+        HISTORY_METHODS.forEach(name => {
+            window.history[name] = wrappers[name];
+        });
+    } catch (e) {
+        log(
+            `[error] failed to patch history methods (frozen/sealed), rolling back: ${e}`
+        );
+        try {
+            restore();
+        } catch (restoreError) {
+            log(
+                `[error] failed to restore history methods after patch failure: ${restoreError}`
+            );
+        }
+        return null;
+    }
+
+    return restore;
+};
+
+// One History patch for the whole SDK, so page-view tracking and preselection do not
+// stack two wrappers.
+//
+// State lives on `window`, not module scope, because Next.js re-executes the bundle per
+// SPA navigation while the patch from the previous execution stays installed.
+export const WIN_ROUTE_MONITOR_KEY = '__mpRouteMonitor__';
+
+// Keyed by owner, so a later bundle execution's subscriber replaces its predecessor
+// rather than joining it.
+interface IRouteMonitorState {
+    listeners: Dictionary<RouteChangeListener>;
+    undoHistoryPatch: (() => void) | null;
+    popStateListener: (() => void) | null;
+}
+
+type WindowWithRouteMonitor = Window & {
+    [WIN_ROUTE_MONITOR_KEY]?: IRouteMonitorState;
+};
+
+const monitorState = (): IRouteMonitorState => {
+    const win = window as WindowWithRouteMonitor;
+
+    if (!win[WIN_ROUTE_MONITOR_KEY]) {
+        win[WIN_ROUTE_MONITOR_KEY] = {
+            listeners: {},
+            undoHistoryPatch: null,
+            popStateListener: null,
+        };
+    }
+
+    return win[WIN_ROUTE_MONITOR_KEY] as IRouteMonitorState;
+};
+
+// Reads the shared state at call time, so a wrapper installed by a previous bundle
+// execution still reaches the current listeners.
+const emit = (source: RouteChangeSource): void => {
+    Object.values(monitorState().listeners).forEach(listener => {
+        try {
+            listener(source);
+        } catch (e) {
+            // One subscriber must not stop the others, and must never break navigation.
+        }
+    });
+};
+
+const install = (
+    state: IRouteMonitorState,
+    log: (message: string) => void
+): void => {
+    if (state.undoHistoryPatch || state.popStateListener) {
+        return;
+    }
+
+    state.undoHistoryPatch = patchHistory(emit, log);
+    state.popStateListener = (): void => emit('popstate');
+    window.addEventListener('popstate', state.popStateListener);
+};
+
+const uninstall = (state: IRouteMonitorState): void => {
+    if (state.popStateListener) {
+        window.removeEventListener('popstate', state.popStateListener);
+        state.popStateListener = null;
+    }
+
+    if (state.undoHistoryPatch) {
+        state.undoHistoryPatch();
+        state.undoHistoryPatch = null;
+    }
+};
+
+// Installs on the first subscriber and tears down after the last leaves, so a workspace
+// that needs neither is never patched. Unsubscribing only removes the listener while it
+// still owns its key, so an outgoing instance cannot remove its replacement.
+export const subscribeToRouteChange = (
+    key: string,
+    listener: RouteChangeListener,
+    log: (message: string) => void = () => undefined
+): (() => void) => {
+    if (!supportsHistoryTracking(typeof window === 'undefined' ? null : window)) {
+        return () => undefined;
+    }
+
+    const state = monitorState();
+
+    state.listeners[key] = listener;
+    install(state, log);
+
+    return (): void => {
+        if (state.listeners[key] !== listener) {
+            return;
+        }
+
+        delete state.listeners[key];
+        if (Object.keys(state.listeners).length === 0) {
+            uninstall(state);
+        }
+    };
+};
+
+export const resetRouteChangeMonitor = (): void => {
+    if (typeof window === 'undefined') {
+        return;
+    }
+
+    const state = monitorState();
+    state.listeners = {};
+    uninstall(state);
+    delete (window as WindowWithRouteMonitor)[WIN_ROUTE_MONITOR_KEY];
+};