@highfivve/ad-tag 5.11.7 → 5.11.9

package/lib/ads/adPipeline.js

@@ -5,6 +5,7 @@ var TCPurpose = tcfapi.responses.TCPurpose;
 import { generateAdUnitPathVariables } from './adUnitPath';
 import { createAssetLoaderService } from '../util/assetLoaderService';
 import { uuidV4 } from '../util/uuid';
+import { getMoliLabelsFromQueryParam, getMoliLabelsFromStorage } from '../util/debugLabels';
 export const HIGH_PRIORITY = 100;
 export const LOW_PRIORITY = 10;
 export const mkInitStep = (name, fn) => {
@@ -83,7 +84,12 @@ export class AdPipeline {
             ? this.tcData
             : consentReady(consentConfig, this.window, this.logger, runtimeConfig.environment);
         return this.tcData.then(consentData => {
-            const extraLabels = [...(config.targeting?.labels || []), ...runtimeConfig.labels];
+            const extraLabels = [
+                ...(config.targeting?.labels || []),
+                ...runtimeConfig.labels,
+                ...getMoliLabelsFromQueryParam(this.window),
+                ...getMoliLabelsFromStorage(this.window)
+            ];
             if (consentData.gdprApplies &&
                 consentData.purpose.consents[TCPurpose.STORE_INFORMATION_ON_DEVICE]) {
                 extraLabels.push('purpose-1');

package/lib/ads/modules/emetriq/trackInApp.js

@@ -1,21 +1,29 @@
-const extractDeviceIdParam = (context, advertiserIdKey) => {
-    const deviceId = context.config__.targeting?.keyValues[advertiserIdKey];
+const extractDeviceIdParam = (targeting, advertiserIdKey) => {
+    const deviceId = targeting[advertiserIdKey];
     if (deviceId) {
         return `&device_id=${typeof deviceId === 'string' ? deviceId : deviceId[0]}`;
     }
     return '';
 };
+const extractKeywordsParam = (targeting, keywordsKey) => {
+    const keywords = keywordsKey ? targeting[keywordsKey] : undefined;
+    if (keywords) {
+        const value = typeof keywords === 'string' ? keywords : keywords.join(',');
+        return `&keywords=${encodeURIComponent(value)}`;
+    }
+    return '';
+};
 export const trackInApp = (context, appConfig, additionalIdentifier, additionalCustomParams, document) => {
-    const deviceIdParam = extractDeviceIdParam(context, appConfig.advertiserIdKey);
+    const targeting = {
+        ...context.config__.targeting?.keyValues,
+        ...context.runtimeConfig__.keyValues
+    };
+    const deviceIdParam = extractDeviceIdParam(targeting, appConfig.advertiserIdKey);
     const consentString = context.tcData__.gdprApplies
         ? `gdpr=1&gdpr_consent=${context.tcData__.tcString}`
         : 'gdpr=0';
-    const linkParam = appConfig.linkOrKeyword.link
-        ? `&link=${encodeURIComponent(appConfig.linkOrKeyword.link)}`
-        : '';
-    const keywordsParam = appConfig.linkOrKeyword.keywords
-        ? `&keywords=${encodeURIComponent(appConfig.linkOrKeyword.keywords)}`
-        : '';
+    const linkParam = `&link=${encodeURIComponent(context.window__.location.href)}`;
+    const keywordsParam = extractKeywordsParam(targeting, appConfig.keywordsKey);
     let additionalIdsParam = '';
     const identifiers = { ...appConfig.additionalIdentifier, ...additionalIdentifier };
     Object.entries(identifiers).forEach(([key, value]) => {

package/lib/ads/moli.js

@@ -231,6 +231,16 @@ export const createMoliTag = (window) => {
         }
         return Promise.resolve(null);
     }
+    function refreshQueuedInfiniteSlots(config, runtimeConfig) {
+        const { refreshInfiniteSlots } = runtimeConfig;
+        if (refreshInfiniteSlots.length === 0) {
+            return config;
+        }
+        const log = getLogger(runtimeConfig, window);
+        const configWithInfiniteSlots = refreshInfiniteSlots.reduce((currentConfig, slot) => addNewInfiniteSlotToConfig(currentConfig, slot.idOfConfiguredSlot, slot.artificialDomId, log), config);
+        adService.refreshAdSlots(refreshInfiniteSlots.map(slot => slot.artificialDomId), configWithInfiniteSlots, runtimeConfig);
+        return configWithInfiniteSlots;
+    }
     function requestAds() {
         switch (state.state) {
             case 'configurable': {
@@ -324,7 +334,8 @@ export const createMoliTag = (window) => {
                         const validateLocation = config.spa?.validateLocation ?? 'href';
                         if (state.state === 'spa-requestAds' &&
                             allowRefreshAdSlot(validateLocation, state.href, window.location)) {
-                            const { config, runtimeConfig } = state;
+                            const { runtimeConfig } = state;
+                            const config = refreshQueuedInfiniteSlots(state.config, runtimeConfig);
                             if (state.runtimeConfig.refreshSlots.length > 0) {
                                 adService.refreshAdSlots(runtimeConfig.refreshSlots, config, runtimeConfig);
                             }
@@ -336,6 +347,7 @@ export const createMoliTag = (window) => {
                             afterRequestAds.forEach(hook => hook('spa-finished'));
                             const finishedState = {
                                 ...state,
+                                config,
                                 state: 'spa-finished',
                                 nextRuntimeConfig: newEmptyRuntimeConfig(state.runtimeConfig),
                                 runtimeConfig: newEmptyRuntimeConfig(state.runtimeConfig, { keepTargeting: true })
@@ -432,8 +444,9 @@ export const createMoliTag = (window) => {
                     }
                     return adService.requestAds(config, nextRuntimeConfig).then(() => config);
                 })
-                    .then(config => {
+                    .then(requestedConfig => {
                     const runtimeConfig = state.runtimeConfig;
+                    const config = refreshQueuedInfiniteSlots(requestedConfig, runtimeConfig);
                     if (state.runtimeConfig.refreshSlots.length > 0) {
                         adService.refreshAdSlots(state.runtimeConfig.refreshSlots, config, state.runtimeConfig);
                     }

package/lib/console/components/globalConfig.js

@@ -21,6 +21,7 @@ import { BrowserStorageKeys } from 'ad-tag/util/browserStorageKeys';
 import { calculateAdDensity } from 'ad-tag/console/util/calculateAdDensity';
 import { extractPositionFromPath } from 'ad-tag/console/util/extractPositionFromPath';
 import { getBrowserStorageValue, removeBrowserStorageValue, setBrowserStorageValue } from 'ad-tag/util/localStorage';
+import { addMoliLabelToStorage, clearMoliLabelsFromStorage, getMoliLabelsFromStorage, removeMoliLabelFromStorage } from 'ad-tag/util/debugLabels';
 const debugSidebarSelector = 'moli-debug-sidebar';
 export class GlobalConfig extends Component {
     constructor(props) {
@@ -75,6 +76,7 @@ export class GlobalConfig extends Component {
                         React.createElement(TagLabel, null, "Test mode"),
                         React.createElement(Toggle, { checked: isTestMode, title: isTestMode ? 'Switch back to production mode' : 'Override environment to test', onChange: checked => checked ? this.overrideEnvironmentToTest() : this.resetEnvironmentOverrides() }),
                         isTestMode && !isEnvironmentOverridden && (React.createElement(Tag, { variant: "yellow" }, "test environment set in config")))),
+                React.createElement(Block, { title: "Debug Labels", color: "debugLabels" }, this.renderDebugLabels()),
                 React.createElement(Block, { title: "Targeting", color: "targeting" },
                     config.targeting && (React.createElement("div", null,
                         React.createElement(SubHeadline, null, "Key/value pairs"),
@@ -100,6 +102,34 @@ export class GlobalConfig extends Component {
                             React.createElement("div", { className: "text-xs font-semibold opacity-60" }, this.requestedSizesLabel(slot))),
                         React.createElement("button", { className: "d-btn d-btn-ghost d-btn-sm font-normal normal-case", title: "Open in Ad Setup", onClick: () => this.openSlotInAdSetup(slot.domId) }, "details")))))))));
         };
+        this.renderDebugLabels = () => {
+            const debugLabels = getMoliLabelsFromStorage(window);
+            return (React.createElement("div", null,
+                this.labels(debugLabels, {
+                    onRemove: this.removeDebugLabel,
+                    emptyMessage: 'No debug labels set.'
+                }),
+                React.createElement(TagContainer, null,
+                    React.createElement(TextInput, { placeholder: "label", value: this.state.newDebugLabel, onChange: e => this.setState({ newDebugLabel: e.currentTarget.value }) }),
+                    React.createElement(Btn, { onClick: () => this.addDebugLabel(this.state.newDebugLabel) }, "add"),
+                    React.createElement(Btn, { variant: "red", onClick: this.clearDebugLabels, disabled: debugLabels.length === 0 }, "clear all"))));
+        };
+        this.addDebugLabel = (label) => {
+            const trimmed = label.trim();
+            if (trimmed.length === 0) {
+                return;
+            }
+            addMoliLabelToStorage(window, trimmed);
+            window.location.reload();
+        };
+        this.removeDebugLabel = (label) => {
+            removeMoliLabelFromStorage(window, label);
+            window.location.reload();
+        };
+        this.clearDebugLabels = () => {
+            clearMoliLabelsFromStorage(window);
+            window.location.reload();
+        };
         this.renderAdSetup = (config) => {
             const { modules, labelConfigService } = this.props;
             const { showOnlyRenderedSlots, selectedSlotDomId } = this.state;
@@ -374,11 +404,13 @@ export class GlobalConfig extends Component {
                             : this.standardTagFromString(value))));
                 })))) : (React.createElement("span", null, "No key/values config present."));
         };
-        this.labels = (labels) => {
+        this.labels = (labels, options) => {
             return (React.createElement("div", { className: "mt-2 flex flex-wrap items-center gap-y-1" },
                 labels &&
-                    labels.map((label, index) => (React.createElement(Tag, { key: index, variant: "grey", spacing: "medium" }, label))),
-                (!labels || labels.length === 0) && React.createElement("span", null, "No labels present.")));
+                    labels.map((label, index) => (React.createElement(Tag, { key: index, variant: "grey", spacing: "medium" },
+                        label,
+                        options?.onRemove && (React.createElement("button", { className: "ml-1 border-0 bg-transparent p-0 font-bold", title: `Remove ${label}`, onClick: () => options.onRemove(label) }, "\u2715"))))),
+                (!labels || labels.length === 0) && (React.createElement("span", null, options?.emptyMessage ?? 'No labels present.'))));
         };
         this.filterSetting = (name, filterSetting) => {
             return (React.createElement("div", null,
@@ -505,7 +537,8 @@ export class GlobalConfig extends Component {
                 totalAdDensity: undefined,
                 percentagePerSlot: []
             },
-            configVersion: 'not available'
+            configVersion: 'not available',
+            newDebugLabel: ''
         };
         if (!props.config) {
             this.reportMissingConfig(this.state.messages);

package/lib/console/components/ui.js

@@ -4,6 +4,7 @@ const sectionAccent = {
     moli: 'border-l-[#998fc7]',
     slots: 'border-l-[#506684]',
     targeting: 'border-l-[#998fc7]',
+    debugLabels: 'border-l-[#b6e388]',
     sizeConfig: 'border-l-[#d4c2fc]',
     modules: 'border-l-[#8a7de0]',
     prebid: 'border-l-[#76949f]',

package/lib/gen/packageJson.js

@@ -1,3 +1,3 @@
 export const packageJson = {
-    version: '5.11.7'
+    version: '5.11.9'
 };

package/lib/util/browserStorageKeys.js

@@ -6,5 +6,6 @@ export const BrowserStorageKeys = {
     moliConsoleTheme: 'moli-console-theme',
     testSlotSize: (id) => `moli-test-slot-size-${id}`,
     debugDelay: 'moli-debug-delay',
-    abTest: 'moli-ab-test'
+    abTest: 'moli-ab-test',
+    moliLabels: 'moli-labels'
 };

package/lib/util/debugLabels.js

@@ -0,0 +1,40 @@
+import { parseQueryString } from './query';
+import { getBrowserStorageValue, removeBrowserStorageValue, setBrowserStorageValue } from './localStorage';
+import { QueryParameters } from './queryParameters';
+import { BrowserStorageKeys } from './browserStorageKeys';
+export const getMoliLabelsFromQueryParam = (window) => {
+    try {
+        return (parseQueryString(window.location.search).get(QueryParameters.moliLabels) ?? '')
+            .split(',')
+            .map(label => label.trim())
+            .filter(label => label.length > 0);
+    }
+    catch (e) {
+        return [];
+    }
+};
+const isStringArray = (value) => Array.isArray(value) && value.every(entry => typeof entry === 'string');
+export const getMoliLabelsFromStorage = (window) => {
+    try {
+        const raw = getBrowserStorageValue(BrowserStorageKeys.moliLabels, window.localStorage);
+        if (!raw) {
+            return [];
+        }
+        const parsed = JSON.parse(raw);
+        return isStringArray(parsed) ? parsed : [];
+    }
+    catch (e) {
+        return [];
+    }
+};
+export const addMoliLabelToStorage = (window, label) => {
+    const labels = [...getMoliLabelsFromStorage(window), label];
+    setBrowserStorageValue(BrowserStorageKeys.moliLabels, JSON.stringify(labels), window.localStorage);
+};
+export const removeMoliLabelFromStorage = (window, label) => {
+    const labels = getMoliLabelsFromStorage(window).filter(entry => entry !== label);
+    setBrowserStorageValue(BrowserStorageKeys.moliLabels, JSON.stringify(labels), window.localStorage);
+};
+export const clearMoliLabelsFromStorage = (window) => {
+    removeBrowserStorageValue(BrowserStorageKeys.moliLabels, window.localStorage);
+};

package/lib/util/queryParameters.js

@@ -2,5 +2,6 @@ export const QueryParameters = {
     moliEnv: 'moliEnv',
     moliPubCode: 'moliPubCode',
     moliVersion: 'moliVersion',
-    abTest: 'ABtest'
+    abTest: 'ABtest',
+    moliLabels: 'moliLabels'
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@highfivve/ad-tag",
-  "version": "5.11.7",
+  "version": "5.11.9",
   "license": "Apache-2.0",
   "description": "An ad tag implementation called moli",
   "main": "./lib/index.js",