All files / base ga.ts

27.58% Statements 8/29
12.5% Branches 3/24
66.66% Functions 2/3
27.58% Lines 8/29

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 10710x 10x   10x                                               1x 1x                     10x 10x                   10x                                                                                                                
const urlLocation = window.location.href;
const categoryPrefix = "snapcraft.io-";
 
const events: Record<string, string> = {
  ".global-nav a": "nav-0",
  ".p-navigation a": "nav-1",
  "#footer a": "footer-0",
  "#main-content .p-button--positive": "content-cta-0",
  ".p-strip .p-button--positive": "content-cta-0",
  "#main-content .p-button": "content-cta-1",
  ".p-strip .p-button": "content-cta-1",
  "#main-content .p-card": "content-card",
  ".p-strip .p-card": "content-card",
  "#main-content .p-media-object--snap": "content-card-snap",
  ".p-strip .p-media-object--snap": "content-card-snap",
  "#main-content a": "content-link",
  ".p-strip a": "content-link",
};
 
type Event = {
  category: string;
  from: string;
  to: string;
  label: string;
};
 
function triggerEvent({ category, from, to, label }: Event): void {
  Eif (window.dataLayer) {
    window.dataLayer.push({
      event: "GAEvent",
      eventCategory: `${categoryPrefix}${category}`,
      eventAction: `from:${from} to:${to}`,
      eventLabel: label,
      eventValue: undefined,
    } as DataLayerEvent);
  }
}
 
function triggerEventReleaseUI(action: string, label: string): void {
  Eif (window.dataLayer) {
    window.dataLayer.push({
      event: "GAEvent",
      eventCategory: `Release UI`,
      eventAction: action,
      eventLabel: label,
      eventValue: undefined,
    });
  }
}
 
Iif (typeof window.dataLayer !== "undefined") {
  window.addEventListener("click", function (e) {
    let target;
 
    const eventTarget = e.target as HTMLElement;
 
    if (!eventTarget?.closest) {
      return;
    }
 
    target = eventTarget.closest("a") as HTMLAnchorElement;
 
    if (!target) {
      target = eventTarget.closest("button")!;
    }
 
    if (!target) {
      return;
    }
 
    for (const key in events) {
      if (target.matches(key)) {
        // This prevents subsequent matches triggering
        // So the order the events are added is important!
        e.stopImmediatePropagation();
        let label = "";
 
        if (target.innerText) {
          label = target.innerText.trim();
        }
 
        if (label === "") {
          if (
            target.children[0] &&
            target.children[0] instanceof HTMLImageElement
          ) {
            label = `image: ${target.children[0].alt}`;
          }
        }
 
        if (target instanceof HTMLAnchorElement) {
          triggerEvent({
            category: events[key],
            from: urlLocation,
            to: target.href,
            label,
          });
        }
 
        break;
      }
    }
  });
}
 
export { triggerEvent, triggerEventReleaseUI };