@customerio/cdp-analytics-browser 0.2.3 → 0.3.1

package/src/browser/standalone-analytics.ts

@@ -1,30 +1,19 @@
-import { Analytics, InitOptions } from '../core/analytics'
 import { AnalyticsBrowser } from '.'
 import { embeddedWriteKey } from '../lib/embedded-write-key'
-
-export interface AnalyticsSnippet extends AnalyticsStandalone {
-  load: (writeKey: string, options?: InitOptions) => void
-}
-
-export interface AnalyticsStandalone extends Analytics {
-  _loadOptions?: InitOptions
-  _writeKey?: string
-  _cdn?: string
-}
-
-declare global {
-  interface Window {
-    analytics: AnalyticsSnippet
-  }
-}
+import { AnalyticsSnippet } from './standalone-interface'
+import {
+  getGlobalAnalytics,
+  setGlobalAnalytics,
+} from '../lib/global-analytics-helper'
 
 function getWriteKey(): string | undefined {
   if (embeddedWriteKey()) {
     return embeddedWriteKey()
   }
 
-  if (window.analytics._writeKey) {
-    return window.analytics._writeKey
+  const analytics = getGlobalAnalytics()
+  if (analytics?._writeKey) {
+    return analytics._writeKey
   }
 
   const regex = /http.*\/analytics\.js\/v1\/([^/]*)(\/platform)?\/analytics.*/
@@ -59,7 +48,7 @@ function getWriteKey(): string | undefined {
 
 export async function install(): Promise<void> {
   const writeKey = getWriteKey()
-  const options = window.analytics?._loadOptions ?? {}
+  const options = getGlobalAnalytics()?._loadOptions ?? {}
   if (!writeKey) {
     console.error(
       'Failed to load Write Key. Make sure to use the latest version of the snippet, which can be found in your source settings.'
@@ -67,8 +56,7 @@ export async function install(): Promise<void> {
     return
   }
 
-  window.analytics = (await AnalyticsBrowser.standalone(
-    writeKey,
-    options
-  )) as AnalyticsSnippet
+  setGlobalAnalytics(
+    (await AnalyticsBrowser.standalone(writeKey, options)) as AnalyticsSnippet
+  )
 }

package/src/browser/standalone-interface.ts

@@ -0,0 +1,11 @@
+import { Analytics, InitOptions } from '../core/analytics'
+
+export interface AnalyticsSnippet extends AnalyticsStandalone {
+  load: (writeKey: string, options?: InitOptions) => void
+}
+
+export interface AnalyticsStandalone extends Analytics {
+  _loadOptions?: InitOptions
+  _writeKey?: string
+  _cdn?: string
+}

package/src/browser/standalone.ts

@@ -2,6 +2,17 @@
 import { getCDN, setGlobalCDNUrl } from '../lib/parse-cdn'
 import { setVersionType } from '../plugins/customerio/normalize'
 
+// The global analytics key must be set first so that subsequent calls to getCdn() fetch the CDN from the correct instance.
+const globalAnalyticsKey = (
+  document.querySelector(
+    'script[data-global-customerio-analytics-key]'
+  ) as HTMLScriptElement
+)?.dataset.globalCustomerioAnalyticsKey
+
+if (globalAnalyticsKey) {
+  setGlobalAnalyticsKey(globalAnalyticsKey)
+}
+
 if (process.env.ASSET_PATH) {
   if (process.env.ASSET_PATH === '/dist/umd/') {
     // @ts-ignore
@@ -25,6 +36,7 @@ import { shouldPolyfill } from '../lib/browser-polyfill'
 import { RemoteMetrics } from '../core/stats/remote-metrics'
 import { embeddedWriteKey } from '../lib/embedded-write-key'
 import { onCSPError } from '../lib/csp-detection'
+import { setGlobalAnalyticsKey } from '../lib/global-analytics-helper'
 
 function onError(err?: unknown) {
   console.error('[analytics.js]', 'Failed to load Analytics.js', err)

package/src/core/analytics/index.ts

@@ -48,6 +48,7 @@ import { version } from '../../generated/version'
 import { PriorityQueue } from '../../lib/priority-queue'
 import { getGlobal } from '../../lib/get-global'
 import { AnalyticsClassic, AnalyticsCore } from './interfaces'
+import { setGlobalAnalytics } from '../../lib/global-analytics-helper'
 
 const deprecationWarning =
   'This is being deprecated and will be not be available in future releases of Analytics JS'
@@ -102,6 +103,11 @@ export interface InitOptions {
     aid?: RegExp
     uid?: RegExp
   }
+  /**
+   * When using the snippet, this is the key that points to the global analytics instance (e.g. window.analytics).
+   * default: analytics
+   */
+  globalAnalyticsKey?: string
 }
 
 /* analytics-classic stubs */
@@ -468,7 +474,7 @@ export class Analytics
 
   noConflict(): Analytics {
     console.warn(deprecationWarning)
-    window.analytics = _analytics ?? this
+    setGlobalAnalytics(_analytics ?? this)
     return this
   }
 

package/src/core/buffer/snippet.ts

@@ -3,6 +3,7 @@ import type {
   PreInitMethodName,
   PreInitMethodParams,
 } from '.'
+import { getGlobalAnalytics } from '../../lib/global-analytics-helper'
 
 export function transformSnippetCall([
   methodName,
@@ -29,14 +30,16 @@ type SnippetWindowBufferedMethodCall<
  * A list of the method calls before initialization for snippet users
  * For example, [["track", "foo", {bar: 123}], ["page"], ["on", "ready", function(){..}]
  */
-type SnippetBuffer = SnippetWindowBufferedMethodCall[]
+export type SnippetBuffer = SnippetWindowBufferedMethodCall[]
 
 /**
  * Fetch the buffered method calls from the window object and normalize them.
  * This removes existing buffered calls from the window object.
  */
-export const popSnippetWindowBuffer = (): PreInitMethodCall[] => {
-  const wa = window.analytics
+export const popSnippetWindowBuffer = (
+  buffer: unknown = getGlobalAnalytics()
+): PreInitMethodCall[] => {
+  const wa = buffer
   if (!Array.isArray(wa)) return []
   const buffered = wa.splice(0, wa.length)
   return normalizeSnippetBuffer(buffered)

package/src/generated/version.ts

@@ -1,2 +1,2 @@
 // This file is generated.
-export const version = '0.2.3'
+export const version = '0.3.1'

package/src/index.ts

@@ -8,5 +8,5 @@ export * from './core/plugin'
 export * from './core/user'
 
 export * from './plugins/in-app-plugin'
-
-export type { AnalyticsSnippet } from './browser/standalone-analytics'
+export type { AnalyticsSnippet } from './browser/standalone-interface'
+export { getGlobalAnalytics } from './lib/global-analytics-helper'

package/src/lib/global-analytics-helper.ts

@@ -0,0 +1,31 @@
+import { AnalyticsSnippet } from '../browser/standalone-interface'
+
+/**
+ * Stores the global window analytics key
+ */
+let _globalAnalyticsKey = 'analytics'
+
+/**
+ * Gets the global analytics/buffer
+ * @param key name of the window property where the buffer is stored (default: analytics)
+ * @returns AnalyticsSnippet
+ */
+export function getGlobalAnalytics(): AnalyticsSnippet | undefined {
+  return (window as any)[_globalAnalyticsKey]
+}
+
+/**
+ * Replaces the global window key for the analytics/buffer object
+ * @param key key name
+ */
+export function setGlobalAnalyticsKey(key: string) {
+  _globalAnalyticsKey = key
+}
+
+/**
+ * Sets the global analytics object
+ * @param analytics analytics snippet
+ */
+export function setGlobalAnalytics(analytics: AnalyticsSnippet): void {
+  ;(window as any)[_globalAnalyticsKey] = analytics
+}

package/src/lib/parse-cdn.ts

@@ -1,33 +1,40 @@
+import { getGlobalAnalytics } from './global-analytics-helper'
 import { embeddedWriteKey } from './embedded-write-key'
 
 const analyticsScriptRegex =
-  /(https:\/\/[\w.-]+)\/(?:analytics\.js\/v1|v1\/analytics-js\/snippet)\/[\w-:]+\/(analytics\.(?:min)\.js)/
+  /(https?:\/\/[\w.\-:]+)\/(?:analytics\.js\/v1|v1\/analytics-js\/snippet)\/[\w\-:]+\/(analytics\.(?:min)\.js)/
 
 const getCDNUrlFromScriptTag = (): string | undefined => {
   let cdn: string | undefined
   const scripts = Array.prototype.slice.call(
     document.querySelectorAll('script')
   )
-  scripts.forEach((s) => {
+  for (const s of scripts) {
     const src = s.getAttribute('src') ?? ''
     const result = analyticsScriptRegex.exec(src)
 
     if (result && result[1]) {
       cdn = result[1]
     }
-  })
+
+    // If the script tag has the globalCustomerioAnalyticsKey attribute, then this is a CDP script (not segment).
+    if (s.dataset?.globalCustomerioAnalyticsKey != null) {
+      break
+    }
+  }
   return cdn
 }
 
 let _globalCDN: string | undefined // set globalCDN as in-memory singleton
 const getGlobalCDNUrl = (): string | undefined => {
-  const result = _globalCDN ?? window.analytics?._cdn
+  const result = _globalCDN ?? getGlobalAnalytics()?._cdn
   return result
 }
 
 export const setGlobalCDNUrl = (cdn: string) => {
-  if (window.analytics) {
-    window.analytics._cdn = cdn
+  const globalAnalytics = getGlobalAnalytics()
+  if (globalAnalytics) {
+    globalAnalytics._cdn = cdn
   }
   _globalCDN = cdn
 }
@@ -61,7 +68,7 @@ export const getNextIntegrationsURL = () => {
  * @returns the path to Analytics JS 1.0
  **/
 export function getLegacyAJSPath(): string {
-  const writeKey = embeddedWriteKey() ?? window.analytics._writeKey
+  const writeKey = embeddedWriteKey() ?? getGlobalAnalytics()?._writeKey
 
   const scripts = Array.prototype.slice.call(
     document.querySelectorAll('script')

package/src/plugins/in-app-plugin/index.ts

@@ -36,7 +36,7 @@ export function InAppPlugin(
             allEvents.forEach((event) => {
                 _eventTarget.addEventListener(event, settings?.events as EventListenerOrEventListenerObject);
             });
-            ['messageShown', 'messageDismissed', 'messageError'].forEach((event) => {
+            ['messageDismissed', 'messageError'].forEach((event) => {
                 Gist.events.on(event, (message: any) => {
                     _eventTarget.dispatchEvent(newEvent(gistToCIO(event), { 
                         messageId: message.messageId,
@@ -48,6 +48,17 @@ export function InAppPlugin(
 
         Gist.events.on('messageShown', (message: any) => {
             const deliveryId:string = message?.properties?.gist?.campaignId;
+            if (settings.events) {
+                _eventTarget.dispatchEvent(newEvent(InAppEvents.MessageOpened, { 
+                    messageId: message?.messageId,
+                    deliveryId: deliveryId,
+                    message: {
+                        dismiss: function() {
+                            Gist.dismissMessage(message?.instanceId);
+                        }
+                    }
+                }));
+            }
             if (typeof deliveryId != 'undefined' && deliveryId != '') {
                 _analytics.track(JourneysEvents.Metric, {
                     'deliveryId': deliveryId,
@@ -68,10 +79,25 @@ export function InAppPlugin(
         });
 
         Gist.events.on('messageAction', (params: any) => {
+            const deliveryId:string = params?.message?.properties?.gist?.campaignId;
+            if (settings.events) {
+                _eventTarget.dispatchEvent(newEvent(InAppEvents.MessageAction, {
+                    messageId: params.message.messageId,
+                    deliveryId: deliveryId,
+                    action: params.action,
+                    name: params.name,
+                    actionName: params.name,
+                    actionValue: params.action,
+                    message: {
+                        dismiss: function() {
+                            Gist.dismissMessage(params.message.instanceId);
+                        }
+                    }
+                }));
+            }
             if (params.action == 'gist://close') {
                 return;
             }
-            const deliveryId:string = params?.message?.properties?.gist?.campaignId;
             if (typeof deliveryId != 'undefined' && deliveryId != '') {
                 _analytics.track(JourneysEvents.Metric, {
                     'deliveryId': deliveryId,
@@ -79,21 +105,6 @@ export function InAppPlugin(
                     'actionName': params.name,
                     'actionValue': params.action,
                 });
-                if (settings.events) {
-                    _eventTarget.dispatchEvent(newEvent(InAppEvents.MessageAction, {
-                        messageId: params.message.messageId,
-                        deliveryId: deliveryId,
-                        action: params.action,
-                        name: params.name,
-                        actionName: params.name,
-                        actionValue: params.action,
-                        message:{
-                            dismiss: function() {
-                                Gist.dismissMessage(params?.message?.instanceId);
-                            }
-                        }
-                    }));
-                }
                 return;
             }
             const broadcastId:Number = params?.message?.properties?.gist?.broadcast?.broadcastIdInt;