@schibsted/pulse-sdk 8.0.0-rc.2 → 8.0.0-rc.21

package/dist/ejs/leaveTrackingTpaas/index.js

@@ -1,6 +1,6 @@
-import { isBrowser, isFunction, throttle } from '@schibsted/pulse-utils';
 import * as logger from 'loglevel';
-import { DEFAULT_ACTIVITY_DURATION, DEFAULT_PAGE_LEAVE_EVENT } from './constants';
+import { isBrowser, isFunction, throttle } from '../utils';
+import { ACTIVITY_DURATION_LIMIT_MS, DEFAULT_PAGE_LEAVE_EVENT } from './constants';
 import { BrowserEvents } from './types';
 let currentLeaveSchema;
 let currentTrackMethod;
@@ -9,19 +9,44 @@ let updateViewedContentListeners = [];
 let activityListeners = [];
 let resizeObserver = null;
 let throttledUpdateFn = throttle(() => undefined, 0);
-let startTime = 0;
-let activityDuration = DEFAULT_ACTIVITY_DURATION();
+let durationStartTime = 0;
+let previousActivityTime = 0;
+let activityDurationMs = 0;
 let currentLeaveEvent = DEFAULT_PAGE_LEAVE_EVENT();
 let additionalHeightBuilder;
+/**
+ * Resolves a DOM element from either a CSS selector string or an Element instance.
+ */
+function resolveDomElement(element) {
+    try {
+        return typeof element === 'string' ? document.querySelector(element) : element || null;
+    }
+    catch (e) {
+        logger.error('Error while resolving DOM element', e);
+        return null;
+    }
+}
 /*
  Add leave tracking
  */
 export function addTpaasLeaveTracking({ objectElement, pageElement, schema, objectResizable, heightBuilder, trackMethod, }) {
     function _addLeaveTracking() {
+        const objectDomElement = resolveDomElement(objectElement);
+        if (objectDomElement == null) {
+            logger.error('Could not find object element for leave tracking');
+            return;
+        }
+        let pageDomElement = resolveDomElement(pageElement);
+        if (pageDomElement == null) {
+            logger.warn('Could not find page element for leave tracking, defaulting to document.body');
+            pageDomElement = document.body;
+        }
         additionalHeightBuilder = heightBuilder;
         addTpaasLeaveListeners();
-        addUpdateEventListeners(objectElement, pageElement || document.body, objectResizable);
-        startTime = resetTime();
+        addUpdateEventListeners(objectDomElement, pageDomElement, objectResizable);
+        previousActivityTime = resetTime();
+        durationStartTime = resetTime();
+        activityDurationMs = 0;
         currentLeaveSchema = schema;
         currentTrackMethod = trackMethod;
         logger.debug('addLeaveTracking:after:state', currentLeaveEvent);
@@ -113,12 +138,9 @@ function removeUpdateEventListeners() {
  */
 const resetEventDefaults = () => {
     currentLeaveEvent = DEFAULT_PAGE_LEAVE_EVENT();
-    startTime = resetTime();
-    activityDuration = resetActivityDuration();
-};
-const resetActivityDuration = () => {
-    clearInterval(activityDuration.interval);
-    return DEFAULT_ACTIVITY_DURATION();
+    durationStartTime = resetTime();
+    previousActivityTime = resetTime();
+    activityDurationMs = 0;
 };
 export const resetTpaasViewedContent = () => {
     currentLeaveEvent = DEFAULT_PAGE_LEAVE_EVENT();
@@ -126,34 +148,43 @@ export const resetTpaasViewedContent = () => {
 const resetTime = () => Date.now();
 /*
  Send a Leave event only if Page Leave tracking is active in the SDK
- The event that is ultimately sent is a merge between the default event
- saved in this file and the event supplied by the brand, with preference going
- to the brand event. After the event has been sent, leave page tracking is removed
+ The event that is ultimately sent is the View event saved in the currentTrackMethod callback.
+ After the event has been sent, leave page tracking is removed
  and must be explicitly re-added if needed.
 */
-export function trackTpaasActiveLeave() {
+export async function trackTpaasActiveLeave() {
     if (leaveTpaasTrackingIsActive()) {
-        trackTpaasLeave();
+        await trackTpaasLeave();
     }
 }
 /*
  Send a Leave event regardless of whether Page Leave tracking is active in the SDK
- The event that is ultimately sent is a merge between the default event
- saved in this file and the event supplied by the brand, with preference going
- to the brand event. After the event has been sent, leave page tracking is removed
+ The event that is ultimately sent is the View event saved in the currentTrackMethod callback.
+ After the event has been sent, leave page tracking is removed
  and must be explicitly re-added if needed.
  */
-export function trackTpaasLeave() {
+export async function trackTpaasLeave() {
     const leave = getTpaasLeaveObject();
-    currentTrackMethod(leave);
+    // Capture currentTrackMethod and remove tracking synchronously before awaiting.
+    // If removal happened after the await, a new trackView* call arriving during the async
+    // gap would see tracking still active with the same schema and silently discard its
+    // new callback (e.g. a fresh leaveAudioBuilder), causing the next leave event to
+    // never fire or to use the wrong builder.
+    const trackMethod = currentTrackMethod;
     removeTpaasLeaveTracking();
+    await trackMethod(leave);
 }
 export function getTpaasLeaveObject() {
     const endTime = Date.now();
-    const duration = endTime - startTime;
+    // TPaaS leave event requires duration/activity to be at least 1ms, otherwise the event is rejected
+    // also, in practice, it's almost impossible to have an activity or duration of 0ms
+    // We don't call increaseActivityDuration here because it's possible to call getTpaasLeaveObject multiple times
+    // without any activity events in between, which would incorrectly increase the activity duration.
+    const durationMs = Math.max(endTime - durationStartTime, 1);
+    const lastActivityDuration = calculateActivityGap(endTime);
     const leave = {
-        durationMs: duration,
-        activityDurationMs: activityDuration.value,
+        durationMs,
+        activityDurationMs: Math.max(activityDurationMs + lastActivityDuration, 1),
         ...currentLeaveEvent,
     };
     logger.debug('trackTpaasLeave: event', leave);
@@ -226,18 +257,10 @@ export const calculateScrollPosition = (element) => Math.abs(Math.min(element.ge
  'mousedown', 'mousemove', 'keydown', 'scroll' and/or 'touchstart' browser events.
  */
 function addUpdateActivityDurationListeners() {
-    if (activityDuration.interval !== undefined) {
-        // If the interval is already set, do not set it again
+    // if there are already listeners for activity, do not add more
+    if (activityListeners.length > 0) {
         return;
     }
-    const interval = 1000;
-    const activityTimeout = 30 * 1000;
-    activityDuration.interval = window.setInterval(() => {
-        activityDuration.timeSinceLastActivity += interval;
-        if (activityDuration.timeSinceLastActivity < activityTimeout) {
-            activityDuration.value += interval;
-        }
-    }, interval);
     const activityEvents = [
         BrowserEvents.SCROLL,
         BrowserEvents.MOUSEDOWN,
@@ -246,14 +269,15 @@ function addUpdateActivityDurationListeners() {
         BrowserEvents.TOUCHSTART,
     ];
     activityListeners = addEventListeners(activityEvents, () => {
-        activityDuration = resetLastActivity(activityDuration);
+        increaseActivityDuration(Date.now());
     }, { passive: true });
 }
-function resetLastActivity(activityDuration) {
-    return {
-        ...activityDuration,
-        timeSinceLastActivity: 0,
-    };
+function calculateActivityGap(activityEndTime) {
+    return Math.min(activityEndTime - previousActivityTime, ACTIVITY_DURATION_LIMIT_MS);
+}
+function increaseActivityDuration(activityEndTime) {
+    activityDurationMs += calculateActivityGap(activityEndTime);
+    previousActivityTime = resetTime();
 }
 /*
  Add listeners to a set of browser events.

package/dist/ejs/network-browser.js

@@ -1,4 +1,4 @@
-import { isBrowser } from '@schibsted/pulse-utils';
+import { isBrowser } from './utils';
 const supportsBeacon = () => isBrowser && Boolean(window.navigator.sendBeacon);
 export default function send(url, data, sdkConfig) {
     // if there is as large number of events, only send 10 in each request

package/dist/ejs/remoteConfig/index.js

@@ -1,5 +1,5 @@
-import { isString, webApi } from '@schibsted/pulse-utils';
 import logger from 'loglevel';
+import { isString, webApi } from '../utils';
 const CIS_KEY = 'cis';
 const COLLECTOR_KEY = 'collector';
 const getRemoteConfigStorageKey = '_pulse.internal.remote.config';

package/dist/ejs/session/store.js

@@ -0,0 +1,90 @@
+import { v4 as uuid } from 'uuid';
+import { cookieConfig, getRootDomain, readCookie, SESSION_SDRN_PREFIX, webApi, writeCookie } from '../utils';
+const { USE_LOCALSTORAGE } = cookieConfig;
+const SESSION_STORAGE_KEY = '_pulsesession';
+const SESSION_MAX_INTERVAL_MS = 30 * 60 * 1000; // 30 minutes
+/**
+ * @private
+ */
+export const generateSessionSDRN = (sessionId) => `${SESSION_SDRN_PREFIX}${sessionId}`;
+// Return parsed json from cookie (or localStorage if enabled), or undefined.
+const readAndParse = () => {
+    try {
+        const storedSession = readCookie(SESSION_STORAGE_KEY);
+        if (storedSession) {
+            return JSON.parse(storedSession);
+        }
+    }
+    catch (_e) {
+        // If localStorage/cookie is not available, we treat it as if
+        // the value is undefined.
+        // If data is unparseable, we also ignore it.
+        return undefined;
+    }
+    return undefined;
+};
+/**
+ * Reads the stored session. Any invalid or unreadable data is ignored.
+ * @private
+ */
+export const readSession = () => {
+    const storedSession = readAndParse();
+    if (storedSession) {
+        const [sessionSdrn, startTimeMs, lastEventTimeMs] = storedSession;
+        const startTime = new Date(startTimeMs);
+        const lastEventTime = new Date(lastEventTimeMs);
+        if (sessionSdrn && !Number.isNaN(startTime.getTime()) && !Number.isNaN(lastEventTime.getTime())) {
+            return {
+                // the session is stored as an SDRN, for compatibility with legacy events and older SDK versions
+                sessionId: sessionSdrn.replace(SESSION_SDRN_PREFIX, ''),
+                startTime,
+                lastEventTime,
+            };
+        }
+    }
+    return undefined;
+};
+const writeSession = ({ sessionId, startTime, lastEventTime }) => {
+    try {
+        // SDK v8 (supporting TPaaS events) needs to be compatible with legacy events AND older SDK versions
+        // as a result, we can't store just the sessionId, we need the full SDRN in there
+        const sessionToStore = [
+            generateSessionSDRN(sessionId),
+            startTime.getTime(),
+            lastEventTime.getTime(),
+        ];
+        const halfHourInDays = 1.0 / (24 * 2);
+        writeCookie(SESSION_STORAGE_KEY, JSON.stringify(sessionToStore), getRootDomain(), halfHourInDays);
+        // Delete old localStorage-based session if needed
+        if (!USE_LOCALSTORAGE) {
+            // removeItem will do nothing to a non-existing item.
+            webApi.localStorage?.removeItem(SESSION_STORAGE_KEY);
+        }
+    }
+    catch (_e) {
+        // If we can't write the session, we just move on in life
+    }
+};
+const updateSession = (createdAt, session) => {
+    if (!session || session.lastEventTime.getTime() < createdAt.getTime() - SESSION_MAX_INTERVAL_MS) {
+        return { sessionId: uuid(), startTime: createdAt, lastEventTime: createdAt, isFirstEvent: true };
+    }
+    // Never move lastEventTime backwards, or the session would expire early.
+    // In case the order of events is not strictly chronological, this ensures the session remains valid.
+    const lastEventTime = createdAt.getTime() > session.lastEventTime.getTime() ? createdAt : session.lastEventTime;
+    return { ...session, lastEventTime, isFirstEvent: false };
+};
+/**
+ * Registers an event created at `createdAt` in the stored session: extends the current session,
+ * or starts a new one when it expired, and stores the result.
+ *
+ * Call it synchronously, together with capturing `createdAt`, before any asynchronous work,
+ * so sessions are updated in the order events are tracked.
+ *
+ * @private
+ */
+export const touchSession = (createdAt) => {
+    const session = updateSession(createdAt, readSession());
+    writeSession(session);
+    return session;
+};

package/dist/ejs/tpaas-builders/builders/catalogVersion.js

@@ -0,0 +1,6 @@
+import { CATALOG_VERSION } from '../../tpaas-schemas';
+export function builder() {
+    return {
+        catalogVersion: CATALOG_VERSION,
+    };
+}

package/{node_modules/@schibsted/tpaas-event-builder/dist/ejs → dist/ejs/tpaas-builders}/builders/device.js

@@ -1,16 +1,14 @@
-import { isBrowser } from '@schibsted/pulse-utils';
 import * as logger from 'loglevel';
 import { UAParser } from 'ua-parser-js';
-// Cache the UAParser result to avoid re-parsing on subsequent calls
-let cachedUAParser;
-function getUAParser() {
-    if (!cachedUAParser) {
-        cachedUAParser = UAParser();
+let cachedUserAgentResult;
+function getUserAgentResult(userAgent) {
+    if (cachedUserAgentResult?.ua !== userAgent) {
+        cachedUserAgentResult = UAParser(userAgent);
     }
-    return cachedUAParser;
+    return cachedUserAgentResult;
 }
-export const builder = (environmentId, jwe) => {
-    if (!isBrowser) {
+export const builder = (environmentId, jwe, browser) => {
+    if (browser.userAgent === undefined) {
         return {
             device: {
                 // TODO: server side rendering (or nodejs). do we need to set all the following fields?
@@ -25,7 +23,7 @@ export const builder = (environmentId, jwe) => {
             },
         };
     }
-    const uaParser = getUAParser();
+    const uaParser = getUserAgentResult(browser.userAgent);
     return {
         device: {
             clientType: getClientType(uaParser),
@@ -36,12 +34,42 @@ export const builder = (environmentId, jwe) => {
             mobileBrand: uaParser.device.vendor,
             mobileModel: uaParser.device.model,
             operatingSystem: getOperatingSystem(uaParser),
-            screenOrientation: getScreenOrientation(),
-            userAgent: window.navigator.userAgent,
-            viewportSize: getViewportSize(),
+            screenOrientation: getScreenOrientation(browser.screenOrientationType),
+            userAgent: browser.userAgent,
+            viewportSize: getViewportSize(browser.viewportWidth, browser.viewportHeight),
         },
     };
 };
+function getScreenOrientation(orientationType) {
+    if (orientationType === 'landscape-primary' || orientationType === 'landscape-secondary') {
+        return 'Landscape';
+    }
+    return 'Portrait';
+}
+function getSizeFromPixels(pixels) {
+    if (pixels < 360) {
+        return 'XS';
+    }
+    if (pixels < 480) {
+        return 'S';
+    }
+    if (pixels < 768) {
+        return 'M';
+    }
+    if (pixels < 1024) {
+        return 'L';
+    }
+    if (pixels >= 1024) {
+        return 'XL';
+    }
+    logger.error('Could not determine viewport size, defaulting to M');
+    return 'M';
+}
+function getViewportSize(viewportWidth, viewportHeight) {
+    const size = getSizeFromPixels(Math.min(viewportWidth, viewportHeight));
+    logger.debug(`Viewport size: ${viewportWidth}x${viewportHeight}, mapped to ${size}`);
+    return size;
+}
 function getClientType(uaParser) {
     const { browser } = uaParser;
     const browserName = browser.name?.toLocaleLowerCase() || '';
@@ -102,73 +130,23 @@ function getOperatingSystem(uaParser) {
     if (osName.includes('windows')) {
         return 'Windows';
     }
-    if (osName.includes('macos')) {
+    if (osName.includes('macos') || osName.includes('mac os')) {
         return 'Mac';
     }
-    // some flavors of Linux might not be captured by this
+    if (osName.includes('android')) {
+        return 'Android';
+    }
+    if (osName.includes('ios')) {
+        return 'iOS';
+    }
+    // some flavours of Linux might not be captured by this
     // do we need a better detection, based on a list?
     // for example (Gentoo - https://docs.uaparser.dev/info/os/name.html)
     if (osName.includes('linux')) {
         return 'Linux';
     }
-    // the TPaaS `device` template is missing Android, iOS, iPadOS and maybe others?
+    // the TPaaS `device` template is missing iPadOS and maybe others?
     logger.log(`Unknown operating system: ${osName}. Defaulting to 'other'.`);
     // default value
     return 'Other';
 }
-function getScreenOrientation() {
-    const orientationType = window.screen.orientation?.type;
-    const portraitOrientations = ['portrait-primary', 'portrait-secondary'];
-    const landscapeOrientations = ['landscape-primary', 'landscape-secondary'];
-    // the ifs might be a bit overkill, but it helps with separating the default value from the logic
-    if (portraitOrientations.includes(orientationType)) {
-        return 'Portrait';
-    }
-    if (landscapeOrientations.includes(orientationType)) {
-        return 'Landscape';
-    }
-    // default value
-    return 'Portrait';
-}
-function getSizeFromPixels(pixels) {
-    if (pixels < 360) {
-        return 'XS';
-    }
-    if (pixels < 480) {
-        return 'S';
-    }
-    if (pixels < 768) {
-        return 'M';
-    }
-    if (pixels < 1024) {
-        return 'L';
-    }
-    if (pixels >= 1024) {
-        return 'XL';
-    }
-    // default value
-    logger.error('Could not determine viewport size, defaulting to M');
-    return 'M';
-}
-function getViewportSize() {
-    let viewportWidth;
-    let viewportHeight;
-    const { document } = window;
-    if (typeof window.innerWidth !== 'undefined') {
-        viewportWidth = window.innerWidth;
-        viewportHeight = window.innerHeight;
-    }
-    else if (typeof document.documentElement.clientWidth !== 'undefined' &&
-        document.documentElement.clientWidth !== 0) {
-        viewportWidth = document.documentElement.clientWidth;
-        viewportHeight = document.documentElement.clientHeight;
-    }
-    else {
-        viewportWidth = document.getElementsByTagName('body')[0].clientWidth;
-        viewportHeight = document.getElementsByTagName('body')[0].clientHeight;
-    }
-    const shortestDimension = Math.min(viewportWidth, viewportHeight);
-    const size = getSizeFromPixels(shortestDimension);
-    logger.debug(`Viewport size: ${viewportWidth}x${viewportHeight}, mapped to ${size}`);
-    return size;
-}

package/{node_modules/@schibsted/tpaas-event-builder/dist/ejs → dist/ejs/tpaas-builders}/builders/navigationType.js

@@ -12,12 +12,11 @@ export const builder = (eventNavigationType) => {
         },
     };
 };
-// In practice they use the same values, but for future proofing we keep them separate and mapped
+// In practice, they use the same values, but for future proofing we keep them separate and mapped
 const modernNavigationMap = {
     navigate: 'Navigate',
     reload: 'Reload',
     back_forward: 'BackForward',
-    prerender: 'Prerender',
 };
 const legacyNavigationMap = {
     0: 'Navigate',
@@ -25,7 +24,7 @@ const legacyNavigationMap = {
     2: 'BackForward',
 };
 const getModernNavigationType = (entryType) => {
-    return modernNavigationMap[entryType];
+    return modernNavigationMap[entryType] || 'Navigate';
 };
 const getLegacyNavigationType = (entryType) => {
     return legacyNavigationMap[entryType] || 'Navigate';

package/dist/ejs/tpaas-builders/builders/pageContent.js

@@ -0,0 +1,3 @@
+export const builder = (content) => ({
+    page: content ? { content } : {},
+});

package/{node_modules/@schibsted/tpaas-event-builder/dist/ejs → dist/ejs/tpaas-builders}/builders/pageInfo.js

@@ -1,5 +1,4 @@
-import { isBrowser } from '@schibsted/pulse-utils';
-export const builder = (currentPage) => {
+export const builder = (currentPage, url) => {
     // if something happens and there was no View Page type of event sent before, we need a fallback
     if (!currentPage) {
         return {
@@ -7,7 +6,7 @@ export const builder = (currentPage) => {
                 info: {
                     pageId: 'unknown',
                     pageType: 'Page',
-                    url: isBrowser ? window.location.href : undefined,
+                    url,
                 },
             },
         };

package/dist/ejs/tpaas-builders/builders/pageSports.js

@@ -0,0 +1,3 @@
+export const builder = (sports) => ({
+    page: sports ?? {},
+});

package/dist/ejs/tpaas-builders/builders/provider.js

@@ -0,0 +1,16 @@
+const generateProviderSDRN = (providerId) => `sdrn:schibsted:client:${providerId}`;
+export function builder(providerId, providerStage, providerProduct, providerVersion, component, componentVersion, providerName, providerGroup) {
+    return {
+        provider: {
+            providerId,
+            providerSdrn: generateProviderSDRN(providerId),
+            ...(component !== undefined && { component }),
+            ...(componentVersion !== undefined && { componentVersion }),
+            ...(providerGroup !== undefined && { group: providerGroup }),
+            ...(providerName !== undefined && { name: providerName }),
+            stage: providerStage,
+            product: providerProduct,
+            version: providerVersion,
+        },
+    };
+}

package/dist/ejs/tpaas-builders/builders/referrer.js

@@ -0,0 +1,13 @@
+const hasReferrerData = (referrer) => Boolean(referrer.pageId || referrer.url || referrer.pageType);
+export const builder = (referrer) => {
+    if (!hasReferrerData(referrer)) {
+        return {
+            page: {},
+        };
+    }
+    return {
+        page: {
+            referrer,
+        },
+    };
+};

package/dist/ejs/tpaas-builders/builders/session.js

@@ -0,0 +1 @@
+export const builder = (session) => ({ session });

package/dist/ejs/tpaas-builders/builders/trackerBuilder.js

@@ -0,0 +1,10 @@
+export const builder = ({ isHybrid, routingStage, version, }) => {
+    return {
+        tracker: {
+            isHybrid,
+            routingStage,
+            trackerType: 'JS',
+            version,
+        },
+    };
+};

package/{node_modules/@schibsted/tpaas-event-builder/dist/ejs → dist/ejs/tpaas-builders}/builders/user.js

@@ -4,7 +4,7 @@ export const builder = (user) => {
         return {};
     }
     const { hasAnySubscription, region, id, realm } = user;
-    if (!id || !id.toString().trim()) {
+    if (!id?.toString().trim()) {
         // the user is anonymous (logged out)
         return {};
     }

package/{node_modules/@schibsted/tpaas-event-builder/dist/ejs → dist/ejs/tpaas-builders}/builders/utm.js

@@ -1,12 +1,6 @@
-import { isBrowser } from '@schibsted/pulse-utils';
-import { UTM_MEDIUM_VALUES } from '@schibsted/tpaas-schemas';
-export const builder = () => {
-    if (!isBrowser) {
-        return {
-            page: {},
-        };
-    }
-    const urlParams = new URLSearchParams(window?.location?.search ?? '');
+import { UTM_MEDIUM_VALUES } from '../../tpaas-schemas';
+export const builder = (search) => {
+    const urlParams = new URLSearchParams(search);
     const utmCampaign = urlParams.get('utm_campaign');
     const utmContent = urlParams.get('utm_content');
     const utmMediumRaw = urlParams.get('utm_medium');