Add specs to data tracking event

app/assets/javascripts/pages/sessions/new/index.js

@@ -22,12 +22,15 @@ document.addEventListener('DOMContentLoaded', () => {
   preserveUrlFragment(window.location.hash);
 });
 
-if (gon.tracking_data) {
+export default function trackData() {
+  if (gon.tracking_data) {
+    const tab = document.querySelector(".new-session-tabs a[href='#register-pane']");
     const { category, action, ...data } = gon.tracking_data;
 
-  $('#signin-container a[data-toggle="tab"]').on('shown.bs.tab', e => {
-    if (e.target.dataset.qaSelector === 'register_tab') {
+    tab.addEventListener('click', () => {
       Tracking.event(category, action, data);
-    }
     });
+  }
 }
+
+trackData();

spec/frontend/fixtures/static/signin_tabs.html

@@ -5,4 +5,7 @@
 <li>
 <a href="#login-pane">Standard</a>
 </li>
+<li>
+<a href="#register-pane">Register</a>
+</li>
 </ul>

spec/javascripts/signin_tabs_memoizer_spec.js

 import AccessorUtilities from '~/lib/utils/accessor';
 import SigninTabsMemoizer from '~/pages/sessions/new/signin_tabs_memoizer';
+import trackData from '~/pages/sessions/new/index';
+import Tracking from '~/tracking';
 
 describe('SigninTabsMemoizer', () => {
   const fixtureTemplate = 'static/signin_tabs.html';
@@ -93,6 +95,50 @@ describe('SigninTabsMemoizer', () => {
     });
   });
 
+  describe('trackData', () => {
+    beforeEach(() => {
+      spyOn(Tracking, 'event');
+    });
+
+    describe('with tracking data', () => {
+      beforeEach(() => {
+        gon.tracking_data = {
+          category: 'Growth::Acquisition::Experiment::SignUpFlow',
+          action: 'start',
+          label: 'uuid',
+          property: 'control_group',
+        };
+        trackData();
+      });
+
+      it('should track data when the "click" event of the register tab is triggered', () => {
+        document.querySelector('a[href="#register-pane"]').click();
+
+        expect(Tracking.event).toHaveBeenCalledWith(
+          'Growth::Acquisition::Experiment::SignUpFlow',
+          'start',
+          {
+            label: 'uuid',
+            property: 'control_group',
+          },
+        );
+      });
+    });
+
+    describe('without tracking data', () => {
+      beforeEach(() => {
+        gon.tracking_data = undefined;
+        trackData();
+      });
+
+      it('should not track data when the "click" event of the register tab is triggered', () => {
+        document.querySelector('a[href="#register-pane"]').click();
+
+        expect(Tracking.event).not.toHaveBeenCalled();
+      });
+    });
+  });
+
   describe('saveData', () => {
     beforeEach(() => {
       memo = {