refactor: Replace of injectIntl with useIntl (#1538)
This commit is contained in:
@@ -1,7 +1,6 @@
|
||||
import React from 'react';
|
||||
import { Provider } from 'react-redux';
|
||||
|
||||
import { injectIntl, IntlProvider } from '@edx/frontend-platform/i18n';
|
||||
import { IntlProvider } from '@edx/frontend-platform/i18n';
|
||||
import { fireEvent, render } from '@testing-library/react';
|
||||
import { act } from 'react-dom/test-utils';
|
||||
import { MemoryRouter } from 'react-router-dom';
|
||||
@@ -37,7 +36,6 @@ describe('FormGroup', () => {
|
||||
|
||||
describe('PasswordField', () => {
|
||||
const mockStore = configureStore();
|
||||
const IntlPasswordField = injectIntl(PasswordField);
|
||||
let props = {};
|
||||
let store = {};
|
||||
|
||||
@@ -66,7 +64,7 @@ describe('PasswordField', () => {
|
||||
});
|
||||
|
||||
it('should show/hide password on icon click', () => {
|
||||
const { getByLabelText } = render(reduxWrapper(<IntlPasswordField {...props} />));
|
||||
const { getByLabelText } = render(reduxWrapper(<PasswordField {...props} />));
|
||||
const passwordInput = getByLabelText('Password');
|
||||
|
||||
const showPasswordButton = getByLabelText('Show password');
|
||||
@@ -79,7 +77,7 @@ describe('PasswordField', () => {
|
||||
});
|
||||
|
||||
it('should show password requirement tooltip on focus', async () => {
|
||||
const { getByLabelText } = render(reduxWrapper(<IntlPasswordField {...props} />));
|
||||
const { getByLabelText } = render(reduxWrapper(<PasswordField {...props} />));
|
||||
const passwordInput = getByLabelText('Password');
|
||||
jest.useFakeTimers();
|
||||
await act(async () => {
|
||||
@@ -96,7 +94,7 @@ describe('PasswordField', () => {
|
||||
...props,
|
||||
value: '',
|
||||
};
|
||||
const { getByLabelText } = render(reduxWrapper(<IntlPasswordField {...props} />));
|
||||
const { getByLabelText } = render(reduxWrapper(<PasswordField {...props} />));
|
||||
const passwordInput = getByLabelText('Password');
|
||||
jest.useFakeTimers();
|
||||
await act(async () => {
|
||||
@@ -119,7 +117,7 @@ describe('PasswordField', () => {
|
||||
});
|
||||
|
||||
it('should update password requirement checks', async () => {
|
||||
const { getByLabelText } = render(reduxWrapper(<IntlPasswordField {...props} />));
|
||||
const { getByLabelText } = render(reduxWrapper(<PasswordField {...props} />));
|
||||
const passwordInput = getByLabelText('Password');
|
||||
jest.useFakeTimers();
|
||||
await act(async () => {
|
||||
@@ -142,7 +140,7 @@ describe('PasswordField', () => {
|
||||
});
|
||||
|
||||
it('should not run validations when blur is fired on password icon click', () => {
|
||||
const { container, getByLabelText } = render(reduxWrapper(<IntlPasswordField {...props} />));
|
||||
const { container, getByLabelText } = render(reduxWrapper(<PasswordField {...props} />));
|
||||
const passwordInput = container.querySelector('input[name="password"]');
|
||||
|
||||
const passwordIcon = getByLabelText('Show password');
|
||||
@@ -163,7 +161,7 @@ describe('PasswordField', () => {
|
||||
...props,
|
||||
handleBlur: jest.fn(),
|
||||
};
|
||||
const { container } = render(reduxWrapper(<IntlPasswordField {...props} />));
|
||||
const { container } = render(reduxWrapper(<PasswordField {...props} />));
|
||||
const passwordInput = container.querySelector('input[name="password"]');
|
||||
|
||||
fireEvent.blur(passwordInput, {
|
||||
@@ -181,7 +179,7 @@ describe('PasswordField', () => {
|
||||
...props,
|
||||
handleErrorChange: jest.fn(),
|
||||
};
|
||||
const { container } = render(reduxWrapper(<IntlPasswordField {...props} />));
|
||||
const { container } = render(reduxWrapper(<PasswordField {...props} />));
|
||||
const passwordInput = container.querySelector('input[name="password"]');
|
||||
|
||||
fireEvent.blur(passwordInput, {
|
||||
@@ -204,7 +202,7 @@ describe('PasswordField', () => {
|
||||
handleErrorChange: jest.fn(),
|
||||
};
|
||||
|
||||
const { getByLabelText } = render(reduxWrapper(<IntlPasswordField {...props} />));
|
||||
const { getByLabelText } = render(reduxWrapper(<PasswordField {...props} />));
|
||||
|
||||
const passwordIcon = getByLabelText('Show password');
|
||||
|
||||
@@ -224,7 +222,7 @@ describe('PasswordField', () => {
|
||||
handleErrorChange: jest.fn(),
|
||||
};
|
||||
|
||||
const { getByLabelText } = render(reduxWrapper(<IntlPasswordField {...props} />));
|
||||
const { getByLabelText } = render(reduxWrapper(<PasswordField {...props} />));
|
||||
|
||||
const passwordIcon = getByLabelText('Show password');
|
||||
|
||||
@@ -248,7 +246,7 @@ describe('PasswordField', () => {
|
||||
...props,
|
||||
handleErrorChange: jest.fn(),
|
||||
};
|
||||
const { getByLabelText } = render(reduxWrapper(<IntlPasswordField {...props} />));
|
||||
const { getByLabelText } = render(reduxWrapper(<PasswordField {...props} />));
|
||||
const passwordField = getByLabelText('Password');
|
||||
fireEvent.blur(passwordField, {
|
||||
target: {
|
||||
@@ -268,7 +266,7 @@ describe('PasswordField', () => {
|
||||
handleErrorChange: jest.fn(),
|
||||
handleBlur: jest.fn(),
|
||||
};
|
||||
const { getByLabelText } = render(reduxWrapper(<IntlPasswordField {...props} />));
|
||||
const { getByLabelText } = render(reduxWrapper(<PasswordField {...props} />));
|
||||
|
||||
const passwordIcon = getByLabelText('Show password');
|
||||
|
||||
|
||||
@@ -1,8 +1,7 @@
|
||||
import React from 'react';
|
||||
import { Provider } from 'react-redux';
|
||||
|
||||
import { mergeConfig } from '@edx/frontend-platform';
|
||||
import { configure, injectIntl, IntlProvider } from '@edx/frontend-platform/i18n';
|
||||
import { configure, IntlProvider } from '@edx/frontend-platform/i18n';
|
||||
import {
|
||||
fireEvent, render, screen,
|
||||
} from '@testing-library/react';
|
||||
@@ -26,7 +25,6 @@ jest.mock('react-router-dom', () => ({
|
||||
useNavigate: () => mockedNavigator,
|
||||
}));
|
||||
|
||||
const IntlForgotPasswordPage = injectIntl(ForgotPasswordPage);
|
||||
const mockStore = configureStore();
|
||||
|
||||
const initialState = {
|
||||
@@ -78,7 +76,7 @@ describe('ForgotPasswordPage', () => {
|
||||
);
|
||||
|
||||
it('not should display need other help signing in button', () => {
|
||||
const { queryByTestId } = render(reduxWrapper(<IntlForgotPasswordPage {...props} />));
|
||||
const { queryByTestId } = render(reduxWrapper(<ForgotPasswordPage {...props} />));
|
||||
const forgotPasswordButton = queryByTestId('forgot-password');
|
||||
expect(forgotPasswordButton).toBeNull();
|
||||
});
|
||||
@@ -87,14 +85,14 @@ describe('ForgotPasswordPage', () => {
|
||||
mergeConfig({
|
||||
LOGIN_ISSUE_SUPPORT_LINK: '/support',
|
||||
});
|
||||
render(reduxWrapper(<IntlForgotPasswordPage {...props} />));
|
||||
render(reduxWrapper(<ForgotPasswordPage {...props} />));
|
||||
const forgotPasswordButton = screen.findByText('Need help signing in?');
|
||||
expect(forgotPasswordButton).toBeDefined();
|
||||
});
|
||||
|
||||
it('should display email validation error message', async () => {
|
||||
const validationMessage = 'We were unable to contact you.Enter a valid email address below.';
|
||||
const { container } = render(reduxWrapper(<IntlForgotPasswordPage {...props} />));
|
||||
const { container } = render(reduxWrapper(<ForgotPasswordPage {...props} />));
|
||||
|
||||
const emailInput = screen.getByLabelText('Email');
|
||||
|
||||
@@ -115,7 +113,7 @@ describe('ForgotPasswordPage', () => {
|
||||
const expectedMessage = 'We were unable to contact you.'
|
||||
+ 'An error has occurred. Try refreshing the page, or check your internet connection.';
|
||||
|
||||
const { container } = render(reduxWrapper(<IntlForgotPasswordPage {...props} />));
|
||||
const { container } = render(reduxWrapper(<ForgotPasswordPage {...props} />));
|
||||
|
||||
const alertElements = container.querySelectorAll('.alert-danger');
|
||||
const validationErrors = alertElements[0].textContent;
|
||||
@@ -124,7 +122,7 @@ describe('ForgotPasswordPage', () => {
|
||||
|
||||
it('should display empty email validation message', async () => {
|
||||
const validationMessage = 'We were unable to contact you.Enter your email below.';
|
||||
const { container } = render(reduxWrapper(<IntlForgotPasswordPage {...props} />));
|
||||
const { container } = render(reduxWrapper(<ForgotPasswordPage {...props} />));
|
||||
|
||||
const submitButton = screen.getByText('Submit');
|
||||
fireEvent.click(submitButton);
|
||||
@@ -141,7 +139,7 @@ describe('ForgotPasswordPage', () => {
|
||||
forgotPassword: { status: 'forbidden' },
|
||||
});
|
||||
|
||||
const { container } = render(reduxWrapper(<IntlForgotPasswordPage {...props} />));
|
||||
const { container } = render(reduxWrapper(<ForgotPasswordPage {...props} />));
|
||||
|
||||
const alertElements = container.querySelectorAll('.alert-danger');
|
||||
const validationErrors = alertElements[0].textContent;
|
||||
@@ -149,7 +147,7 @@ describe('ForgotPasswordPage', () => {
|
||||
});
|
||||
|
||||
it('should not display any error message on change event', () => {
|
||||
render(reduxWrapper(<IntlForgotPasswordPage {...props} />));
|
||||
render(reduxWrapper(<ForgotPasswordPage {...props} />));
|
||||
|
||||
const emailInput = screen.getByLabelText('Email');
|
||||
|
||||
@@ -172,7 +170,7 @@ describe('ForgotPasswordPage', () => {
|
||||
};
|
||||
|
||||
store.dispatch = jest.fn(store.dispatch);
|
||||
render(reduxWrapper(<IntlForgotPasswordPage {...props} />));
|
||||
render(reduxWrapper(<ForgotPasswordPage {...props} />));
|
||||
const emailInput = screen.getByLabelText('Email');
|
||||
|
||||
fireEvent.blur(emailInput);
|
||||
@@ -187,7 +185,7 @@ describe('ForgotPasswordPage', () => {
|
||||
emailValidationError: validationMessage,
|
||||
email: '',
|
||||
};
|
||||
const { container } = render(reduxWrapper(<IntlForgotPasswordPage {...props} />));
|
||||
const { container } = render(reduxWrapper(<ForgotPasswordPage {...props} />));
|
||||
const validationElement = container.querySelector('.pgn__form-text-invalid');
|
||||
expect(validationElement.textContent).toEqual(validationMessage);
|
||||
});
|
||||
@@ -205,7 +203,7 @@ describe('ForgotPasswordPage', () => {
|
||||
|
||||
store.dispatch = jest.fn(store.dispatch);
|
||||
|
||||
render(reduxWrapper(<IntlForgotPasswordPage {...props} />));
|
||||
render(reduxWrapper(<ForgotPasswordPage {...props} />));
|
||||
const emailInput = screen.getByLabelText('Email');
|
||||
|
||||
fireEvent.focus(emailInput);
|
||||
@@ -219,7 +217,7 @@ describe('ForgotPasswordPage', () => {
|
||||
emailValidationError: '',
|
||||
email: '',
|
||||
};
|
||||
render(reduxWrapper(<IntlForgotPasswordPage {...props} />));
|
||||
render(reduxWrapper(<ForgotPasswordPage {...props} />));
|
||||
const errorElement = screen.queryByTestId('email-invalid-feedback');
|
||||
expect(errorElement).toBeNull();
|
||||
});
|
||||
@@ -236,7 +234,7 @@ describe('ForgotPasswordPage', () => {
|
||||
+ 'receive a password reset message after 1 minute, verify that you entered the correct email address,'
|
||||
+ ' or check your spam folder. If you need further assistance, contact technical support.';
|
||||
|
||||
const { container } = render(reduxWrapper(<IntlForgotPasswordPage {...props} />));
|
||||
const { container } = render(reduxWrapper(<ForgotPasswordPage {...props} />));
|
||||
const successElement = findByTextContent(container, successMessage);
|
||||
|
||||
expect(successElement).toBeDefined();
|
||||
@@ -254,7 +252,7 @@ describe('ForgotPasswordPage', () => {
|
||||
+ 'This password reset link is invalid. It may have been used already. '
|
||||
+ 'Enter your email below to receive a new link.';
|
||||
|
||||
const { container } = render(reduxWrapper(<IntlForgotPasswordPage {...props} />));
|
||||
const { container } = render(reduxWrapper(<ForgotPasswordPage {...props} />));
|
||||
const successElement = findByTextContent(container, successMessage);
|
||||
|
||||
expect(successElement).toBeDefined();
|
||||
@@ -262,7 +260,7 @@ describe('ForgotPasswordPage', () => {
|
||||
});
|
||||
|
||||
it('should redirect onto login page', async () => {
|
||||
const { container } = render(reduxWrapper(<IntlForgotPasswordPage {...props} />));
|
||||
const { container } = render(reduxWrapper(<ForgotPasswordPage {...props} />));
|
||||
|
||||
const navElement = container.querySelector('nav');
|
||||
const anchorElement = navElement.querySelector('a');
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
import React, { useEffect, useMemo, useState } from 'react';
|
||||
import { useEffect, useMemo, useState } from 'react';
|
||||
import { connect } from 'react-redux';
|
||||
|
||||
import { getConfig } from '@edx/frontend-platform';
|
||||
import { sendPageEvent, sendTrackEvent } from '@edx/frontend-platform/analytics';
|
||||
import { injectIntl, useIntl } from '@edx/frontend-platform/i18n';
|
||||
import { useIntl } from '@edx/frontend-platform/i18n';
|
||||
import {
|
||||
Form, StatefulButton,
|
||||
} from '@openedx/paragon';
|
||||
@@ -365,4 +365,4 @@ export default connect(
|
||||
loginRequest,
|
||||
getTPADataFromBackend: getThirdPartyAuthContext,
|
||||
},
|
||||
)(injectIntl(LoginPage));
|
||||
)(LoginPage);
|
||||
|
||||
@@ -1,7 +1,5 @@
|
||||
import React from 'react';
|
||||
|
||||
import { mergeConfig } from '@edx/frontend-platform';
|
||||
import { injectIntl, IntlProvider } from '@edx/frontend-platform/i18n';
|
||||
import { IntlProvider } from '@edx/frontend-platform/i18n';
|
||||
import {
|
||||
render, screen,
|
||||
} from '@testing-library/react';
|
||||
@@ -9,8 +7,6 @@ import {
|
||||
import AccountActivationMessage from '../AccountActivationMessage';
|
||||
import { ACCOUNT_ACTIVATION_MESSAGE } from '../data/constants';
|
||||
|
||||
const IntlAccountActivationMessage = injectIntl(AccountActivationMessage);
|
||||
|
||||
describe('AccountActivationMessage', () => {
|
||||
beforeEach(() => {
|
||||
mergeConfig({
|
||||
@@ -21,7 +17,7 @@ describe('AccountActivationMessage', () => {
|
||||
it('should match account already activated message', () => {
|
||||
render(
|
||||
<IntlProvider locale="en">
|
||||
<IntlAccountActivationMessage messageType={ACCOUNT_ACTIVATION_MESSAGE.INFO} />
|
||||
<AccountActivationMessage messageType={ACCOUNT_ACTIVATION_MESSAGE.INFO} />
|
||||
</IntlProvider>,
|
||||
);
|
||||
|
||||
@@ -36,7 +32,7 @@ describe('AccountActivationMessage', () => {
|
||||
it('should match account activated success message', () => {
|
||||
render(
|
||||
<IntlProvider locale="en">
|
||||
<IntlAccountActivationMessage messageType={ACCOUNT_ACTIVATION_MESSAGE.SUCCESS} />
|
||||
<AccountActivationMessage messageType={ACCOUNT_ACTIVATION_MESSAGE.SUCCESS} />
|
||||
</IntlProvider>,
|
||||
);
|
||||
|
||||
@@ -53,7 +49,7 @@ describe('AccountActivationMessage', () => {
|
||||
it('should match account activation error message', () => {
|
||||
render(
|
||||
<IntlProvider locale="en">
|
||||
<IntlAccountActivationMessage messageType={ACCOUNT_ACTIVATION_MESSAGE.ERROR} />
|
||||
<AccountActivationMessage messageType={ACCOUNT_ACTIVATION_MESSAGE.ERROR} />
|
||||
</IntlProvider>,
|
||||
);
|
||||
|
||||
@@ -69,7 +65,7 @@ describe('AccountActivationMessage', () => {
|
||||
it('should not display anything for invalid message type', () => {
|
||||
const { container } = render(
|
||||
<IntlProvider locale="en">
|
||||
<IntlAccountActivationMessage messageType="invalid-message" />
|
||||
<AccountActivationMessage messageType="invalid-message" />
|
||||
</IntlProvider>,
|
||||
);
|
||||
|
||||
@@ -88,7 +84,7 @@ describe('EmailConfirmationMessage', () => {
|
||||
it('should match email already confirmed message', () => {
|
||||
render(
|
||||
<IntlProvider locale="en">
|
||||
<IntlAccountActivationMessage messageType={ACCOUNT_ACTIVATION_MESSAGE.INFO} />
|
||||
<AccountActivationMessage messageType={ACCOUNT_ACTIVATION_MESSAGE.INFO} />
|
||||
</IntlProvider>,
|
||||
);
|
||||
|
||||
@@ -103,7 +99,7 @@ describe('EmailConfirmationMessage', () => {
|
||||
it('should match email confirmation success message', () => {
|
||||
render(
|
||||
<IntlProvider locale="en">
|
||||
<IntlAccountActivationMessage messageType={ACCOUNT_ACTIVATION_MESSAGE.SUCCESS} />
|
||||
<AccountActivationMessage messageType={ACCOUNT_ACTIVATION_MESSAGE.SUCCESS} />
|
||||
</IntlProvider>,
|
||||
);
|
||||
const expectedMessage = 'Success! You have confirmed your email.Sign in to continue.';
|
||||
@@ -117,7 +113,7 @@ describe('EmailConfirmationMessage', () => {
|
||||
it('should match email confirmation error message', () => {
|
||||
render(
|
||||
<IntlProvider locale="en">
|
||||
<IntlAccountActivationMessage messageType={ACCOUNT_ACTIVATION_MESSAGE.ERROR} />
|
||||
<AccountActivationMessage messageType={ACCOUNT_ACTIVATION_MESSAGE.ERROR} />
|
||||
</IntlProvider>,
|
||||
);
|
||||
const expectedMessage = 'Your email could not be confirmed'
|
||||
|
||||
@@ -1,9 +1,8 @@
|
||||
import React from 'react';
|
||||
import { Provider } from 'react-redux';
|
||||
|
||||
import { getConfig, mergeConfig } from '@edx/frontend-platform';
|
||||
import { sendPageEvent, sendTrackEvent } from '@edx/frontend-platform/analytics';
|
||||
import { injectIntl, IntlProvider } from '@edx/frontend-platform/i18n';
|
||||
import { IntlProvider } from '@edx/frontend-platform/i18n';
|
||||
import {
|
||||
fireEvent, render, screen, waitFor,
|
||||
} from '@testing-library/react';
|
||||
@@ -24,7 +23,6 @@ jest.mock('@edx/frontend-platform/auth', () => ({
|
||||
getAuthService: jest.fn(),
|
||||
}));
|
||||
|
||||
const IntlLoginPage = injectIntl(LoginPage);
|
||||
const mockStore = configureStore();
|
||||
|
||||
describe('LoginPage', () => {
|
||||
@@ -88,7 +86,7 @@ describe('LoginPage', () => {
|
||||
it('should submit form for valid input', () => {
|
||||
store.dispatch = jest.fn(store.dispatch);
|
||||
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
|
||||
fireEvent.change(screen.getByText(
|
||||
'',
|
||||
@@ -109,7 +107,7 @@ describe('LoginPage', () => {
|
||||
|
||||
it('should not dispatch loginRequest on empty form submission', () => {
|
||||
store.dispatch = jest.fn(store.dispatch);
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
|
||||
fireEvent.click(screen.getByText(
|
||||
'',
|
||||
@@ -128,7 +126,7 @@ describe('LoginPage', () => {
|
||||
});
|
||||
|
||||
store.dispatch = jest.fn(store.dispatch);
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
fireEvent.click(screen.getByText(
|
||||
'',
|
||||
{ selector: '.btn-brand' },
|
||||
@@ -142,7 +140,7 @@ describe('LoginPage', () => {
|
||||
it('should match state for invalid email (less than 2 characters), on form submission', () => {
|
||||
store.dispatch = jest.fn(store.dispatch);
|
||||
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
|
||||
fireEvent.change(screen.getByText(
|
||||
'',
|
||||
@@ -162,7 +160,7 @@ describe('LoginPage', () => {
|
||||
});
|
||||
|
||||
it('should show error messages for required fields on empty form submission', () => {
|
||||
const { container } = render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
const { container } = render(reduxWrapper(<LoginPage {...props} />));
|
||||
fireEvent.click(screen.getByText(
|
||||
'',
|
||||
{ selector: '.btn-brand' },
|
||||
@@ -176,7 +174,7 @@ describe('LoginPage', () => {
|
||||
});
|
||||
|
||||
it('should run frontend validations for emailOrUsername field on form submission', () => {
|
||||
const { container } = render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
const { container } = render(reduxWrapper(<LoginPage {...props} />));
|
||||
|
||||
fireEvent.change(screen.getByText(
|
||||
'',
|
||||
@@ -195,7 +193,7 @@ describe('LoginPage', () => {
|
||||
it('should reset field related error messages on onFocus event', async () => {
|
||||
store.dispatch = jest.fn(store.dispatch);
|
||||
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
|
||||
await act(async () => {
|
||||
// clicking submit button with empty fields to make the errors appear
|
||||
@@ -224,7 +222,7 @@ describe('LoginPage', () => {
|
||||
// ******** test form buttons and links ********
|
||||
|
||||
it('should match default button state', () => {
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(screen.getByText('Sign in')).toBeDefined();
|
||||
});
|
||||
|
||||
@@ -237,7 +235,7 @@ describe('LoginPage', () => {
|
||||
},
|
||||
});
|
||||
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
|
||||
expect(screen.getByText(
|
||||
'pending',
|
||||
@@ -245,7 +243,7 @@ describe('LoginPage', () => {
|
||||
});
|
||||
|
||||
it('should show forgot password link', () => {
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
|
||||
expect(screen.getByText(
|
||||
'Forgot password',
|
||||
@@ -265,7 +263,7 @@ describe('LoginPage', () => {
|
||||
},
|
||||
});
|
||||
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(screen.getByText(
|
||||
'',
|
||||
{ selector: `#${ssoProvider.id}` },
|
||||
@@ -287,7 +285,7 @@ describe('LoginPage', () => {
|
||||
},
|
||||
});
|
||||
|
||||
const { queryByText } = render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
const { queryByText } = render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(queryByText('Company or school credentials')).toBeNull();
|
||||
expect(queryByText('Or sign in with:')).toBeNull();
|
||||
expect(queryByText('Institution/campus credentials')).toBeNull();
|
||||
@@ -307,7 +305,7 @@ describe('LoginPage', () => {
|
||||
},
|
||||
});
|
||||
|
||||
const { queryByText } = render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
const { queryByText } = render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(queryByText('Company or school credentials')).toBeNull();
|
||||
expect(queryByText('Or sign in with:')).toBeNull();
|
||||
});
|
||||
@@ -327,7 +325,7 @@ describe('LoginPage', () => {
|
||||
},
|
||||
});
|
||||
|
||||
const { queryByText } = render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
const { queryByText } = render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(queryByText('Or sign in with:')).toBeDefined();
|
||||
expect(queryByText('Company or school credentials')).toBeDefined();
|
||||
expect(queryByText('Institution/campus credentials')).toBeDefined();
|
||||
@@ -352,7 +350,7 @@ describe('LoginPage', () => {
|
||||
},
|
||||
});
|
||||
|
||||
const { queryByText } = render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
const { queryByText } = render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(queryByText('Or sign in with:')).toBeDefined();
|
||||
expect(queryByText('Company or school credentials')).toBeNull();
|
||||
expect(queryByText('Institution/campus credentials')).toBeDefined();
|
||||
@@ -380,7 +378,7 @@ describe('LoginPage', () => {
|
||||
},
|
||||
});
|
||||
|
||||
const { queryByText } = render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
const { queryByText } = render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(queryByText('Or sign in with:')).toBeDefined();
|
||||
expect(queryByText('Institution/campus credentials')).toBeDefined();
|
||||
|
||||
@@ -400,7 +398,7 @@ describe('LoginPage', () => {
|
||||
},
|
||||
});
|
||||
|
||||
const { queryByText } = render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
const { queryByText } = render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(queryByText('Or sign in with:')).toBeNull();
|
||||
expect(queryByText('Institution/campus credentials')).toBeNull();
|
||||
expect(queryByText('Company or school credentials')).toBeNull();
|
||||
@@ -418,7 +416,7 @@ describe('LoginPage', () => {
|
||||
},
|
||||
});
|
||||
|
||||
const { queryByText } = render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
const { queryByText } = render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(queryByText('Or sign in with:')).toBeDefined();
|
||||
expect(queryByText('Company or school credentials')).toBeNull();
|
||||
expect(queryByText('Institution/campus credentials')).toBeDefined();
|
||||
@@ -441,7 +439,7 @@ describe('LoginPage', () => {
|
||||
},
|
||||
});
|
||||
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(screen.getByText(
|
||||
'',
|
||||
{ selector: '#login-failure-alert' },
|
||||
@@ -465,7 +463,7 @@ describe('LoginPage', () => {
|
||||
+ 'linked '}${ getConfig().SITE_NAME } account. To link your accounts, sign in now using your ${
|
||||
getConfig().SITE_NAME } password.`;
|
||||
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(screen.getByText(
|
||||
'',
|
||||
{ selector: '#tpa-alert' },
|
||||
@@ -484,7 +482,7 @@ describe('LoginPage', () => {
|
||||
},
|
||||
},
|
||||
});
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(screen.getByText(
|
||||
'',
|
||||
{ selector: '#login-failure-alert' },
|
||||
@@ -501,7 +499,7 @@ describe('LoginPage', () => {
|
||||
},
|
||||
});
|
||||
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(screen.getByText(
|
||||
'',
|
||||
{ selector: '#login-failure-alert' },
|
||||
@@ -525,7 +523,7 @@ describe('LoginPage', () => {
|
||||
|
||||
delete window.location;
|
||||
window.location = { href: getConfig().BASE_URL };
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(window.location.href).toBe(dashboardURL);
|
||||
});
|
||||
|
||||
@@ -552,7 +550,7 @@ describe('LoginPage', () => {
|
||||
delete window.location;
|
||||
window.location = { href: getConfig().BASE_URL };
|
||||
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(window.location.href).toBe(getConfig().LMS_BASE_URL + authCompleteUrl);
|
||||
});
|
||||
|
||||
@@ -571,7 +569,7 @@ describe('LoginPage', () => {
|
||||
delete window.location;
|
||||
window.location = { href: getConfig().BASE_URL };
|
||||
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
|
||||
fireEvent.click(screen.getByText(
|
||||
'',
|
||||
@@ -600,7 +598,7 @@ describe('LoginPage', () => {
|
||||
delete window.location;
|
||||
window.location = { href: getConfig().BASE_URL };
|
||||
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(window.location.href).toBe(getConfig().LMS_BASE_URL + finishAuthUrl);
|
||||
});
|
||||
|
||||
@@ -622,7 +620,7 @@ describe('LoginPage', () => {
|
||||
delete window.location;
|
||||
window.location = { href: getConfig().BASE_URL.concat(LOGIN_PAGE), search: `?next=/dashboard&tpa_hint=${ssoProvider.id}` };
|
||||
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(screen.getByText(
|
||||
'',
|
||||
{ selector: `#${ssoProvider.id}` },
|
||||
@@ -649,7 +647,7 @@ describe('LoginPage', () => {
|
||||
delete window.location;
|
||||
window.location = { href: getConfig().BASE_URL.concat(LOGIN_PAGE), search: `?next=/dashboard&tpa_hint=${ssoProvider.id}` };
|
||||
|
||||
const { container } = render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
const { container } = render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(container.querySelector('.react-loading-skeleton')).toBeTruthy();
|
||||
});
|
||||
|
||||
@@ -671,7 +669,7 @@ describe('LoginPage', () => {
|
||||
window.location = { href: getConfig().BASE_URL.concat(LOGIN_PAGE), search: `?next=/dashboard&tpa_hint=${secondaryProviders.id}` };
|
||||
secondaryProviders.iconImage = null;
|
||||
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(window.location.href).toEqual(getConfig().LMS_BASE_URL + secondaryProviders.loginUrl);
|
||||
});
|
||||
|
||||
@@ -691,7 +689,7 @@ describe('LoginPage', () => {
|
||||
delete window.location;
|
||||
window.location = { href: getConfig().BASE_URL.concat(LOGIN_PAGE), search: '?next=/dashboard&tpa_hint=invalid' };
|
||||
|
||||
const { container } = render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
const { container } = render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(container.querySelector(`#${ssoProvider.id}`).querySelector('#provider-name').textContent).toEqual(`${ssoProvider.name}`);
|
||||
|
||||
mergeConfig({
|
||||
@@ -715,7 +713,7 @@ describe('LoginPage', () => {
|
||||
delete window.location;
|
||||
window.location = { href: getConfig().BASE_URL.concat(LOGIN_PAGE), search: `?tpa_hint=${ssoProvider.id}` };
|
||||
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(screen.getByText(
|
||||
'Show me other ways to sign in or register',
|
||||
).textContent).toBeDefined();
|
||||
@@ -741,7 +739,7 @@ describe('LoginPage', () => {
|
||||
delete window.location;
|
||||
window.location = { href: getConfig().BASE_URL.concat(LOGIN_PAGE), search: `?tpa_hint=${ssoProvider.id}` };
|
||||
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(screen.getByText(
|
||||
'Show me other ways to sign in',
|
||||
).textContent).toBeDefined();
|
||||
@@ -750,7 +748,7 @@ describe('LoginPage', () => {
|
||||
// ******** miscellaneous tests ********
|
||||
|
||||
it('should send page event when login page is rendered', () => {
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(sendPageEvent).toHaveBeenCalledWith('login_and_registration', 'login');
|
||||
});
|
||||
|
||||
@@ -764,7 +762,7 @@ describe('LoginPage', () => {
|
||||
});
|
||||
|
||||
store.dispatch = jest.fn(store.dispatch);
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(store.dispatch).toHaveBeenCalledWith(backupLoginFormBegin(
|
||||
{
|
||||
formFields: {
|
||||
@@ -778,7 +776,7 @@ describe('LoginPage', () => {
|
||||
});
|
||||
|
||||
it('should send track event when forgot password link is clicked', () => {
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
fireEvent.click(screen.getByText(
|
||||
'Forgot password',
|
||||
{ selector: '#forgot-password' },
|
||||
@@ -797,7 +795,7 @@ describe('LoginPage', () => {
|
||||
});
|
||||
|
||||
store.dispatch = jest.fn(store.dispatch);
|
||||
render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(store.dispatch).toHaveBeenCalledWith(backupLoginFormBegin(
|
||||
{
|
||||
formFields: {
|
||||
@@ -826,7 +824,7 @@ describe('LoginPage', () => {
|
||||
},
|
||||
});
|
||||
|
||||
const { container } = render(reduxWrapper(<IntlLoginPage {...props} />));
|
||||
const { container } = render(reduxWrapper(<LoginPage {...props} />));
|
||||
expect(container.querySelector('input#emailOrUsername').value).toEqual('john_doe');
|
||||
expect(container.querySelector('input#password').value).toEqual('test-password');
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user