From 4416d412a78bfc71583c15d0a35c427d3afaf05b Mon Sep 17 00:00:00 2001 From: Ethan Jaffee Date: Wed, 14 Feb 2024 17:08:58 -0500 Subject: [PATCH] add log to constructor, update readme --- README.md | 7 ++ src/AnalyticsEventReporter.ts | 22 ++--- test-site/src/index.ts | 151 +++++++++++++++++----------------- 3 files changed, 89 insertions(+), 91 deletions(-) diff --git a/README.md b/README.md index 186509f..aa42efc 100644 --- a/README.md +++ b/README.md @@ -151,6 +151,13 @@ pagesAnalytics.report({ ### Debugging +#### Debug Mode + +The SDK has a debug mode which can be activated by setting the `debug` property in your AnalyticsConfig to `true`. +This will cause more useful information to be printed out in the logs. In addition, calling report will not actually send an event to the Yext Events API. Instead it will print the request to console. + +#### fetch + keepalive + We use `fetch()` + `keepalive` by default in [supported browsers](https://developer.mozilla.org/en-US/docs/Web/API/fetch) to make debugging easier. For browsers like Firefox that do not support `keepalive`, [we use the Beacon API](https://developer.mozilla.org/en-US/docs/Web/API/Beacon_API). Users can set `forceFetch: true` in their config, which will make these browsers use `fetch()` instead of the `Beacon API`. Be warned, since `forceFetch` uses `fetch()` without `keepalive`, **requests in progress for browsers like FireFox will be canceled if the page is unloaded**. ## Module support diff --git a/src/AnalyticsEventReporter.ts b/src/AnalyticsEventReporter.ts index 7c30579..6ca3608 100644 --- a/src/AnalyticsEventReporter.ts +++ b/src/AnalyticsEventReporter.ts @@ -29,15 +29,19 @@ export class AnalyticsEventReporter implements AnalyticsEventService { } this.config = config; this.payload = payload; + console.log('[DEBUG] AnalyticsConfig object:\n', this.config); + console.log( + '[DEBUG] EventPayload object following call to constructor:\n', + this.payload + ); } with(payload: EventPayload): AnalyticsEventService { const currentPayload = this.payload === undefined ? payload : merge(this.payload, payload); if (this.config.debug) { - console.log('[DEBUG] AnalyticsConfig Object:\n', this.config); console.log( - '[DEBUG] Payload following call to `with`:\n', + '[DEBUG] EventPayload object following call to `with()`:\n', currentPayload ); } @@ -45,20 +49,6 @@ export class AnalyticsEventReporter implements AnalyticsEventService { } public async report(newPayload?: EventPayload): Promise { - if (this.config.debug) { - console.log( - `[DEBUG] Merging the following payloads: - - Original Payload from call to \`with\`: - - ${this.payload ? JSON.stringify(this.payload) : '{}'} - - New Payload from call to \`report:\` - - ${newPayload ? JSON.stringify(newPayload) : '{}'}` - ); - } - const finalPayload: EventPayload = merge( this.payload ?? {}, newPayload ?? {} diff --git a/test-site/src/index.ts b/test-site/src/index.ts index 89d72f6..fa3025c 100644 --- a/test-site/src/index.ts +++ b/test-site/src/index.ts @@ -11,7 +11,8 @@ import { analytics } from '@yext/analytics'; const analyticsProvider = analytics({ authorizationType: 'apiKey', authorization: process.env.YEXT_API_KEY, - sessionTrackingEnabled: false + sessionTrackingEnabled: false, + debug: true }).with({ action: 'CHAT_LINK_CLICK', pageUrl: 'http://www.yext-test-pageurl.com', @@ -53,85 +54,85 @@ const analyticsProvider = analytics({ } }); -const analyticsProvideWithSessionTracking = analytics({ - authorizationType: 'apiKey', - authorization: process.env.YEXT_API_KEY -}).with({ - action: 'CHAT_LINK_CLICK', - pageUrl: 'http://www.yext-test-pageurl.com', - destinationUrl: 'http://www.yext-test-destinationurl.com', - referrerUrl: 'http://www.yext-test-referrerurl.com', - label: 'test-label', - timestamp: new Date(), - bot: false, - browserAgent: { - browser: 'test-browser', - browserVersion: 'test-browser-version', - os: 'test-os', - osVersion: 'test-os-version', - device: 'test-device', - deviceClass: 'test-device-class', - userAgent: 'test-user-agent' - }, - clientSdk: { - sdk: 'version' - }, - internalUser: false, - chat: { - botId: 'analytics-test-bot' - }, - count: 1, - customTags: { - testcustomtag: 'testcustomtagvalue' - }, - customValues: { - testcustomvalue: 1 - }, - entity: 'testEntityId', - ip: { - address: '0.0.0.0', - algorithm: 'HASH' - }, - visitor: { - 'test-id-method': 'visitor-test-id' - } -}); +// const analyticsProvideWithSessionTracking = analytics({ +// authorizationType: 'apiKey', +// authorization: process.env.YEXT_API_KEY +// }).with({ +// action: 'CHAT_LINK_CLICK', +// pageUrl: 'http://www.yext-test-pageurl.com', +// destinationUrl: 'http://www.yext-test-destinationurl.com', +// referrerUrl: 'http://www.yext-test-referrerurl.com', +// label: 'test-label', +// timestamp: new Date(), +// bot: false, +// browserAgent: { +// browser: 'test-browser', +// browserVersion: 'test-browser-version', +// os: 'test-os', +// osVersion: 'test-os-version', +// device: 'test-device', +// deviceClass: 'test-device-class', +// userAgent: 'test-user-agent' +// }, +// clientSdk: { +// sdk: 'version' +// }, +// internalUser: false, +// chat: { +// botId: 'analytics-test-bot' +// }, +// count: 1, +// customTags: { +// testcustomtag: 'testcustomtagvalue' +// }, +// customValues: { +// testcustomvalue: 1 +// }, +// entity: 'testEntityId', +// ip: { +// address: '0.0.0.0', +// algorithm: 'HASH' +// }, +// visitor: { +// 'test-id-method': 'visitor-test-id' +// } +// }); export function fireChatEvent() { analyticsProvider.report(); } -export function fireSearchEvent() { - analyticsProvider.report({ - action: 'PRODUCT', - chat: null, - search: { - searchId: '11111111-1111-1111-1111-111111111111', - queryId: '11111111-1111-1111-1111-111111111111', - verticalKey: 'test-vertical-key', - isDirectAnswer: false, - versionLabel: 'PRODUCTION', - versionNumber: 1, - experienceKey: 'test-experience-key' - } - }); -} +// export function fireSearchEvent() { +// analyticsProvider.report({ +// action: 'PRODUCT', +// chat: null, +// search: { +// searchId: '11111111-1111-1111-1111-111111111111', +// queryId: '11111111-1111-1111-1111-111111111111', +// verticalKey: 'test-vertical-key', +// isDirectAnswer: false, +// versionLabel: 'PRODUCTION', +// versionNumber: 1, +// experienceKey: 'test-experience-key' +// } +// }); +// } -export function firePagesEvent() { - analyticsProvider.report({ - action: 'WEBSITE', - chat: null, - pages: { - siteUid: 123456789, - template: 'test-template' - } - }); -} +// export function firePagesEvent() { +// analyticsProvider.report({ +// action: 'WEBSITE', +// chat: null, +// pages: { +// siteUid: 123456789, +// template: 'test-template' +// } +// }); +// } -export function fireCallToActionEvent() { - analyticsProvider.report({ action: 'CTA_CLICK' }); -} +// export function fireCallToActionEvent() { +// analyticsProvider.report({ action: 'CTA_CLICK' }); +// } -export function fireEventWithSessionTracking() { - analyticsProvideWithSessionTracking.report(); -} +// export function fireEventWithSessionTracking() { +// analyticsProvideWithSessionTracking.report(); +// }