From 35adc8eaf39f8db33f55c58b1edad9cf6c8dbf99 Mon Sep 17 00:00:00 2001 From: Zainab Amir Date: Mon, 25 Jan 2021 19:29:18 +0500 Subject: [PATCH] VAN-322: UX-Review: Update Forgot Password Pages (#92) --- src/forgot-password/ForgotPasswordPage.jsx | 4 +- .../ForgotPasswordPage.test.jsx.snap | 18 ++--- src/index.jsx | 1 + src/logistration/ConfirmationAlert.jsx | 70 +++++++++---------- src/logistration/LoginHelpLinks.jsx | 5 +- src/logistration/messages.jsx | 17 +++++ .../tests/ConfirmationAlert.test.jsx | 36 ++++++---- src/logistration/tests/LoginPage.test.jsx | 9 +-- .../ConfirmationAlert.test.jsx.snap | 37 ---------- .../__snapshots__/LoginPage.test.jsx.snap | 48 +++++++++++-- src/reset-password/ResetPasswordPage.jsx | 4 +- .../ResetPasswordPage.test.jsx.snap | 12 ++-- 12 files changed, 143 insertions(+), 118 deletions(-) delete mode 100644 src/logistration/tests/__snapshots__/ConfirmationAlert.test.jsx.snap diff --git a/src/forgot-password/ForgotPasswordPage.jsx b/src/forgot-password/ForgotPasswordPage.jsx index 3ccb08d2..8ce50610 100644 --- a/src/forgot-password/ForgotPasswordPage.jsx +++ b/src/forgot-password/ForgotPasswordPage.jsx @@ -58,9 +58,9 @@ const ForgotPasswordPage = (props) => {
{status === 'forbidden' ? : null} -

+

{intl.formatMessage(messages['logisration.forgot.password.page.heading'])} -

+

{intl.formatMessage(messages['logisration.forgot.password.page.instructions'])}

diff --git a/src/forgot-password/tests/__snapshots__/ForgotPasswordPage.test.jsx.snap b/src/forgot-password/tests/__snapshots__/ForgotPasswordPage.test.jsx.snap index f2b62052..61779bf2 100644 --- a/src/forgot-password/tests/__snapshots__/ForgotPasswordPage.test.jsx.snap +++ b/src/forgot-password/tests/__snapshots__/ForgotPasswordPage.test.jsx.snap @@ -10,11 +10,11 @@ exports[`ForgotPasswordPage should match default section snapshot 1`] = ` -

Password assistance -

+

@@ -46,7 +46,7 @@ exports[`ForgotPasswordPage should match default section snapshot 1`] = `

{ - let props = {}; +const IntlConfirmationAlertMessage = injectIntl(ConfirmationAlert); - beforeEach(() => { - props = { - email: 'test@example.com', - }; +describe('ConfirmationAlert', () => { + const supportLink = 'https://support.test.com/What-if-I-did-not-receive-a-password-reset-message'; + mergeConfig({ + PASSWORD_RESET_SUPPORT_LINK: supportLink, }); - it('should match default confirmation message snapshot', () => { - const tree = renderer.create( + it('should match default confirmation message', () => { + const confirmationAlertMessage = mount( - + , - ).toJSON(); - expect(tree).toMatchSnapshot(); + ); + + const expectedMessage = 'Check Your Email' + + 'You entered test@example.com. If this email address is associated with your edX account, ' + + 'we will send a message with password recovery instructions to this email address.' + + 'If you do not 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.'; + + expect(confirmationAlertMessage.find('#confirmation-alert').first().text()).toEqual(expectedMessage); + expect(confirmationAlertMessage.find('#confirmation-alert').find('a').props().href).toEqual(supportLink); }); }); diff --git a/src/logistration/tests/LoginPage.test.jsx b/src/logistration/tests/LoginPage.test.jsx index 657a1653..22de7529 100644 --- a/src/logistration/tests/LoginPage.test.jsx +++ b/src/logistration/tests/LoginPage.test.jsx @@ -15,8 +15,8 @@ const mockStore = configureStore(); describe('LoginPage', () => { const initialState = { + forgotPassword: { status: null }, logistration: { - forgotPassword: { status: null }, loginResult: { success: false, redirectUrl: '' }, response_error: null, thirdPartyAuthContext: { @@ -80,10 +80,11 @@ describe('LoginPage', () => { }); it('should match forget password alert message snapshot', () => { - props = { - ...props, + store = mockStore({ + ...initialState, forgotPassword: { status: 'complete', email: 'test@example.com' }, - }; + }); + const tree = renderer.create(reduxWrapper()).toJSON(); expect(tree).toMatchSnapshot(); }); diff --git a/src/logistration/tests/__snapshots__/ConfirmationAlert.test.jsx.snap b/src/logistration/tests/__snapshots__/ConfirmationAlert.test.jsx.snap deleted file mode 100644 index fe157cdd..00000000 --- a/src/logistration/tests/__snapshots__/ConfirmationAlert.test.jsx.snap +++ /dev/null @@ -1,37 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`ConfirmationAlert should match default confirmation message snapshot 1`] = ` -
-
- - Check Your Email - -
- - You entered - - test@example.com - - . If this email address is associated with your edX account, we will send a message with password recovery instructions to this email address. -
- If you do not 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 - - - . -
-
-`; diff --git a/src/logistration/tests/__snapshots__/LoginPage.test.jsx.snap b/src/logistration/tests/__snapshots__/LoginPage.test.jsx.snap index f2f479db..9c863a64 100644 --- a/src/logistration/tests/__snapshots__/LoginPage.test.jsx.snap +++ b/src/logistration/tests/__snapshots__/LoginPage.test.jsx.snap @@ -91,7 +91,7 @@ exports[`LoginPage should match TPA provider snapshot 1`] = `