feat(AU-2073): Trigger track event when iframe fails on load (#1407)

* feat(AU-2073): Trigger track event when iframe fails on load

* feat: fix tests

* fix: remove courseId from event

src/courseware/course/sequence/Unit/hooks/useIFrameBehavior.js

@@ -1,4 +1,5 @@
 import { getConfig } from '@edx/frontend-platform';
+import { sendTrackEvent } from '@edx/frontend-platform/analytics';
 import React from 'react';
 import { useDispatch } from 'react-redux';
 
@@ -94,6 +95,10 @@ const useIFrameBehavior = ({
   const handleIFrameLoad = () => {
     if (!hasLoaded) {
       setShowError(true);
+      sendTrackEvent('edx.bi.error.learning.iframe_load_failed', {
+        iframeUrl,
+        unitId: id,
+      });
       logError('Unit iframe failed to load. Server possibly returned 4xx or 5xx response.', {
         iframeUrl,
       });

src/courseware/course/sequence/Unit/hooks/useIFrameBehavior.test.js

@@ -5,6 +5,7 @@ import { getEffects, mockUseKeyedState } from '@edx/react-unit-test-utils';
 import { logError } from '@edx/frontend-platform/logging';
 
 import { getConfig } from '@edx/frontend-platform';
+import { sendTrackEvent } from '@edx/frontend-platform/analytics';
 import { fetchCourse } from '@src/courseware/data';
 import { processEvent } from '@src/course-home/data/thunks';
 import { useEventListener } from '@src/generic/hooks';
@@ -17,6 +18,8 @@ jest.mock('@edx/frontend-platform', () => ({
   getConfig: jest.fn(),
 }));
 
+jest.mock('@edx/frontend-platform/analytics');
+
 jest.mock('react', () => ({
   ...jest.requireActual('react'),
   useEffect: jest.fn(),
@@ -271,6 +274,16 @@ describe('useIFrameBehavior hook', () => {
         expect(state.setState.showError).toHaveBeenCalledWith(true);
         expect(logError).toHaveBeenCalled();
       });
+      it('sends track event if has not loaded', () => {
+        hook = useIFrameBehavior(props);
+        hook.handleIFrameLoad();
+        const eventName = 'edx.bi.error.learning.iframe_load_failed';
+        const eventProperties = {
+          unitId: props.id,
+          iframeUrl: props.iframeUrl,
+        };
+        expect(sendTrackEvent).toHaveBeenCalledWith(eventName, eventProperties);
+      });
       it('does not set/log errors if loaded', () => {
         state.mockVals({ ...defaultStateVals, hasLoaded: true });
         hook = useIFrameBehavior(props);
@@ -278,6 +291,12 @@ describe('useIFrameBehavior hook', () => {
         expect(state.setState.showError).not.toHaveBeenCalled();
         expect(logError).not.toHaveBeenCalled();
       });
+      it('does not send track event if loaded', () => {
+        state.mockVals({ ...defaultStateVals, hasLoaded: true });
+        hook = useIFrameBehavior(props);
+        hook.handleIFrameLoad();
+        expect(sendTrackEvent).not.toHaveBeenCalled();
+      });
       it('registers an event handler to process fetchCourse events.', () => {
         hook = useIFrameBehavior(props);
         hook.handleIFrameLoad();