PM-806: Add DL fallback for cta_locations

hlxsites · Jan 9, 2025 · 6b8c8e0 · 6b8c8e0
1 parent b46948b
commit 6b8c8e0
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 5 deletions.
diff --git a/blocks/header/header.js b/blocks/header/header.js
@@ -299,6 +299,7 @@ function instrumentTrackingEvents(header) {
         // track cta clicks on header
         if (e.target.classList.contains('button')) {
           trackGTMEvent('cta_click', {
+            cta_location: 'header_cta',
             link_text: linkText,
             link_url: linkUrl,
           });

diff --git a/scripts/scripts.js b/scripts/scripts.js
@@ -335,17 +335,53 @@ function instrumentTrackingEvents(main) {
               ctaLocation = 'body_1_cta';
             } else if (e.target.closest('.callout-get-a-quote2')) {
               ctaLocation = 'body_2_cta';
+            } else {
+              const containerBlock = e.target.closest('[data-block-name]');
+              // if containerBlock is null, fallback to sections
+              if (containerBlock) {
+                const blockList = document.querySelectorAll(`[data-block-name=${containerBlock.dataset.blockName}]`);
+                blockList.forEach((block, key) => {
+                  if (block === containerBlock) {
+                    ctaLocation = `${containerBlock.dataset.blockName}_${key}`;
+                  }
+                });
+              } else {
+                // check for the closest section
+                const parentSection = e.target.closest('.section');
+                if (parentSection) {
+                  const sectionList = document.querySelectorAll('.section');
+                  sectionList.forEach((section, key) => {
+                    if (section === parentSection) {
+                      ctaLocation = `section_${key}`;
+                    }
+                  });
+                }
+              }
             }
             trackCTAEvent(ctaLocation);
             return;
           } else {
             const containerBlock = e.target.closest('[data-block-name]');
-            const blockList = document.querySelectorAll(`[data-block-name=${containerBlock.dataset.blockName}]`);
-            blockList.forEach((block, key) => {
-              if (block === containerBlock) {
-                ctaLocation = `${containerBlock.dataset.blockName}_${key}`;
+            // if containerBlock is null, fallback to sections
+            if (containerBlock) {
+              const blockList = document.querySelectorAll(`[data-block-name=${containerBlock.dataset.blockName}]`);
+              blockList.forEach((block, key) => {
+                if (block === containerBlock) {
+                  ctaLocation = `${containerBlock.dataset.blockName}_${key}`;
+                }
+              });
+            } else {
+              // check for the closest section
+              const parentSection = e.target.closest('.section');
+              if (parentSection) {
+                const sectionList = document.querySelectorAll('.section');
+                sectionList.forEach((section, key) => {
+                  if (section === parentSection) {
+                    ctaLocation = `section_${key}`;
+                  }
+                });
               }
-            });
+            }
             trackCTAEvent(ctaLocation);
             return;
           }