Mixpanel analytics should not be a class

Author: rzane

src/mixpanelAnalytics.test.ts

@@ -1,23 +1,23 @@
 import Assignment from './assignment';
-import MixpanelAnalytics from './mixpanelAnalytics';
+import { mixpanelAnalytics } from './mixpanelAnalytics';
 
-describe('MixpanelAnalytics', () => {
+const mixpanel = {
+  track: vi.fn(),
+  alias: vi.fn(),
+  identify: vi.fn()
+};
+
+describe('mixpanelAnalytics', () => {
   beforeEach(() => {
-    window.mixpanel = {
-      track: vi.fn(),
-      alias: vi.fn(),
-      identify: vi.fn()
-    };
+    window.mixpanel = mixpanel;
   });
 
   afterEach(() => {
-    // @ts-expect-error Cleaning up test property
     delete window.mixpanel;
   });
 
   describe('#trackAssignment()', () => {
-    it('calls window.mixpanel.track()', () => {
-      const mixpanelAnalytics = new MixpanelAnalytics();
+    it('calls mixpanel.track()', () => {
       const assignment = new Assignment({
         splitName: 'jabba',
         variant: 'cgi',
@@ -26,8 +26,8 @@ describe('MixpanelAnalytics', () => {
       });
 
       mixpanelAnalytics.trackAssignment('visitor_id', assignment, () => {
-        expect(window.mixpanel.track).toHaveBeenCalled();
-        expect(window.mixpanel.track).toHaveBeenCalledWith(
+        expect(mixpanel.track).toHaveBeenCalled();
+        expect(mixpanel.track).toHaveBeenCalledWith(
           'SplitAssigned',
           {
             TTVisitorID: 'visitor_id',
@@ -40,27 +40,25 @@ describe('MixpanelAnalytics', () => {
       });
 
       // call success
-      vi.mocked(window.mixpanel.track).mock.calls[0][2](true);
+      vi.mocked(mixpanel.track).mock.calls[0][2](true);
     });
   });
 
   describe('#alias()', () => {
-    it('calls window.mixpanel.alias()', () => {
-      const mixpanelAnalytics = new MixpanelAnalytics();
+    it('calls mixpanel.alias()', () => {
       mixpanelAnalytics.alias('id');
 
-      expect(window.mixpanel.alias).toHaveBeenCalled();
-      expect(window.mixpanel.alias).toHaveBeenCalledWith('id');
+      expect(mixpanel.alias).toHaveBeenCalled();
+      expect(mixpanel.alias).toHaveBeenCalledWith('id');
     });
   });
 
   describe('#identify()', () => {
-    it('calls window.mixpanel.identify()', () => {
-      const mixpanelAnalytics = new MixpanelAnalytics();
+    it('calls mixpanel.identify()', () => {
       mixpanelAnalytics.identify('id');
 
-      expect(window.mixpanel.identify).toHaveBeenCalled();
-      expect(window.mixpanel.identify).toHaveBeenCalledWith('id');
+      expect(mixpanel.identify).toHaveBeenCalled();
+      expect(mixpanel.identify).toHaveBeenCalledWith('id');
     });
   });
 });

src/mixpanelAnalytics.ts

@@ -1,4 +1,3 @@
-import Assignment from './assignment';
 import type { AnalyticsProvider } from './analyticsProvider';
 
 type EventProperties = {
@@ -10,38 +9,29 @@ type EventProperties = {
 
 declare global {
   interface Window {
-    mixpanel: {
+    mixpanel?: {
       track(eventName: string, properties: EventProperties, callback: (value: boolean) => void): void;
       identify(id: string): void;
       alias(id: string): void;
     };
   }
 }
 
-class MixpanelAnalytics implements AnalyticsProvider {
-  trackAssignment(visitorId: string, assignment: Assignment, callback: (value: boolean) => void) {
+export const mixpanelAnalytics: AnalyticsProvider = {
+  trackAssignment(visitorId, assignment, callback) {
     const assignmentProperties = {
       TTVisitorID: visitorId,
       SplitName: assignment.getSplitName(),
       SplitVariant: assignment.getVariant(),
       SplitContext: assignment.getContext()
     };
 
-    if (window.mixpanel) {
-      window.mixpanel.track('SplitAssigned', assignmentProperties, callback);
-    }
-  }
-
+    window.mixpanel?.track('SplitAssigned', assignmentProperties, callback);
+  },
   identify(visitorId: string) {
-    if (window.mixpanel) {
-      window.mixpanel.identify(visitorId);
-    }
-  }
-
+    window.mixpanel?.identify(visitorId);
+  },
   alias(visitorId: string) {
-    if (window.mixpanel) {
-      window.mixpanel.alias(visitorId);
-    }
+    window.mixpanel?.alias(visitorId);
   }
-}
-export default MixpanelAnalytics;
+};

src/visitor.test.ts

@@ -1,14 +1,15 @@
 import Assignment from './assignment';
 import { sendAssignmentNotification } from './assignmentNotification';
 import { saveIdentifier } from './identifier';
-import MixpanelAnalytics from './mixpanelAnalytics';
+import { mixpanelAnalytics } from './mixpanelAnalytics';
 import type { Config } from './config';
 import { calculateVariant } from './calculateVariant';
 import Visitor from './visitor';
 import { v4 as uuid } from 'uuid';
 import { createConfig } from './test-utils';
 import { http, HttpResponse } from 'msw';
 import { server, requests } from './setupTests';
+import type { AnalyticsProvider } from './analyticsProvider';
 
 vi.mock('uuid');
 vi.mock('./calculateVariant');
@@ -643,11 +644,24 @@ describe('Visitor', () => {
     });
   });
 
+  describe('.analytics', () => {
+    it('defaults to mixpanel analytics', () => {
+      const config = setupConfig();
+      const visitor = createVisitor(config);
+
+      expect(visitor.analytics).toBe(mixpanelAnalytics);
+    });
+  });
+
   describe('#setAnalytics()', () => {
     it('sets the analytics object on the visitor', () => {
       const config = setupConfig();
       const visitor = createVisitor(config);
-      const analytics = new MixpanelAnalytics();
+      const analytics: AnalyticsProvider = {
+        trackAssignment: vi.fn(),
+        alias: vi.fn(),
+        identify: vi.fn()
+      };
 
       visitor.setAnalytics(analytics);
 

src/visitor.ts

@@ -3,11 +3,12 @@ import { getABVariants } from './abConfiguration';
 import Assignment from './assignment';
 import { sendAssignmentNotification } from './assignmentNotification';
 import { saveIdentifier } from './identifier';
-import MixpanelAnalytics from './mixpanelAnalytics';
+import { mixpanelAnalytics } from './mixpanelAnalytics';
 import { v4 as uuid } from 'uuid';
 import { calculateVariant } from './calculateVariant';
 import { vary, type Variants } from './vary';
 import type { Config } from './config';
+import type { AnalyticsProvider } from './analyticsProvider';
 
 export type VaryOptions = {
   variants: Variants;
@@ -85,7 +86,7 @@ class Visitor {
   private _errorLogger: (errorMessage: string) => void;
   private _assignmentRegistry?: AssignmentRegistry | null;
 
-  public analytics: MixpanelAnalytics;
+  public analytics: AnalyticsProvider;
 
   constructor({ config, id, assignments, ttOffline }: VisitorOptions) {
     this.config = config;
@@ -97,7 +98,7 @@ class Visitor {
       window.console.error(errorMessage);
     };
 
-    this.analytics = new MixpanelAnalytics();
+    this.analytics = mixpanelAnalytics;
   }
 
   getId() {
@@ -181,7 +182,7 @@ class Visitor {
     this.notifyUnsyncedAssignments();
   }
 
-  setAnalytics(analytics: MixpanelAnalytics) {
+  setAnalytics(analytics: AnalyticsProvider) {
     this.analytics = analytics;
   }