@armco/analytics 0.2.2 → 0.2.4

package/analytics.js

@@ -21,7 +21,8 @@ const packageJsonPath = getEnvironmentType() === "node" ? path.resolve(process.c
 let ar_anonymous_id;
 let user = null;
 let apiKey = null;
-let analyticsEndpoint;
+let analyticsLogEndpoint;
+let analyticsTagEndpoint;
 let hostProjectName = null;
 let enabled = null;
 const CONFIG_FILE_NAME = "analyticsrc";
@@ -74,19 +75,19 @@ function loadConfiguration() {
             return config;
         }
         catch (error) {
-            console.error(`Failed to load configuration from ${configFilePath}.`);
+            console.error(`[ANALYTICS] Failed to load configuration from ${configFilePath}.`);
         }
         const isTS = yield isTypeScriptProject();
         configFilePath = `${ROOT}${CONFIG_FILE_NAME}.${isTS ? "ts" : "js"}`;
         try {
             const config = yield import(configFilePath);
-            console.log(`Configuration loaded from ${configFilePath} successfully.`);
+            console.log(`[ANALYTICS] Configuration loaded from ${configFilePath} successfully.`);
             return config.default;
         }
         catch (error) {
-            console.error(`Failed to load configuration from ${configFilePath}.`);
+            console.error(`[ANALYTICS] Failed to load configuration from ${configFilePath}.`);
         }
-        console.error(`No valid configuration file found. Expected one of ${CONFIG_FILE_NAME}.js, ${CONFIG_FILE_NAME}.json or ${CONFIG_FILE_NAME}.ts`);
+        console.error(`[ANALYTICS] No valid configuration file found. Expected one of ${CONFIG_FILE_NAME}.js, ${CONFIG_FILE_NAME}.json or ${CONFIG_FILE_NAME}.ts`);
         return null;
     });
 }
@@ -115,9 +116,15 @@ function getEnvironmentType() {
 function getHostProjectName() {
     return __awaiter(this, void 0, void 0, function* () {
         if (!hostProjectName) {
-            const packageJson = yield import(packageJsonPath);
-            hostProjectName = packageJson.name || null;
-            enabled = isEnabled();
+            try {
+                const packageJson = yield import(packageJsonPath);
+                hostProjectName = packageJson.name || null;
+                console.log("[ANALYTICS] Fetched project name from package details: ", hostProjectName);
+                enabled = isEnabled();
+            }
+            catch (e) {
+                console.warn("[ANALYTICS] Failed to fetch project name, continuing without");
+            }
         }
         return hostProjectName;
     });
@@ -127,6 +134,7 @@ function enrichEventData(data) {
         data.eventId = uuidv4();
         data.client = hostProjectName;
         data.sessionId = getSessionId();
+        data.url = window.location.href;
         region && (data.region = region);
         address && !data.address && (data.address = address);
         coordinates && !data.coordinates && (data.coordinates = coordinates);
@@ -148,7 +156,7 @@ export function sendBulkData(data, callback) {
 function sendAnalyticsData(data) {
     return __awaiter(this, void 0, void 0, function* () {
         try {
-            if (!apiKey && !analyticsEndpoint) {
+            if (!apiKey && !analyticsLogEndpoint) {
                 console.error('Neither of API key and Analytics server configured. Data not sent.');
                 return;
             }
@@ -162,9 +170,14 @@ function sendAnalyticsData(data) {
             if (apiKey) {
                 options.headers.Authorization = `Bearer ${apiKey}`;
             }
-            const logEndpoint = apiKey ? ARMCO_SERVER + ADD : analyticsEndpoint;
-            const response = yield fetch(logEndpoint, options);
-            console.log('Analytics data sent to server:', logEndpoint, data, response.status, response.statusText);
+            const logEndpoint = apiKey ? ARMCO_SERVER + ADD : analyticsLogEndpoint;
+            try {
+                const response = yield fetch(logEndpoint, options);
+                console.log('Analytics data sent to server:', logEndpoint, data, response.status, response.statusText);
+            }
+            catch (e) {
+                console.warn("Failed attempt to log event");
+            }
         }
         catch (error) {
             console.error('Failed to send analytics data:', error);
@@ -174,7 +187,7 @@ function sendAnalyticsData(data) {
 function tagEvents(email) {
     return __awaiter(this, void 0, void 0, function* () {
         try {
-            if (!apiKey && !analyticsEndpoint) {
+            if (!apiKey && !analyticsTagEndpoint) {
                 console.error('Neither of API key and Analytics server configured. Tagging won\'t be attempted.');
                 return;
             }
@@ -188,7 +201,7 @@ function tagEvents(email) {
             if (apiKey) {
                 options.headers.Authorization = `Bearer ${apiKey}`;
             }
-            const tagEndpoint = apiKey ? ARMCO_SERVER + ADD : analyticsEndpoint;
+            const tagEndpoint = apiKey ? ARMCO_SERVER + ADD : analyticsTagEndpoint;
             const response = yield fetch(tagEndpoint, options);
             console.log('Analytics data sent to server:', tagEndpoint, response.status, response.statusText);
         }
@@ -264,6 +277,71 @@ function populateLocationDetails() {
     }
     region = localTimeRegion;
 }
+const trackedItems = [
+    "a[href]",
+    "button",
+    "input[type='button']",
+    "input[type='submit']",
+    "input[type='reset']",
+    "input[type='checkbox']",
+    "input[type='radio']",
+    "select",
+    "textarea",
+    "area",
+    "details",
+    "summary",
+    "iframe",
+    "object",
+    "embed",
+    "label",
+    "img",
+    "[role='button']",
+    "[role='checkbox']",
+    "[role='link']",
+    "[role='menuitem']",
+    "[role='menuitemcheckbox']",
+    "[role='menuitemradio']",
+    "[data-track='true']"
+];
+function isClickable(element) {
+    return element.matches(trackedItems.join(", ")) ||
+        element.onclick != null ||
+        window.getComputedStyle(element).cursor == "pointer";
+}
+function handleTrackedItemClick(e) {
+    var _a;
+    const clickedElement = e.target;
+    if (isClickable(clickedElement)) {
+        const dataAttributes = Object.assign({}, clickedElement.dataset);
+        const id = clickedElement.id || null;
+        const name = clickedElement.getAttribute('name') || null;
+        const classes = Array.from(clickedElement.classList);
+        const elementType = clickedElement.tagName.toLowerCase();
+        const textContent = clickedElement.textContent;
+        const href = 'href' in clickedElement ? clickedElement.href : null;
+        const role = clickedElement.getAttribute('role') || null;
+        const parentElementId = ((_a = clickedElement.parentElement) === null || _a === void 0 ? void 0 : _a.id) || null;
+        const value = 'value' in clickedElement && clickedElement.value
+            ? clickedElement.value
+            : null;
+        const mergedData = Object.assign({}, dataAttributes, {
+            id,
+            name,
+            classes,
+            textContent,
+            href,
+            tagName: elementType,
+            role,
+            parentElementId,
+        });
+        trackEvent("CLICK", {
+            click: {
+                data: mergedData,
+                value,
+            },
+        });
+    }
+}
 function hookTrackers() {
     if (environment === "browser") {
         const TRACK_EVENTS = (CONFIG === null || CONFIG === void 0 ? void 0 : CONFIG.trackEvents) || ["click", "submit", "select-change"];
@@ -271,41 +349,8 @@ function hookTrackers() {
             console.log("[ANALYTICS] Attaching Click handlers");
             const clickables = Array.from(document.querySelectorAll('*'));
             console.log("[ANALYTICS] Found " + clickables.length + " items that can be clicked!");
-            clickables
-                .filter((element) => {
-                return element.tagName === "BUTTON" ||
-                    element.tagName === "A" ||
-                    element.onclick != null ||
-                    window.getComputedStyle(element).cursor == "pointer";
-            })
-                .forEach((element) => {
-                element.addEventListener("click", e => {
-                    var _a;
-                    const clickedElement = e.target;
-                    const id = clickedElement.id;
-                    const classes = Array.from(clickedElement.classList);
-                    const dataAttributes = Object.keys(clickedElement.dataset).map(key => ({ [key]: clickedElement.dataset[key] }));
-                    const textContent = clickedElement.textContent;
-                    const href = 'href' in clickedElement ? clickedElement.href : null;
-                    const elementType = clickedElement.tagName.toLowerCase();
-                    const parentElementId = ((_a = clickedElement.parentElement) === null || _a === void 0 ? void 0 : _a.id) || null;
-                    const value = 'value' in clickedElement && clickedElement.value
-                        ? clickedElement.value
-                        : null;
-                    trackEvent("CLICK", {
-                        click: {
-                            id,
-                            classes,
-                            dataAttributes,
-                            textContent,
-                            href,
-                            elementType,
-                            parentElementId,
-                            value,
-                        }
-                    });
-                });
-            });
+            console.log("[ANALYTICS] Dynamically added elements will be added to this list.");
+            document.addEventListener("click", handleTrackedItemClick);
             console.log("[ANALYTICS] Click handlers Attached");
         }
         if (TRACK_EVENTS.indexOf("submit") > -1) {
@@ -392,7 +437,8 @@ function loadAnalytics(config) {
     if (CONFIG) {
         console.log("[ANALYTICS] Configuration loaded");
         apiKey = CONFIG.apiKey || null;
-        analyticsEndpoint = CONFIG.analyticsEndpoint || null;
+        analyticsLogEndpoint = CONFIG.analyticsLogEndpoint || null;
+        analyticsTagEndpoint = CONFIG.analyticsTagEndpoint || null;
         hostProjectName = CONFIG.hostProjectName || hostProjectName || null;
         console.log("[ANALYTICS] Check if Analytics enabled");
         enabled = isEnabled();
@@ -409,6 +455,10 @@ function loadAnalytics(config) {
             const anonId = generateAnonymousId();
             console.log("Tracking User as", anonId);
             startSession();
+            window.addEventListener('load', function () {
+                console.log("[ANALYTICS] Logging page load");
+                trackEvent("PAGE");
+            });
         }
         else {
             console.warn("[ANALYTICS] Analytics blocked by client, or disabled by configuration!");

package/constants.d.ts

@@ -1,3 +1,3 @@
-export declare const ARMCO_SERVER = "http://telemetry.notabuck.com/api/events/";
+export declare const ARMCO_SERVER = "https://telemetry.notabuck.com/events/";
 export declare const ADD = "add";
 export declare const TAG = "tag";

package/constants.js

@@ -1,3 +1,3 @@
-export const ARMCO_SERVER = "http://telemetry.notabuck.com/api/events/";
+export const ARMCO_SERVER = "https://telemetry.notabuck.com/events/";
 export const ADD = "add";
 export const TAG = "tag";

package/index.interface.d.ts

@@ -14,7 +14,8 @@ export interface Event {
 }
 export interface ConfigType {
     apiKey?: string;
-    analyticsEndpoint?: string;
+    analyticsLogEndpoint?: string;
+    analyticsTagEndpoint?: string;
     hostProjectName?: string;
     trackEvents?: Array<string>;
     submissionStrategy?: SubmissionStrategy;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@armco/analytics",
-  "version": "0.2.2",
+  "version": "0.2.4",
   "description": "Browser Based Analytics interceptor for configured events",
   "main": "index.js",
   "type": "module",