@searchspring/snap-controller 0.73.7 → 0.75.0

package/dist/esm/Search/SearchController.js

@@ -11,6 +11,9 @@ const BACKGROUND_FILTERS_VALUE_FLAGS = [1, 0, '1', '0', 'true', 'false', true, f
 const defaultConfig = {
     id: 'search',
     globals: {},
+    beacon: {
+        enabled: true,
+    },
     settings: {
         redirects: {
             merchandising: true,
@@ -36,7 +39,15 @@ export class SearchController extends AbstractController {
         this.track = {
             banner: {
                 impression: ({ uid, responseId }) => {
-                    if (this.events[responseId]?.banner[uid]?.impression) {
+                    if (!uid) {
+                        this.log.warn('No banner provided to track.banner.impression');
+                        return;
+                    }
+                    if (!this.events[responseId]) {
+                        this.log.warn('No responseId found in controller, ensure correct controller is used');
+                        return;
+                    }
+                    else if (this.events[responseId]?.banner[uid]?.impression) {
                         return;
                     }
                     const banner = { uid };
@@ -46,12 +57,20 @@ export class SearchController extends AbstractController {
                         results: [],
                     };
                     this.eventManager.fire('track.banner.impression', { controller: this, product: { uid }, trackEvent: data });
-                    this.tracker.events[this.page.type].impression({ data, siteId: this.config.globals?.siteId });
+                    this.config.beacon?.enabled && this.tracker.events[this.page.type].impression({ data, siteId: this.config.globals?.siteId });
                     this.events[responseId].banner[uid] = this.events[responseId].banner[uid] || {};
                     this.events[responseId].banner[uid].impression = true;
                 },
                 click: (e, banner) => {
+                    if (!banner) {
+                        this.log.warn('No banner provided to track.banner.click');
+                        return;
+                    }
                     const { responseId, uid } = banner;
+                    if (!this.events[responseId]) {
+                        this.log.warn('No responseId found in controller, ensure correct controller is used');
+                        return;
+                    }
                     if (isClickWithinBannerLink(e)) {
                         if (this.events?.[responseId]?.banner[uid]?.clickThrough) {
                             return;
@@ -65,13 +84,21 @@ export class SearchController extends AbstractController {
                     }
                 },
                 clickThrough: (e, { uid, responseId }) => {
+                    if (!uid) {
+                        this.log.warn('No banner provided to track.banner.clickThrough');
+                        return;
+                    }
+                    if (!this.events[responseId]) {
+                        this.log.warn('No responseId found in controller, ensure correct controller is used');
+                        return;
+                    }
                     const banner = { uid };
                     const data = {
                         responseId,
                         banners: [banner],
                     };
                     this.eventManager.fire('track.banner.clickThrough', { controller: this, event: e, product: { uid }, trackEvent: data });
-                    this.tracker.events[this.page.type].clickThrough({ data, siteId: this.config.globals?.siteId });
+                    this.config.beacon?.enabled && this.tracker.events[this.page.type].clickThrough({ data, siteId: this.config.globals?.siteId });
                     this.events[responseId].banner[uid] = this.events[responseId].banner[uid] || {};
                     this.events[responseId].banner[uid].clickThrough = true;
                     setTimeout(() => {
@@ -81,7 +108,15 @@ export class SearchController extends AbstractController {
             },
             product: {
                 clickThrough: (e, result) => {
+                    if (!result) {
+                        this.log.warn('No result provided to track.product.clickThrough');
+                        return;
+                    }
                     const responseId = result.responseId;
+                    if (!this.events[responseId]) {
+                        this.log.warn('No responseId found in controller, ensure correct controller is used');
+                        return;
+                    }
                     const target = e.target;
                     const resultHref = result.display?.mappings.core?.url || result.mappings.core?.url || '';
                     const elemHref = target?.getAttribute('href');
@@ -108,21 +143,34 @@ export class SearchController extends AbstractController {
                     }
                     // store position data or empty object
                     this.storage.set('scrollMap', scrollMap);
+                    const type = (['product', 'banner'].includes(result.type) ? result.type : 'product');
                     const item = {
-                        type: result.type,
-                        uid: result.id,
-                        parentId: result.id,
-                        sku: result.mappings.core?.sku,
+                        type,
+                        uid: result.id ? '' + result.id : '',
+                        ...(type === 'product'
+                            ? {
+                                parentId: result.id ? '' + result.id : '',
+                                sku: result.mappings.core?.sku ? '' + result.mappings.core?.sku : undefined,
+                            }
+                            : {}),
                     };
                     const data = {
                         responseId,
                         results: [item],
                     };
                     this.eventManager.fire('track.product.clickThrough', { controller: this, event: e, product: result, trackEvent: data });
-                    this.tracker.events[this.page.type].clickThrough({ data, siteId: this.config.globals?.siteId });
+                    this.config.beacon?.enabled && this.tracker.events[this.page.type].clickThrough({ data, siteId: this.config.globals?.siteId });
                 },
                 click: (e, result) => {
+                    if (!result) {
+                        this.log.warn('No result provided to track.product.click');
+                        return;
+                    }
                     const responseId = result.responseId;
+                    if (!this.events[responseId]) {
+                        this.log.warn('No responseId found in controller, ensure correct controller is used');
+                        return;
+                    }
                     if (result.type === 'banner' && isClickWithinBannerLink(e)) {
                         if (this.events?.[responseId]?.product[result.id]?.inlineBannerClickThrough) {
                             return;
@@ -147,15 +195,28 @@ export class SearchController extends AbstractController {
                     }
                 },
                 impression: (result) => {
+                    if (!result) {
+                        this.log.warn('No result provided to track.product.impression');
+                        return;
+                    }
                     const responseId = result.responseId;
-                    if (this.events[responseId]?.product[result.id]?.impression) {
+                    if (!this.events[responseId]) {
+                        this.log.warn('No responseId found in controller, ensure correct controller is used');
                         return;
                     }
+                    else if (this.events[responseId]?.product[result.id]?.impression) {
+                        return;
+                    }
+                    const type = (['product', 'banner'].includes(result.type) ? result.type : 'product');
                     const item = {
-                        type: result.type,
-                        uid: result.id,
-                        parentId: result.id,
-                        sku: result.mappings.core?.sku,
+                        type,
+                        uid: result.id ? '' + result.id : '',
+                        ...(type === 'product'
+                            ? {
+                                parentId: result.id ? '' + result.id : '',
+                                sku: result.mappings.core?.sku ? '' + result.mappings.core?.sku : undefined,
+                            }
+                            : {}),
                     };
                     const data = {
                         responseId,
@@ -163,12 +224,20 @@ export class SearchController extends AbstractController {
                         banners: [],
                     };
                     this.eventManager.fire('track.product.impression', { controller: this, product: result, trackEvent: data });
-                    this.tracker.events[this.page.type].impression({ data, siteId: this.config.globals?.siteId });
+                    this.config.beacon?.enabled && this.tracker.events[this.page.type].impression({ data, siteId: this.config.globals?.siteId });
                     this.events[responseId].product[result.id] = this.events[responseId].product[result.id] || {};
                     this.events[responseId].product[result.id].impression = true;
                 },
                 addToCart: (result) => {
+                    if (!result) {
+                        this.log.warn('No result provided to track.product.addToCart');
+                        return;
+                    }
                     const responseId = result.responseId;
+                    if (!this.events[responseId]) {
+                        this.log.warn('No responseId found in controller, ensure correct controller is used');
+                        return;
+                    }
                     const product = {
                         parentId: result.id,
                         uid: result.id,
@@ -181,16 +250,20 @@ export class SearchController extends AbstractController {
                         results: [product],
                     };
                     this.eventManager.fire('track.product.addToCart', { controller: this, product: result, trackEvent: data });
-                    this.tracker.events[this.page.type].addToCart({ data, siteId: this.config.globals?.siteId });
+                    this.config.beacon?.enabled && this.tracker.events[this.page.type].addToCart({ data, siteId: this.config.globals?.siteId });
                 },
             },
             redirect: ({ redirectURL, responseId }) => {
+                if (!redirectURL) {
+                    this.log.warn('No redirectURL provided to track.redirect');
+                    return;
+                }
                 const data = {
                     responseId,
                     redirect: redirectURL,
                 };
                 this.eventManager.fire('track.redirect', { controller: this, redirectURL, trackEvent: data });
-                this.tracker.events.search.redirect({ data, siteId: this.config.globals?.siteId });
+                this.config.beacon?.enabled && this.tracker.events.search.redirect({ data, siteId: this.config.globals?.siteId });
             },
         };
         this.search = async () => {
@@ -324,6 +397,8 @@ export class SearchController extends AbstractController {
                 this.previousResults = JSON.parse(JSON.stringify(response.results));
                 // update the store
                 this.store.update(response);
+                const data = { responseId: response.tracking.responseId };
+                this.config.beacon?.enabled && this.tracker.events[this.page.type].render({ data, siteId: this.config.globals?.siteId });
                 const afterStoreProfile = this.profiler.create({ type: 'event', name: 'afterStore', context: params }).start();
                 try {
                     await this.eventManager.fire('afterStore', {
@@ -392,7 +467,11 @@ export class SearchController extends AbstractController {
             }
         };
         this.addToCart = async (_products) => {
-            const products = typeof _products.slice == 'function' ? _products.slice() : [_products];
+            const products = typeof _products?.slice == 'function' ? _products.slice() : [_products];
+            if (!_products || products.length === 0) {
+                this.log.warn('No products provided to search controller.addToCart');
+                return;
+            }
             products.forEach((product) => {
                 this.track.product.addToCart(product);
             });
@@ -514,10 +593,7 @@ export class SearchController extends AbstractController {
         this.eventManager.on('afterStore', async (search, next) => {
             await next();
             const controller = search.controller;
-            const responseId = search.response.tracking.responseId;
             if (controller.store.loaded && !controller.store.error) {
-                const data = { responseId };
-                this.tracker.events[this.page.type].render({ data, siteId: this.config.globals?.siteId });
                 const config = search.controller.config;
                 const nonBackgroundFilters = search?.request?.filters?.filter((filter) => !filter.background);
                 if (config?.settings?.redirects?.singleResult &&
@@ -666,8 +742,16 @@ export function generateHrefSelector(element, href, levels = 7) {
     let level = 0;
     let elem = element;
     while (elem && level <= levels) {
-        // check within
-        const innerHrefElem = elem.querySelector(`[href*="${href}"]`);
+        let innerHrefElem = null;
+        try {
+            innerHrefElem = elem.querySelector(`[href*="${href}"]`);
+        }
+        catch (e) {
+            try {
+                innerHrefElem = elem.querySelector(cssEscape(`[href*="${href}"]`));
+            }
+            catch { }
+        }
         if (innerHrefElem) {
             // innerHrefElem was found! now get selectors up to elem that contained it
             let selector = '';

package/dist/esm/utils/isClickWithinProductLink.d.ts

@@ -1,5 +1,5 @@
 import type { Product } from '@searchspring/snap-store-mobx';
-export declare const CLICK_DUPLICATION_TIMEOUT = 300;
+export declare const CLICK_DUPLICATION_TIMEOUT = 1000;
 export declare const CLICK_THROUGH_CLOSEST_MAX_LEVELS = 12;
 export declare const isClickWithinProductLink: (e: MouseEvent, result: Product) => boolean;
 //# sourceMappingURL=isClickWithinProductLink.d.ts.map

package/dist/esm/utils/isClickWithinProductLink.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"isClickWithinProductLink.d.ts","sourceRoot":"","sources":["../../../src/utils/isClickWithinProductLink.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AAE7D,eAAO,MAAM,yBAAyB,MAAM,CAAC;AAC7C,eAAO,MAAM,gCAAgC,KAAK,CAAC;AAEnD,eAAO,MAAM,wBAAwB,MAAO,UAAU,UAAU,OAAO,KAAG,OAgBzE,CAAC"}
+{"version":3,"file":"isClickWithinProductLink.d.ts","sourceRoot":"","sources":["../../../src/utils/isClickWithinProductLink.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,+BAA+B,CAAC;AAE7D,eAAO,MAAM,yBAAyB,OAAO,CAAC;AAC9C,eAAO,MAAM,gCAAgC,KAAK,CAAC;AAEnD,eAAO,MAAM,wBAAwB,MAAO,UAAU,UAAU,OAAO,KAAG,OAoBzE,CAAC"}

package/dist/esm/utils/isClickWithinProductLink.js

@@ -1,18 +1,19 @@
-export const CLICK_DUPLICATION_TIMEOUT = 300;
+export const CLICK_DUPLICATION_TIMEOUT = 1000;
 export const CLICK_THROUGH_CLOSEST_MAX_LEVELS = 12;
 export const isClickWithinProductLink = (e, result) => {
-    let currentElement = e.target;
-    let href = null;
-    let level = 0;
-    const resultCoreUrl = result?.display?.mappings.core?.url || '';
-    const resultDisplayUrl = result?.mappings.core?.url || '';
-    while (currentElement && level < CLICK_THROUGH_CLOSEST_MAX_LEVELS) {
-        href = currentElement.getAttribute('href');
-        if (href && ((resultCoreUrl && href.includes(resultCoreUrl)) || (resultDisplayUrl && href.includes(resultDisplayUrl)))) {
-            return true;
+    const resultDisplayUrl = result?.display?.mappings.core?.url || '';
+    const resultCoreUrl = result?.mappings.core?.url || '';
+    // Get the composed path to handle shadow DOM elements
+    const path = e.composedPath ? e.composedPath() : [e.target];
+    // Check up to CLICK_THROUGH_CLOSEST_MAX_LEVELS elements in the path
+    const elementsToCheck = path.slice(0, CLICK_THROUGH_CLOSEST_MAX_LEVELS);
+    for (const element of elementsToCheck) {
+        if (element instanceof Element) {
+            const href = element.getAttribute('href');
+            if (href && ((resultCoreUrl && href.includes(resultCoreUrl)) || (resultDisplayUrl && href.includes(resultDisplayUrl)))) {
+                return true;
+            }
         }
-        currentElement = currentElement.parentElement;
-        level++;
     }
     return false;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@searchspring/snap-controller",
-	"version": "0.73.7",
+	"version": "0.75.0",
 	"description": "Snap Controllers",
 	"main": "dist/cjs/index.js",
 	"module": "dist/esm/index.js",
@@ -20,22 +20,22 @@
 		"test:watch": "jest --watch"
 	},
 	"dependencies": {
-		"@searchspring/snap-toolbox": "0.73.7",
+		"@searchspring/snap-toolbox": "0.75.0",
 		"css.escape": "1.5.1",
 		"deepmerge": "4.3.1"
 	},
 	"devDependencies": {
-		"@searchspring/snap-client": "0.73.7",
-		"@searchspring/snap-event-manager": "0.73.7",
-		"@searchspring/snap-logger": "0.73.7",
-		"@searchspring/snap-profiler": "0.73.7",
-		"@searchspring/snap-store-mobx": "0.73.7",
-		"@searchspring/snap-tracker": "0.73.7",
-		"@searchspring/snap-url-manager": "0.73.7"
+		"@searchspring/snap-client": "0.75.0",
+		"@searchspring/snap-event-manager": "0.75.0",
+		"@searchspring/snap-logger": "0.75.0",
+		"@searchspring/snap-profiler": "0.75.0",
+		"@searchspring/snap-store-mobx": "0.75.0",
+		"@searchspring/snap-tracker": "0.75.0",
+		"@searchspring/snap-url-manager": "0.75.0"
 	},
 	"sideEffects": false,
 	"files": [
 		"dist/**/*"
 	],
-	"gitHead": "8da3a6b990f69a5cea07aa4570db108a83952f4c"
+	"gitHead": "262c02e06e2bc4637e8e4eb9e48990cc3a9d3c18"
 }