fix: make host param compulsory (#948)

Description

Make host param compulsory and host should grab from query params when calling postMessage api

VAN-1485

.env

@@ -19,6 +19,7 @@ REGISTER_CONVERSION_COOKIE_NAME=null
 # ***** Links *****
 LOGIN_ISSUE_SUPPORT_LINK=''
 AUTHN_PROGRESSIVE_PROFILING_SUPPORT_LINK=null
+POST_REGISTRATION_REDIRECT_URL=''
 SEARCH_CATALOG_URL=''
 # ***** Features flags *****
 DISABLE_ENTERPRISE_LOGIN=''

src/common-components/RedirectLogistration.jsx

@@ -5,7 +5,7 @@ import PropTypes from 'prop-types';
 import { Redirect } from 'react-router-dom';
 
 import {
-  AUTHN_PROGRESSIVE_PROFILING, DISCOVER_URL, RECOMMENDATIONS, REDIRECT,
+  AUTHN_PROGRESSIVE_PROFILING, RECOMMENDATIONS, REDIRECT,
 } from '../data/constants';
 import { setCookie } from '../data/utils';
 
@@ -20,6 +20,7 @@ const RedirectLogistration = (props) => {
     educationLevel,
     userId,
     registrationEmbedded,
+    host,
   } = props;
   let finalRedirectUrl = '';
 
@@ -40,7 +41,7 @@ const RedirectLogistration = (props) => {
       setCookie('van-504-returning-user', true);
 
       if (registrationEmbedded) {
-        window.parent.postMessage({ action: REDIRECT, redirectUrl: `${window.location.origin}${AUTHN_PROGRESSIVE_PROFILING}` }, DISCOVER_URL);
+        window.parent.postMessage({ action: REDIRECT, redirectUrl: getConfig().POST_REGISTRATION_REDIRECT_URL }, host);
         return null;
       }
       const registrationResult = { redirectUrl: finalRedirectUrl, success };
@@ -88,6 +89,7 @@ RedirectLogistration.defaultProps = {
   redirectToRecommendationsPage: false,
   userId: null,
   registrationEmbedded: false,
+  host: '',
 };
 
 RedirectLogistration.propTypes = {
@@ -100,6 +102,7 @@ RedirectLogistration.propTypes = {
   redirectToRecommendationsPage: PropTypes.bool,
   userId: PropTypes.number,
   registrationEmbedded: PropTypes.bool,
+  host: PropTypes.string,
 };
 
 export default RedirectLogistration;

src/common-components/tests/UnAuthOnlyRoute.test.jsx

@@ -96,7 +96,7 @@ describe('UnAuthOnlyRoute', () => {
     };
 
     delete window.location;
-    window.location = { href: getConfig().BASE_URL.concat(REGISTER_PAGE), search: '?variant=embedded' };
+    window.location = { href: getConfig().BASE_URL.concat(REGISTER_PAGE), search: '?variant=embedded&host=http://localhost/host-websit' };
 
     getAuthenticatedUser.mockReturnValue(user);
     fetchAuthenticatedUser.mockReturnValueOnce(Promise.resolve(user));

src/config/index.js

@@ -14,6 +14,7 @@ const configuration = {
   AUTHN_PROGRESSIVE_PROFILING_SUPPORT_LINK: process.env.AUTHN_PROGRESSIVE_PROFILING_SUPPORT_LINK || null,
   LOGIN_ISSUE_SUPPORT_LINK: process.env.LOGIN_ISSUE_SUPPORT_LINK || null,
   PASSWORD_RESET_SUPPORT_LINK: process.env.PASSWORD_RESET_SUPPORT_LINK || null,
+  POST_REGISTRATION_REDIRECT_URL: process.env.POST_REGISTRATION_REDIRECT_URL || '',
   PRIVACY_POLICY: process.env.PRIVACY_POLICY || null,
   SEARCH_CATALOG_URL: process.env.SEARCH_CATALOG_URL || null,
   TOS_AND_HONOR_CODE: process.env.TOS_AND_HONOR_CODE || null,

src/data/constants.js

@@ -37,6 +37,4 @@ export const INVALID_NAME_REGEX = /[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{
 // Query string parameters that can be passed to LMS to manage
 // things like auto-enrollment upon login and registration.
 export const AUTH_PARAMS = ['course_id', 'enrollment_action', 'course_mode', 'email_opt_in', 'purchase_workflow', 'next', 'save_for_later', 'register_for_free', 'track', 'is_account_recovery', 'variant', 'host'];
-
-export const DISCOVER_URL = 'https://discover.edx.org';
 export const REDIRECT = 'redirect';

src/data/utils/dataUtils.js

@@ -79,5 +79,5 @@ export const windowScrollTo = (options) => {
 
 export const isRegistrationEmbedded = () => {
   const queryParams = getAllPossibleQueryParams();
-  return queryParams?.variant === EMBEDDED;
+  return queryParams?.variant === EMBEDDED && 'host' in queryParams;
 };

src/logistration/Logistration.test.jsx

@@ -11,7 +11,9 @@ import configureStore from 'redux-mock-store';
 import Logistration from './Logistration';
 import { clearThirdPartyAuthContextErrorMessage } from '../common-components/data/actions';
 import { RenderInstitutionButton } from '../common-components/InstitutionLogistration';
-import { COMPLETE_STATE, LOGIN_PAGE, REGISTER_PAGE } from '../data/constants';
+import {
+  COMPLETE_STATE, LOGIN_PAGE, REGISTER_PAGE,
+} from '../data/constants';
 import { backupRegistrationForm } from '../register/data/actions';
 
 jest.mock('@edx/frontend-platform/analytics', () => ({
@@ -61,7 +63,7 @@ describe('Logistration', () => {
 
   it('should not render logistration tabs for embedded registration form', () => {
     delete window.location;
-    window.location = { href: getConfig().BASE_URL.concat(REGISTER_PAGE), search: '?variant=embedded' };
+    window.location = { href: getConfig().BASE_URL.concat(REGISTER_PAGE), search: '?variant=embedded&host=http://localhost/host-website' };
 
     store = mockStore({
       register: {

src/progressive-profiling/tests/ProgressiveProfiling.test.jsx

@@ -296,7 +296,7 @@ describe('ProgressiveProfilingTests', () => {
       window.location = {
         assign: jest.fn().mockImplementation((value) => { window.location.href = value; }),
         href: getConfig().BASE_URL,
-        search: `?variant=${EMBEDDED}`,
+        search: `?variant=${EMBEDDED}&host=http://localhost/host-website`,
       };
       props = {};
       store = mockStore({

src/register/RegistrationPage.jsx

@@ -88,6 +88,7 @@ const RegistrationPage = (props) => {
   const countryList = useMemo(() => getCountryList(getLocale()), []);
   const queryParams = useMemo(() => getAllPossibleQueryParams(), []);
   const registrationEmbedded = isRegistrationEmbedded();
+  const { host } = queryParams;
   const tpaHint = useMemo(() => getTpaHint(), []);
   const flags = {
     showConfigurableEdxFields: getConfig().SHOW_CONFIGURABLE_EDX_FIELDS,
@@ -519,6 +520,7 @@ const RegistrationPage = (props) => {
           <title>{formatMessage(messages['register.page.title'], { siteName: getConfig().SITE_NAME })}</title>
         </Helmet>
         <RedirectLogistration
+          host={host}
           success={registrationResult.success}
           redirectUrl={registrationResult.redirectUrl}
           finishAuthUrl={finishAuthUrl}

src/register/tests/RegistrationPage.test.jsx

@@ -252,7 +252,7 @@ describe('RegistrationPage', () => {
 
     it('should not run validations on blur event when embedded variant is rendered', () => {
       delete window.location;
-      window.location = { href: getConfig().BASE_URL.concat(REGISTER_PAGE), search: '?variant=embedded' };
+      window.location = { href: getConfig().BASE_URL.concat(REGISTER_PAGE), search: '?variant=embedded&host=http://localhost/host-website' };
       const registrationPage = mount(reduxWrapper(<IntlRegistrationPage {...props} />));
 
       registrationPage.find('input#username').simulate('blur', { target: { value: '', name: 'username' } });
@@ -883,7 +883,7 @@ describe('RegistrationPage', () => {
       window.parent.postMessage = jest.fn();
 
       delete window.location;
-      window.location = { href: getConfig().BASE_URL.concat(AUTHN_PROGRESSIVE_PROFILING), search: '?variant=embedded' };
+      window.location = { href: getConfig().BASE_URL.concat(AUTHN_PROGRESSIVE_PROFILING), search: '?variant=embedded&host=http://localhost/host-website' };
 
       store = mockStore({
         ...initialState,