diff --git a/src/common-components/RedirectLogistration.jsx b/src/common-components/RedirectLogistration.jsx index 24603f6a7d..05ba98e753 100644 --- a/src/common-components/RedirectLogistration.jsx +++ b/src/common-components/RedirectLogistration.jsx @@ -1,7 +1,10 @@ +import { useSelector } from 'react-redux'; + import { getConfig } from '@edx/frontend-platform'; import PropTypes from 'prop-types'; import { Navigate } from 'react-router-dom'; +import trackCohesionEvent from '../cohesion/trackers'; import { AUTHN_PROGRESSIVE_PROFILING, RECOMMENDATIONS, REDIRECT, } from '../data/constants'; @@ -21,9 +24,12 @@ const RedirectLogistration = (props) => { registrationEmbedded, host, } = props; + const cohesionEventData = useSelector(state => state.cohesion.eventData); let finalRedirectUrl = ''; if (success) { + // This event is used by cohestion upon successful login + trackCohesionEvent(cohesionEventData); // If we're in a third party auth pipeline, we must complete the pipeline // once user has successfully logged in. Otherwise, redirect to the specified redirect url. // Note: For multiple enterprise use case, we need to make sure that user first visits the diff --git a/src/login/LoginPage.jsx b/src/login/LoginPage.jsx index 107541b891..27b97e60fa 100644 --- a/src/login/LoginPage.jsx +++ b/src/login/LoginPage.jsx @@ -1,5 +1,5 @@ import React, { useEffect, useMemo, useState } from 'react'; -import { connect, useDispatch, useSelector } from 'react-redux'; +import { connect, useDispatch } from 'react-redux'; import { getConfig } from '@edx/frontend-platform'; import { injectIntl, useIntl } from '@edx/frontend-platform/i18n'; @@ -24,7 +24,6 @@ import { ELEMENT_NAME, ELEMENT_TEXT, ELEMENT_TYPES, PAGE_TYPES, } from '../cohesion/constants'; import { setCohesionEventStates } from '../cohesion/data/actions'; -import trackCohesionEvent from '../cohesion/trackers'; import { FormGroup, InstitutionLogistration, @@ -78,7 +77,6 @@ const LoginPage = (props) => { const dispatch = useDispatch(); const activationMsgType = getActivationStatus(); const queryParams = useMemo(() => getAllPossibleQueryParams(), []); - const cohesionEventData = useSelector(state => state.cohesion.eventData); const [formFields, setFormFields] = useState({ ...backedUpFormData.formFields }); const [errorCode, setErrorCode] = useState({ type: '', count: 0, context: {} }); @@ -92,13 +90,10 @@ const LoginPage = (props) => { useEffect(() => { if (loginResult.success) { trackLoginSuccess(); - // This event is used by cohestion upon successful login - trackCohesionEvent(cohesionEventData); - // Remove this cookie that was set to capture marketingEmailsOptIn for the onboarding component removeCookie('ssoPipelineRedirectionDone'); } - }, [loginResult, cohesionEventData]); + }, [loginResult]); useEffect(() => { const payload = { ...queryParams }; diff --git a/src/progressive-profiling/tests/ProgressiveProfiling.test.jsx b/src/progressive-profiling/tests/ProgressiveProfiling.test.jsx index c5786b2e2b..2654aa7961 100644 --- a/src/progressive-profiling/tests/ProgressiveProfiling.test.jsx +++ b/src/progressive-profiling/tests/ProgressiveProfiling.test.jsx @@ -11,6 +11,7 @@ import { import { MemoryRouter, mockNavigate, useLocation } from 'react-router-dom'; import configureStore from 'redux-mock-store'; +import mockTagular from '../../cohesion/utils'; import { APP_NAME, AUTHN_PROGRESSIVE_PROFILING, @@ -25,6 +26,7 @@ import ProgressiveProfiling from '../ProgressiveProfiling'; const IntlProgressiveProfilingPage = injectIntl(ProgressiveProfiling); const mockStore = configureStore(); +mockTagular(); jest.mock('@edx/frontend-platform/analytics', () => ({ sendPageEvent: jest.fn(), @@ -55,6 +57,13 @@ jest.mock('react-router-dom', () => { }; }); +const eventData = { + pageType: 'test-page', + elementType: 'test-element-type', + webElementText: 'test-element-text', + webElementName: 'test-element-name', +}; + describe('ProgressiveProfilingTests', () => { let store = {}; @@ -252,6 +261,9 @@ describe('ProgressiveProfilingTests', () => { ...initialState.welcomePage, success: true, }, + cohesion: { + eventData, + }, }); const { container } = render(reduxWrapper()); const nextButton = container.querySelector('button.btn-brand'); @@ -278,6 +290,9 @@ describe('ProgressiveProfilingTests', () => { ...initialState.welcomePage, success: true, }, + cohesion: { + eventData, + }, }); const { container } = render(reduxWrapper()); @@ -421,6 +436,9 @@ describe('ProgressiveProfilingTests', () => { ...initialState.welcomePage, success: true, }, + cohesion: { + eventData, + }, }); render(reduxWrapper());