@guardian/commercial-core 0.29.0 → 0.33.0

package/README.md

@@ -24,7 +24,7 @@
 [![Generic badge](https://img.shields.io/badge/google-chat-259082.svg)](https://chat.google.com/room/AAAAPL2MBvE)
 
 ```bash
-pnpm add @guardian/commercial-core
+yarn add @guardian/commercial-core
 ```
 
 or
@@ -44,7 +44,7 @@ If your target environment does not support that, make sure you transpile this p
 ### Requirements
 
 1. [Node 14](https://nodejs.org/en/download/) ([nvm][] or [fnm][] recommended)
-2. [PNPM](https://pnpm.io/installation)
+2. [Yarn](https://classic.yarnpkg.com/en/docs/install/)
 
 [nvm]: https://github.com/nvm-sh/nvm
 [fnm]: https://github.com/Schniz/fnm

package/dist/cjs/EventTimer.d.ts

@@ -37,10 +37,10 @@ export declare class EventTimer {
         effectiveType?: string;
     };
     /**
-     * Initalise the EventTimer class on page.
+     * Initialise the EventTimer class on page.
      * Returns the singleton instance of the EventTimer class and binds
      * to window.guardian.commercialTimer. If it's been previously
-     * initalised and bound it returns the original instance
+     * initialised and bound it returns the original instance
      * Note: We save to window.guardian.commercialTimer because
      * different bundles (DCR / DCP) can use commercial core, and we want
      * all timer events saved to a single instance per-page
@@ -58,7 +58,6 @@ export declare class EventTimer {
      */
     get events(): Event[];
     constructor();
-    mark(name: string): void;
     /**
      * Creates a new performance mark
      * For slot events also ensures each TYPE of event event is marked only once for 'first'
@@ -68,6 +67,7 @@ export declare class EventTimer {
      * @param {origin} [origin=page] - Either 'page' (default) or the name of the slot
      */
     trigger(eventName: string, origin?: string): void;
-    trackInGA(eventName: string, label?: string): void;
+    private mark;
+    private trackInGA;
 }
 export {};

package/dist/cjs/EventTimer.js

@@ -66,10 +66,10 @@ class EventTimer {
                 : {};
     }
     /**
-     * Initalise the EventTimer class on page.
+     * Initialise the EventTimer class on page.
      * Returns the singleton instance of the EventTimer class and binds
      * to window.guardian.commercialTimer. If it's been previously
-     * initalised and bound it returns the original instance
+     * initialised and bound it returns the original instance
      * Note: We save to window.guardian.commercialTimer because
      * different bundles (DCR / DCP) can use commercial core, and we want
      * all timer events saved to a single instance per-page
@@ -102,20 +102,6 @@ class EventTimer {
             ]
             : this._events;
     }
-    mark(name) {
-        const longName = `gu.commercial.${name}`;
-        if (typeof window.performance !== 'undefined' &&
-            'mark' in window.performance) {
-            window.performance.mark(longName);
-            // Most recent mark with this name is the event we just created.
-            const mark = window.performance
-                .getEntriesByName(longName, 'mark')
-                .slice(-1)[0];
-            if (typeof mark !== 'undefined') {
-                this._events.push(new Event(name, mark));
-            }
-        }
-    }
     /**
      * Creates a new performance mark
      * For slot events also ensures each TYPE of event event is marked only once for 'first'
@@ -125,7 +111,7 @@ class EventTimer {
      * @param {origin} [origin=page] - Either 'page' (default) or the name of the slot
      */
     trigger(eventName, origin = 'page') {
-        const TRACKEDSLOTNAME = 'top-above-nav';
+        const TRACKED_SLOT_NAME = 'top-above-nav';
         if (origin === 'page' &&
             !this.triggers.page[eventName]) {
             this.mark(eventName);
@@ -139,12 +125,26 @@ class EventTimer {
             this.trackInGA(eventName, trackLabel);
             this.triggers.first[eventName] = true;
         }
-        if (origin === TRACKEDSLOTNAME) {
-            if (!this.triggers[TRACKEDSLOTNAME][eventName]) {
-                const trackLabel = `${TRACKEDSLOTNAME}-${eventName}`;
+        if (origin === TRACKED_SLOT_NAME) {
+            if (!this.triggers[TRACKED_SLOT_NAME][eventName]) {
+                const trackLabel = `${TRACKED_SLOT_NAME}-${eventName}`;
                 this.mark(trackLabel);
                 this.trackInGA(eventName, trackLabel);
-                this.triggers[TRACKEDSLOTNAME][eventName] = true;
+                this.triggers[TRACKED_SLOT_NAME][eventName] = true;
+            }
+        }
+    }
+    mark(name) {
+        const longName = `gu.commercial.${name}`;
+        if (typeof window.performance !== 'undefined' &&
+            'mark' in window.performance) {
+            window.performance.mark(longName);
+            // Most recent mark with this name is the event we just created.
+            const mark = window.performance
+                .getEntriesByName(longName, 'mark')
+                .slice(-1)[0];
+            if (typeof mark !== 'undefined') {
+                this._events.push(new Event(name, mark));
             }
         }
     }
@@ -159,9 +159,12 @@ class EventTimer {
 exports.EventTimer = EventTimer;
 EventTimer._externallyDefinedEventNames = [
     'cmp-tcfv2-init',
+    'cmp-tcfv2-ui-displayed',
     'cmp-tcfv2-got-consent',
     'cmp-ccpa-init',
+    'cmp-ccpa-ui-displayed',
     'cmp-ccpa-got-consent',
     'cmp-aus-init',
+    'cmp-aus-ui-displayed',
     'cmp-aus-got-consent',
 ];

package/dist/cjs/detectAdBlocker.js

@@ -16,8 +16,9 @@ function adElementBlocked(ad) {
         ad.offsetTop === 0 ||
         ad.offsetWidth === 0 ||
         ad.clientHeight === 0 ||
-        ad.clientWidth === 0)
+        ad.clientWidth === 0) {
         return true;
+    }
     const adStyles = window.getComputedStyle(ad);
     if (adStyles.getPropertyValue('display') === 'none')
         return true;

package/dist/cjs/targeting/personalised.d.ts

@@ -8,7 +8,7 @@ declare type AdManagerGroup = typeof adManagerGroups[number];
  * Personalised Targeting requires user consent
  *
  * It allows or prevents personalised advertising, restrict data processing
- * and handles access to cookies and localstorage
+ * and handles access to cookies and local storage
  */
 export declare type PersonalisedTargeting = {
     /**

package/dist/cjs/targeting/pick-targeting-values.d.ts

@@ -0,0 +1,28 @@
+declare type ValidTargeting<T, K> = '' extends T ? never : [] extends T ? never : [''] extends T ? never : T extends boolean ? never : T extends NonNullable<T> ? K : never;
+declare type DefinedKeys<T> = {
+    [K in keyof T]-?: ValidTargeting<T[K], K>;
+}[keyof T];
+declare type ObjectWithDefinedValues<T> = Pick<T, DefinedKeys<T>>;
+/**
+ * Picks only keys with targeting values from an object.
+ * A targeting values is defined as either:
+ * - a non-empty string
+ * - an array of non-empty strings
+ *
+ * If you object is read-only, you can safely access properties on the result.
+ * For example:
+ *
+ * ```ts
+ * dirty = {
+ *   valid: 'real',
+ *   invalid: undefined,
+ * } as const;
+ *
+ * clean = pickDefinedValues(dirty);
+ *
+ * // @ts-expect-error -- you can’t access this property
+ * clean.invalid
+ * ```
+ */
+export declare const pickTargetingValues: <T extends Record<string, string | readonly string[] | undefined>>(obj: T) => ObjectWithDefinedValues<T>;
+export {};

package/dist/cjs/targeting/pick-targeting-values.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.pickTargetingValues = void 0;
+const libs_1 = require("@guardian/libs");
+const isTargetingString = (string) => (0, libs_1.isString)(string) && string !== '';
+const isTargetingArray = (array) => Array.isArray(array) && array.filter(isTargetingString).length > 0;
+const isValidTargeting = (value) => {
+    if (isTargetingString(value))
+        return true;
+    if (isTargetingArray(value))
+        return true;
+    return false;
+};
+/**
+ * Picks only keys with targeting values from an object.
+ * A targeting values is defined as either:
+ * - a non-empty string
+ * - an array of non-empty strings
+ *
+ * If you object is read-only, you can safely access properties on the result.
+ * For example:
+ *
+ * ```ts
+ * dirty = {
+ *   valid: 'real',
+ *   invalid: undefined,
+ * } as const;
+ *
+ * clean = pickDefinedValues(dirty);
+ *
+ * // @ts-expect-error -- you can’t access this property
+ * clean.invalid
+ * ```
+ */
+const pickTargetingValues = (obj) => {
+    const initialValue = {};
+    return Object.entries(obj).reduce((valid, [key, value]) => {
+        if (isValidTargeting(value)) {
+            // @ts-expect-error -- isValidTargeting checks this
+            valid[key] = value;
+        }
+        return valid;
+    }, initialValue);
+};
+exports.pickTargetingValues = pickTargetingValues;

package/dist/cjs/targeting/session.d.ts

@@ -0,0 +1,98 @@
+import type { Participations } from '@guardian/ab-core';
+import type { CountryCode } from '@guardian/libs';
+import type { False, True } from '../types';
+declare const referrers: readonly [{
+    readonly id: "facebook";
+    readonly match: "facebook.com";
+}, {
+    readonly id: "google";
+    readonly match: "www.google";
+}, {
+    readonly id: "twitter";
+    readonly match: "/t.co/";
+}, {
+    readonly id: "reddit";
+    readonly match: "reddit.com";
+}];
+/**
+ * Session Targeting is based on the browser session
+ *
+ * Includes information such as the country of origin, referrer, page view ID.
+ *
+ * These values identify a browser session are either generated client-side,
+ * read from a cookie or passed down from the server.
+ */
+export declare type SessionTargeting = {
+    /**
+     * **AB** Tests – [see on Ad Manager][gam]
+     *
+     * Type: _Dynamic_
+     *
+     * Values: typically start with `ab`
+     *
+     * [gam]: https://admanager.google.com/59666047#inventory/custom_targeting/detail/custom_key_id=186327
+     */
+    ab: string[] | null;
+    /**
+     * **A**d **T**est – [see on Ad Manager][gam]
+     *
+     * Used for testing purposes, based on query param and/or cookie.
+     *
+     * Type: _Dynamic_
+     *
+     * [See Current values](https://frontend.gutools.co.uk/commercial/adtests)
+     *
+     * [gam]: https://admanager.google.com/59666047#inventory/custom_targeting/detail/custom_key_id=177567
+     */
+    at: string | null;
+    /**
+     * **C**ountry **C**ode – [see on Ad Manager][gam]
+     *
+     * Type: _Dynamic_
+     *
+     * [gam]: https://admanager.google.com/59666047#inventory/custom_targeting/detail/custom_key_id=11703293
+     */
+    cc: CountryCode;
+    /**
+     * Ophan **P**age **V**iew id – [see on Ad Manager][gam]
+     *
+     * ID Generated client-side, usually available on
+     * `guardian.config.ophan.pageViewId`
+     *
+     * Used mainly for internal reporting
+     *
+     * Type: _Dynamic_
+     *
+     * [gam]: https://admanager.google.com/59666047#inventory/custom_targeting/detail/custom_key_id=206127
+     */
+    pv: string;
+    /**
+     * **Ref**errer – [see on Ad Manager][gam]
+     *
+     * Type: _Dynamic_
+     *
+     * Sample values:
+     * - `facebook`
+     * - `google`
+     * - `googleplus`
+     * - `reddit`
+     * - `twitter`
+     *
+     * [gam]: https://admanager.google.com/59666047#inventory/custom_targeting/detail/custom_key_id=228567
+     */
+    ref: typeof referrers[number]['id'] | null;
+    /**
+     * **S**igned **I**n – [see on Ad Manager][gam]
+     *
+     *Whether a user is signed in. Based on presence of a cookie.
+     *
+     * [gam]: https://admanager.google.com/59666047#inventory/custom_targeting/detail/custom_key_id=215727
+     */
+    si: True | False;
+};
+export declare type AllParticipations = {
+    clientSideParticipations: Participations;
+    serverSideParticipations: Record<string, 'control' | 'variant'>;
+};
+export declare const getSessionTargeting: (referrer: string, participations: AllParticipations, targeting: Omit<SessionTargeting, 'ab' | 'ref'>) => SessionTargeting;
+export {};

package/dist/cjs/targeting/session.js

@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getSessionTargeting = void 0;
+const libs_1 = require("@guardian/libs");
+/* -- Types -- */
+const referrers = [
+    {
+        id: 'facebook',
+        match: 'facebook.com',
+    },
+    {
+        id: 'google',
+        match: 'www.google',
+    },
+    {
+        id: 'twitter',
+        match: '/t.co/',
+    },
+    {
+        id: 'reddit',
+        match: 'reddit.com',
+    },
+];
+/* -- Methods -- */
+const getReferrer = (referrer) => {
+    if (referrer === '')
+        return null;
+    const matchedRef = referrers.find((referrerType) => referrer.includes(referrerType.match)) ?? null;
+    return matchedRef ? matchedRef.id : null;
+};
+const experimentsTargeting = ({ clientSideParticipations, serverSideParticipations, }) => {
+    const testToParams = (testName, variant) => {
+        if (variant === 'notintest')
+            return null;
+        // GAM key-value pairs accept value strings up to 40 characters long
+        return `${testName}-${variant}`.substring(0, 40);
+    };
+    const clientSideExperiment = Object.entries(clientSideParticipations)
+        .map((test) => {
+        const [name, variant] = test;
+        return testToParams(name, variant.variant);
+    })
+        .filter(libs_1.isString);
+    const serverSideExperiments = Object.entries(serverSideParticipations)
+        .map((test) => testToParams(...test))
+        .filter(libs_1.isString);
+    if (clientSideExperiment.length + serverSideExperiments.length === 0) {
+        return null;
+    }
+    return [...clientSideExperiment, ...serverSideExperiments];
+};
+/* -- Targeting -- */
+const getSessionTargeting = (referrer, participations, targeting) => ({
+    ref: getReferrer(referrer),
+    ab: experimentsTargeting(participations),
+    ...targeting,
+});
+exports.getSessionTargeting = getSessionTargeting;

package/dist/cjs/types.d.ts

@@ -1,10 +1,10 @@
-export declare type TagAtrribute = {
+export declare type TagAttribute = {
     name: string;
     value: string;
 };
 export declare type ThirdPartyTag = {
     async?: boolean;
-    attrs?: TagAtrribute[];
+    attrs?: TagAttribute[];
     beforeLoad?: () => void;
     insertSnippet?: () => void;
     loaded?: boolean;

package/dist/esm/EventTimer.d.ts

@@ -37,10 +37,10 @@ export declare class EventTimer {
         effectiveType?: string;
     };
     /**
-     * Initalise the EventTimer class on page.
+     * Initialise the EventTimer class on page.
      * Returns the singleton instance of the EventTimer class and binds
      * to window.guardian.commercialTimer. If it's been previously
-     * initalised and bound it returns the original instance
+     * initialised and bound it returns the original instance
      * Note: We save to window.guardian.commercialTimer because
      * different bundles (DCR / DCP) can use commercial core, and we want
      * all timer events saved to a single instance per-page
@@ -58,7 +58,6 @@ export declare class EventTimer {
      */
     get events(): Event[];
     constructor();
-    mark(name: string): void;
     /**
      * Creates a new performance mark
      * For slot events also ensures each TYPE of event event is marked only once for 'first'
@@ -68,6 +67,7 @@ export declare class EventTimer {
      * @param {origin} [origin=page] - Either 'page' (default) or the name of the slot
      */
     trigger(eventName: string, origin?: string): void;
-    trackInGA(eventName: string, label?: string): void;
+    private mark;
+    private trackInGA;
 }
 export {};

package/dist/esm/EventTimer.js

@@ -63,10 +63,10 @@ export class EventTimer {
                 : {};
     }
     /**
-     * Initalise the EventTimer class on page.
+     * Initialise the EventTimer class on page.
      * Returns the singleton instance of the EventTimer class and binds
      * to window.guardian.commercialTimer. If it's been previously
-     * initalised and bound it returns the original instance
+     * initialised and bound it returns the original instance
      * Note: We save to window.guardian.commercialTimer because
      * different bundles (DCR / DCP) can use commercial core, and we want
      * all timer events saved to a single instance per-page
@@ -99,20 +99,6 @@ export class EventTimer {
             ]
             : this._events;
     }
-    mark(name) {
-        const longName = `gu.commercial.${name}`;
-        if (typeof window.performance !== 'undefined' &&
-            'mark' in window.performance) {
-            window.performance.mark(longName);
-            // Most recent mark with this name is the event we just created.
-            const mark = window.performance
-                .getEntriesByName(longName, 'mark')
-                .slice(-1)[0];
-            if (typeof mark !== 'undefined') {
-                this._events.push(new Event(name, mark));
-            }
-        }
-    }
     /**
      * Creates a new performance mark
      * For slot events also ensures each TYPE of event event is marked only once for 'first'
@@ -122,7 +108,7 @@ export class EventTimer {
      * @param {origin} [origin=page] - Either 'page' (default) or the name of the slot
      */
     trigger(eventName, origin = 'page') {
-        const TRACKEDSLOTNAME = 'top-above-nav';
+        const TRACKED_SLOT_NAME = 'top-above-nav';
         if (origin === 'page' &&
             !this.triggers.page[eventName]) {
             this.mark(eventName);
@@ -136,12 +122,26 @@ export class EventTimer {
             this.trackInGA(eventName, trackLabel);
             this.triggers.first[eventName] = true;
         }
-        if (origin === TRACKEDSLOTNAME) {
-            if (!this.triggers[TRACKEDSLOTNAME][eventName]) {
-                const trackLabel = `${TRACKEDSLOTNAME}-${eventName}`;
+        if (origin === TRACKED_SLOT_NAME) {
+            if (!this.triggers[TRACKED_SLOT_NAME][eventName]) {
+                const trackLabel = `${TRACKED_SLOT_NAME}-${eventName}`;
                 this.mark(trackLabel);
                 this.trackInGA(eventName, trackLabel);
-                this.triggers[TRACKEDSLOTNAME][eventName] = true;
+                this.triggers[TRACKED_SLOT_NAME][eventName] = true;
+            }
+        }
+    }
+    mark(name) {
+        const longName = `gu.commercial.${name}`;
+        if (typeof window.performance !== 'undefined' &&
+            'mark' in window.performance) {
+            window.performance.mark(longName);
+            // Most recent mark with this name is the event we just created.
+            const mark = window.performance
+                .getEntriesByName(longName, 'mark')
+                .slice(-1)[0];
+            if (typeof mark !== 'undefined') {
+                this._events.push(new Event(name, mark));
             }
         }
     }
@@ -155,9 +155,12 @@ export class EventTimer {
 }
 EventTimer._externallyDefinedEventNames = [
     'cmp-tcfv2-init',
+    'cmp-tcfv2-ui-displayed',
     'cmp-tcfv2-got-consent',
     'cmp-ccpa-init',
+    'cmp-ccpa-ui-displayed',
     'cmp-ccpa-got-consent',
     'cmp-aus-init',
+    'cmp-aus-ui-displayed',
     'cmp-aus-got-consent',
 ];

package/dist/esm/detectAdBlocker.js

@@ -13,8 +13,9 @@ function adElementBlocked(ad) {
         ad.offsetTop === 0 ||
         ad.offsetWidth === 0 ||
         ad.clientHeight === 0 ||
-        ad.clientWidth === 0)
+        ad.clientWidth === 0) {
         return true;
+    }
     const adStyles = window.getComputedStyle(ad);
     if (adStyles.getPropertyValue('display') === 'none')
         return true;

package/dist/esm/targeting/personalised.d.ts

@@ -8,7 +8,7 @@ declare type AdManagerGroup = typeof adManagerGroups[number];
  * Personalised Targeting requires user consent
  *
  * It allows or prevents personalised advertising, restrict data processing
- * and handles access to cookies and localstorage
+ * and handles access to cookies and local storage
  */
 export declare type PersonalisedTargeting = {
     /**

package/dist/esm/targeting/pick-targeting-values.d.ts

@@ -0,0 +1,28 @@
+declare type ValidTargeting<T, K> = '' extends T ? never : [] extends T ? never : [''] extends T ? never : T extends boolean ? never : T extends NonNullable<T> ? K : never;
+declare type DefinedKeys<T> = {
+    [K in keyof T]-?: ValidTargeting<T[K], K>;
+}[keyof T];
+declare type ObjectWithDefinedValues<T> = Pick<T, DefinedKeys<T>>;
+/**
+ * Picks only keys with targeting values from an object.
+ * A targeting values is defined as either:
+ * - a non-empty string
+ * - an array of non-empty strings
+ *
+ * If you object is read-only, you can safely access properties on the result.
+ * For example:
+ *
+ * ```ts
+ * dirty = {
+ *   valid: 'real',
+ *   invalid: undefined,
+ * } as const;
+ *
+ * clean = pickDefinedValues(dirty);
+ *
+ * // @ts-expect-error -- you can’t access this property
+ * clean.invalid
+ * ```
+ */
+export declare const pickTargetingValues: <T extends Record<string, string | readonly string[] | undefined>>(obj: T) => ObjectWithDefinedValues<T>;
+export {};

package/dist/esm/targeting/pick-targeting-values.js

@@ -0,0 +1,41 @@
+import { isString } from '@guardian/libs';
+const isTargetingString = (string) => isString(string) && string !== '';
+const isTargetingArray = (array) => Array.isArray(array) && array.filter(isTargetingString).length > 0;
+const isValidTargeting = (value) => {
+    if (isTargetingString(value))
+        return true;
+    if (isTargetingArray(value))
+        return true;
+    return false;
+};
+/**
+ * Picks only keys with targeting values from an object.
+ * A targeting values is defined as either:
+ * - a non-empty string
+ * - an array of non-empty strings
+ *
+ * If you object is read-only, you can safely access properties on the result.
+ * For example:
+ *
+ * ```ts
+ * dirty = {
+ *   valid: 'real',
+ *   invalid: undefined,
+ * } as const;
+ *
+ * clean = pickDefinedValues(dirty);
+ *
+ * // @ts-expect-error -- you can’t access this property
+ * clean.invalid
+ * ```
+ */
+export const pickTargetingValues = (obj) => {
+    const initialValue = {};
+    return Object.entries(obj).reduce((valid, [key, value]) => {
+        if (isValidTargeting(value)) {
+            // @ts-expect-error -- isValidTargeting checks this
+            valid[key] = value;
+        }
+        return valid;
+    }, initialValue);
+};

package/dist/esm/targeting/session.d.ts

@@ -0,0 +1,98 @@
+import type { Participations } from '@guardian/ab-core';
+import type { CountryCode } from '@guardian/libs';
+import type { False, True } from '../types';
+declare const referrers: readonly [{
+    readonly id: "facebook";
+    readonly match: "facebook.com";
+}, {
+    readonly id: "google";
+    readonly match: "www.google";
+}, {
+    readonly id: "twitter";
+    readonly match: "/t.co/";
+}, {
+    readonly id: "reddit";
+    readonly match: "reddit.com";
+}];
+/**
+ * Session Targeting is based on the browser session
+ *
+ * Includes information such as the country of origin, referrer, page view ID.
+ *
+ * These values identify a browser session are either generated client-side,
+ * read from a cookie or passed down from the server.
+ */
+export declare type SessionTargeting = {
+    /**
+     * **AB** Tests – [see on Ad Manager][gam]
+     *
+     * Type: _Dynamic_
+     *
+     * Values: typically start with `ab`
+     *
+     * [gam]: https://admanager.google.com/59666047#inventory/custom_targeting/detail/custom_key_id=186327
+     */
+    ab: string[] | null;
+    /**
+     * **A**d **T**est – [see on Ad Manager][gam]
+     *
+     * Used for testing purposes, based on query param and/or cookie.
+     *
+     * Type: _Dynamic_
+     *
+     * [See Current values](https://frontend.gutools.co.uk/commercial/adtests)
+     *
+     * [gam]: https://admanager.google.com/59666047#inventory/custom_targeting/detail/custom_key_id=177567
+     */
+    at: string | null;
+    /**
+     * **C**ountry **C**ode – [see on Ad Manager][gam]
+     *
+     * Type: _Dynamic_
+     *
+     * [gam]: https://admanager.google.com/59666047#inventory/custom_targeting/detail/custom_key_id=11703293
+     */
+    cc: CountryCode;
+    /**
+     * Ophan **P**age **V**iew id – [see on Ad Manager][gam]
+     *
+     * ID Generated client-side, usually available on
+     * `guardian.config.ophan.pageViewId`
+     *
+     * Used mainly for internal reporting
+     *
+     * Type: _Dynamic_
+     *
+     * [gam]: https://admanager.google.com/59666047#inventory/custom_targeting/detail/custom_key_id=206127
+     */
+    pv: string;
+    /**
+     * **Ref**errer – [see on Ad Manager][gam]
+     *
+     * Type: _Dynamic_
+     *
+     * Sample values:
+     * - `facebook`
+     * - `google`
+     * - `googleplus`
+     * - `reddit`
+     * - `twitter`
+     *
+     * [gam]: https://admanager.google.com/59666047#inventory/custom_targeting/detail/custom_key_id=228567
+     */
+    ref: typeof referrers[number]['id'] | null;
+    /**
+     * **S**igned **I**n – [see on Ad Manager][gam]
+     *
+     *Whether a user is signed in. Based on presence of a cookie.
+     *
+     * [gam]: https://admanager.google.com/59666047#inventory/custom_targeting/detail/custom_key_id=215727
+     */
+    si: True | False;
+};
+export declare type AllParticipations = {
+    clientSideParticipations: Participations;
+    serverSideParticipations: Record<string, 'control' | 'variant'>;
+};
+export declare const getSessionTargeting: (referrer: string, participations: AllParticipations, targeting: Omit<SessionTargeting, 'ab' | 'ref'>) => SessionTargeting;
+export {};

package/dist/esm/targeting/session.js

@@ -0,0 +1,54 @@
+import { isString } from '@guardian/libs';
+/* -- Types -- */
+const referrers = [
+    {
+        id: 'facebook',
+        match: 'facebook.com',
+    },
+    {
+        id: 'google',
+        match: 'www.google',
+    },
+    {
+        id: 'twitter',
+        match: '/t.co/',
+    },
+    {
+        id: 'reddit',
+        match: 'reddit.com',
+    },
+];
+/* -- Methods -- */
+const getReferrer = (referrer) => {
+    if (referrer === '')
+        return null;
+    const matchedRef = referrers.find((referrerType) => referrer.includes(referrerType.match)) ?? null;
+    return matchedRef ? matchedRef.id : null;
+};
+const experimentsTargeting = ({ clientSideParticipations, serverSideParticipations, }) => {
+    const testToParams = (testName, variant) => {
+        if (variant === 'notintest')
+            return null;
+        // GAM key-value pairs accept value strings up to 40 characters long
+        return `${testName}-${variant}`.substring(0, 40);
+    };
+    const clientSideExperiment = Object.entries(clientSideParticipations)
+        .map((test) => {
+        const [name, variant] = test;
+        return testToParams(name, variant.variant);
+    })
+        .filter(isString);
+    const serverSideExperiments = Object.entries(serverSideParticipations)
+        .map((test) => testToParams(...test))
+        .filter(isString);
+    if (clientSideExperiment.length + serverSideExperiments.length === 0) {
+        return null;
+    }
+    return [...clientSideExperiment, ...serverSideExperiments];
+};
+/* -- Targeting -- */
+export const getSessionTargeting = (referrer, participations, targeting) => ({
+    ref: getReferrer(referrer),
+    ab: experimentsTargeting(participations),
+    ...targeting,
+});

package/dist/esm/types.d.ts

@@ -1,10 +1,10 @@
-export declare type TagAtrribute = {
+export declare type TagAttribute = {
     name: string;
     value: string;
 };
 export declare type ThirdPartyTag = {
     async?: boolean;
-    attrs?: TagAtrribute[];
+    attrs?: TagAttribute[];
     beforeLoad?: () => void;
     insertSnippet?: () => void;
     loaded?: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@guardian/commercial-core",
-  "version": "0.29.0",
+  "version": "0.33.0",
   "description": "Guardian advertising business logic",
   "homepage": "https://github.com/guardian/commercial-core#readme",
   "bugs": {
@@ -41,42 +41,44 @@
   },
   "prettier": "@guardian/prettier",
   "devDependencies": {
-    "@commitlint/cli": "^13",
-    "@commitlint/config-conventional": "^14",
-    "@guardian/consent-management-platform": "^8",
-    "@guardian/eslint-config-typescript": "^0.7",
-    "@guardian/libs": "3.3.0",
-    "@guardian/prettier": "^0.7",
-    "@octokit/core": "^3",
-    "@semantic-release/github": "^8",
-    "@types/googletag": "^1.1.3",
+    "@commitlint/cli": "^15.0.0",
+    "@commitlint/config-conventional": "^15.0.0",
+    "@guardian/ab-core": "^2.0.0",
+    "@guardian/consent-management-platform": "^8.0.1",
+    "@guardian/eslint-config-typescript": "^0.7.0",
+    "@guardian/libs": "3.5.1",
+    "@guardian/prettier": "^0.7.0",
+    "@octokit/core": "^3.5.1",
+    "@semantic-release/github": "^8.0.2",
     "@types/google.analytics": "^0.0.42",
-    "@types/jest": "^27.0.2",
-    "@typescript-eslint/eslint-plugin": "^4.33.0",
-    "@typescript-eslint/parser": "^4.33.0",
+    "@types/googletag": "^1.1.4",
+    "@types/jest": "^27.0.3",
+    "@typescript-eslint/eslint-plugin": "^5.5.0",
+    "@typescript-eslint/parser": "^5.5.0",
     "commitizen": "^4.2.4",
     "cz-conventional-changelog": "^3.3.0",
-    "eslint": "^7.32.0",
+    "eslint": "^8.4.1",
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-eslint-comments": "^3.2.0",
-    "eslint-plugin-import": "^2.25.2",
-    "eslint-plugin-jest": "^25.2.2",
+    "eslint-plugin-import": "^2.25.3",
+    "eslint-plugin-jest": "^25.3.0",
     "eslint-plugin-prettier": "^4.0.0",
     "husky": "^7.0.4",
-    "jest": "^27.3.1",
-    "lint-staged": "^11.2.6",
+    "jest": "^27.4.1",
+    "lint-staged": "^12.1.2",
     "mockdate": "^3.0.5",
     "npm-run-all": "^4.1.5",
-    "prettier": "^2.4.1",
-    "semantic-release": "^18.0.0",
+    "prettier": "^2.5.0",
+    "semantic-release": "^18.0.1",
     "ts-jest": "^27.0.7",
-    "typescript": "^4.4.4",
+    "typescript": "^4.5.2",
     "web-vitals": "^2.1.2"
   },
   "publishConfig": {
     "access": "public"
   },
   "peerDependencies": {
+    "@guardian/ab-core": "^2.0.0",
     "@guardian/libs": "^3.3.0"
   }
 }