@openedx/frontend-app-authn 1.0.0-alpha.4 → 1.0.0-alpha.6

package/src/reset-password/data/reducers.js

@@ -1,44 +0,0 @@
-import { PASSWORD_RESET_FAILURE, RESET_PASSWORD, VALIDATE_TOKEN } from './actions';
-import { PASSWORD_RESET_ERROR, TOKEN_STATE } from './constants';
-
-export const defaultState = {
-  status: TOKEN_STATE.PENDING,
-  token: null,
-  errorMsg: null,
-};
-
-const reducer = (state = defaultState, action = null) => {
-  switch (action.type) {
-    case VALIDATE_TOKEN.SUCCESS:
-      return {
-        ...state,
-        status: TOKEN_STATE.VALID,
-        token: action.payload.token,
-      };
-    case PASSWORD_RESET_FAILURE:
-      return {
-        ...state,
-        status: PASSWORD_RESET_ERROR,
-      };
-    case RESET_PASSWORD.BEGIN:
-      return {
-        ...state,
-        status: 'pending',
-      };
-    case RESET_PASSWORD.SUCCESS:
-      return {
-        ...state,
-        status: 'success',
-      };
-    case RESET_PASSWORD.FAILURE:
-      return {
-        ...state,
-        status: action.payload.errorCode,
-        errorMsg: action.payload.errorMsg,
-      };
-    default:
-      return state;
-  }
-};
-
-export default reducer;

package/src/reset-password/data/sagas.js

@@ -1,67 +0,0 @@
-import { logError, logInfo } from '@openedx/frontend-base';
-import { call, put, takeEvery } from 'redux-saga/effects';
-
-import {
-  passwordResetFailure,
-  RESET_PASSWORD,
-  resetPasswordBegin,
-  resetPasswordFailure,
-  resetPasswordSuccess,
-  VALIDATE_TOKEN,
-  validateTokenBegin,
-  validateTokenSuccess,
-} from './actions';
-import { PASSWORD_RESET, PASSWORD_VALIDATION_ERROR } from './constants';
-import { resetPassword, validateToken } from './service';
-
-// Services
-export function* handleValidateToken(action) {
-  try {
-    yield put(validateTokenBegin());
-    const data = yield call(validateToken, action.payload.token);
-    const isValid = data.is_valid;
-    if (isValid) {
-      yield put(validateTokenSuccess(isValid, action.payload.token));
-    } else {
-      yield put(passwordResetFailure(PASSWORD_RESET.INVALID_TOKEN));
-    }
-  } catch (err) {
-    if (err.response && err.response.status === 429) {
-      yield put(passwordResetFailure(PASSWORD_RESET.FORBIDDEN_REQUEST));
-      logInfo(err);
-    } else {
-      yield put(passwordResetFailure(PASSWORD_RESET.INTERNAL_SERVER_ERROR));
-      logError(err);
-    }
-  }
-}
-
-export function* handleResetPassword(action) {
-  try {
-    yield put(resetPasswordBegin());
-    const data = yield call(resetPassword, action.payload.formPayload, action.payload.token, action.payload.params);
-    const resetStatus = data.reset_status;
-    const resetErrors = data.err_msg;
-
-    if (resetStatus) {
-      yield put(resetPasswordSuccess(resetStatus));
-    } else if (data.token_invalid) {
-      yield put(passwordResetFailure(PASSWORD_RESET.INVALID_TOKEN));
-    } else {
-      yield put(resetPasswordFailure(PASSWORD_VALIDATION_ERROR, resetErrors));
-    }
-  } catch (err) {
-    if (err.response && err.response.status === 429) {
-      yield put(resetPasswordFailure(PASSWORD_RESET.FORBIDDEN_REQUEST));
-      logInfo(err);
-    } else {
-      yield put(resetPasswordFailure(PASSWORD_RESET.INTERNAL_SERVER_ERROR));
-      logError(err);
-    }
-  }
-}
-
-export default function* saga() {
-  yield takeEvery(RESET_PASSWORD.BASE, handleResetPassword);
-  yield takeEvery(VALIDATE_TOKEN.BASE, handleValidateToken);
-}

package/src/reset-password/data/selectors.js

@@ -1,10 +0,0 @@
-import { createSelector } from 'reselect';
-
-export const storeName = 'resetPassword';
-
-export const resetPasswordSelector = state => ({ ...state[storeName] });
-
-export const resetPasswordResultSelector = createSelector(
-  resetPasswordSelector,
-  resetPassword => resetPassword,
-);

package/src/reset-password/data/service.js

@@ -1,61 +0,0 @@
-import { getSiteConfig, getHttpClient } from '@openedx/frontend-base';
-import formurlencoded from 'form-urlencoded';
-
-export async function validateToken(token) {
-  const requestConfig = {
-    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
-  };
-
-  const { data } = await getHttpClient()
-    .post(
-      `${getSiteConfig().lmsBaseUrl}/user_api/v1/account/password_reset/token/validate/`,
-      formurlencoded({ token }),
-      requestConfig,
-    )
-    .catch((e) => {
-      throw (e);
-    });
-  return data;
-}
-
-export async function resetPassword(payload, token, queryParams) {
-  const requestConfig = {
-    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
-  };
-  const url = new URL(`${getSiteConfig().lmsBaseUrl}/password/reset/${token}/`);
-
-  if (queryParams.is_account_recovery) {
-    url.searchParams.append('is_account_recovery', true);
-  }
-
-  const { data } = await getHttpClient()
-    .post(url.href, formurlencoded(payload), requestConfig)
-    .catch((e) => {
-      throw (e);
-    });
-  return data;
-}
-
-export async function validatePassword(payload) {
-  const requestConfig = {
-    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
-  };
-  const { data } = await getHttpClient()
-    .post(
-      `${getSiteConfig().lmsBaseUrl}/api/user/v1/validation/registration`,
-      formurlencoded(payload),
-      requestConfig,
-    )
-    .catch((e) => {
-      throw (e);
-    });
-
-  let errorMessage = '';
-  // Be careful about grabbing this message, since we could have received an HTTP error or the
-  // endpoint didn't give us what we expect. We only care if we get a clear error message.
-  if (data.validation_decisions?.password) {
-    errorMessage = data.validation_decisions.password;
-  }
-
-  return errorMessage;
-}

package/src/reset-password/data/tests/sagas.test.js

@@ -1,185 +0,0 @@
-import { runSaga } from 'redux-saga';
-
-import { initializeMockServices } from '../../../setupTest';
-import {
-  passwordResetFailure,
-  resetPasswordBegin,
-  resetPasswordFailure,
-  resetPasswordSuccess, validateTokenBegin,
-} from '../actions';
-import { PASSWORD_RESET } from '../constants';
-import { handleResetPassword, handleValidateToken } from '../sagas';
-import * as api from '../service';
-
-const { loggingService } = initializeMockServices();
-
-describe('handleResetPassword', () => {
-  const params = {
-    payload: {
-      formPayload: {
-        new_password1: 'new_password1',
-        new_password2: 'new_password1',
-      },
-      token: 'token',
-      params: {},
-    },
-  };
-
-  const responseData = {
-    reset_status: true,
-    err_msg: '',
-  };
-
-  beforeEach(() => {
-    loggingService.logError.mockReset();
-    loggingService.logInfo.mockReset();
-  });
-
-  it('should call service and dispatch success action', async () => {
-    const resetPassword = jest.spyOn(api, 'resetPassword')
-      .mockImplementation(() => Promise.resolve(responseData));
-
-    const dispatched = [];
-    await runSaga(
-      { dispatch: (action) => dispatched.push(action) },
-      handleResetPassword,
-      params,
-    );
-
-    expect(resetPassword).toHaveBeenCalledTimes(1);
-    expect(dispatched).toEqual([resetPasswordBegin(), resetPasswordSuccess(true)]);
-    resetPassword.mockClear();
-  });
-
-  it('should call service and dispatch internal server error action', async () => {
-    const errorResponse = {
-      response: {
-        status: 500,
-        data: {
-          errorCode: PASSWORD_RESET.INTERNAL_SERVER_ERROR,
-        },
-      },
-    };
-    const resetPassword = jest.spyOn(api, 'resetPassword')
-      .mockImplementation(() => Promise.reject(errorResponse));
-
-    const dispatched = [];
-    await runSaga(
-      { dispatch: (action) => dispatched.push(action) },
-      handleResetPassword,
-      params,
-    );
-
-    expect(loggingService.logError).toHaveBeenCalled();
-    expect(resetPassword).toHaveBeenCalledTimes(1);
-    expect(dispatched).toEqual([resetPasswordBegin(), resetPasswordFailure(PASSWORD_RESET.INTERNAL_SERVER_ERROR)]);
-    resetPassword.mockClear();
-  });
-
-  it('should call service and dispatch invalid token error', async () => {
-    responseData.reset_status = false;
-    responseData.token_invalid = true;
-
-    const resetPassword = jest.spyOn(api, 'resetPassword')
-      .mockImplementation(() => Promise.resolve(responseData));
-
-    const dispatched = [];
-    await runSaga(
-      { dispatch: (action) => dispatched.push(action) },
-      handleResetPassword,
-      params,
-    );
-
-    expect(resetPassword).toHaveBeenCalledTimes(1);
-    expect(dispatched).toEqual([resetPasswordBegin(), passwordResetFailure(PASSWORD_RESET.INVALID_TOKEN)]);
-    resetPassword.mockClear();
-  });
-
-  it('should call service and dispatch ratelimit error', async () => {
-    const errorResponse = {
-      response: {
-        status: 429,
-        data: {
-          errorCode: PASSWORD_RESET.FORBIDDEN_REQUEST,
-        },
-      },
-    };
-    const resetPassword = jest.spyOn(api, 'resetPassword')
-      .mockImplementation(() => Promise.reject(errorResponse));
-
-    const dispatched = [];
-    await runSaga(
-      { dispatch: (action) => dispatched.push(action) },
-      handleResetPassword,
-      params,
-    );
-
-    expect(loggingService.logInfo).toHaveBeenCalled();
-    expect(resetPassword).toHaveBeenCalledTimes(1);
-    expect(dispatched).toEqual([resetPasswordBegin(), resetPasswordFailure(PASSWORD_RESET.FORBIDDEN_REQUEST)]);
-    resetPassword.mockClear();
-  });
-});
-
-describe('handleValidateToken', () => {
-  const params = {
-    payload: {
-      token: 'token',
-      params: {},
-    },
-  };
-
-  beforeEach(() => {
-    loggingService.logError.mockReset();
-    loggingService.logInfo.mockReset();
-  });
-
-  it('check internal server error on api failure', async () => {
-    const errorResponse = {
-      response: {
-        status: 500,
-        data: {
-          errorCode: PASSWORD_RESET.INTERNAL_SERVER_ERROR,
-        },
-      },
-    };
-    const validateToken = jest.spyOn(api, 'validateToken')
-      .mockImplementation(() => Promise.reject(errorResponse));
-
-    const dispatched = [];
-    await runSaga(
-      { dispatch: (action) => dispatched.push(action) },
-      handleValidateToken,
-      params,
-    );
-
-    expect(validateToken).toHaveBeenCalledTimes(1);
-    expect(dispatched).toEqual([validateTokenBegin(), passwordResetFailure(PASSWORD_RESET.INTERNAL_SERVER_ERROR)]);
-    validateToken.mockClear();
-  });
-
-  it('should call service and dispatch rate limit error', async () => {
-    const errorResponse = {
-      response: {
-        status: 429,
-        data: {
-          errorCode: PASSWORD_RESET.FORBIDDEN_REQUEST,
-        },
-      },
-    };
-    const validateToken = jest.spyOn(api, 'validateToken')
-      .mockImplementation(() => Promise.reject(errorResponse));
-
-    const dispatched = [];
-    await runSaga(
-      { dispatch: (action) => dispatched.push(action) },
-      handleValidateToken,
-      params,
-    );
-
-    expect(loggingService.logInfo).toHaveBeenCalled();
-    expect(validateToken).toHaveBeenCalledTimes(1);
-    expect(dispatched).toEqual([validateTokenBegin(), passwordResetFailure(PASSWORD_RESET.FORBIDDEN_REQUEST)]);
-    validateToken.mockClear();
-  });
-});

package/src/reset-password/messages.js

@@ -1,88 +0,0 @@
-import { defineMessages } from '@openedx/frontend-base';
-
-const messages = defineMessages({
-  'sign.in': {
-    id: 'sign.in',
-    defaultMessage: 'Sign in',
-    description: 'Sign in toggle text',
-  },
-  'reset.password.page.title': {
-    id: 'reset.password.page.title',
-    defaultMessage: 'Reset Password | {siteName}',
-    description: 'page title',
-  },
-  'reset.password': {
-    id: 'reset.password',
-    defaultMessage: 'Reset password',
-    description: 'The page heading and button text for reset password page.',
-  },
-  'reset.password.page.instructions': {
-    id: 'reset.password.page.instructions',
-    defaultMessage: 'Enter and confirm your new password.',
-    description: 'Instructions message for reset password page.',
-  },
-  'new.password.label': {
-    id: 'new.password.label',
-    defaultMessage: 'New password',
-    description: 'New password field label for the reset password page.',
-  },
-  'confirm.password.label': {
-    id: 'confirm.password.label',
-    defaultMessage: 'Confirm password',
-    description: 'Confirm password field label for the reset password page.',
-  },
-  // validation errors
-  'password.validation.message': {
-    id: 'password.validation.message',
-    defaultMessage: 'Password criteria has not been met',
-    description: 'Error message for empty or invalid password',
-  },
-  'passwords.do.not.match': {
-    id: 'passwords.do.not.match',
-    defaultMessage: 'Passwords do not match',
-    description: 'Password format error.',
-  },
-  'confirm.your.password': {
-    id: 'confirm.your.password',
-    defaultMessage: 'Confirm your password',
-    description: 'Field validation message when confirm password is empty',
-  },
-  // alert banner strings
-  'reset.password.failure.heading': {
-    id: 'reset.password.failure.heading',
-    defaultMessage: 'We couldn\'t reset your password.',
-    description: 'Heading for reset password request failure',
-  },
-  'reset.password.form.submission.error': {
-    id: 'reset.password.form.submission.error',
-    defaultMessage: 'Please check your responses and try again.',
-    description: 'Error message for reset password page',
-  },
-  'reset.server.rate.limit.error': {
-    id: 'reset.server.rate.limit.error',
-    defaultMessage: 'Too many requests.',
-    description: 'Too many request at server end point',
-  },
-  'reset.password.success.heading': {
-    id: 'reset.password.success.heading',
-    defaultMessage: 'Password reset complete.',
-    description: 'Heading for alert box when reset password is successful',
-  },
-  'reset.password.success': {
-    id: 'reset.password.success',
-    defaultMessage: 'Your password has been reset. Sign in to your account.',
-    description: 'Reset password success message',
-  },
-  'internal.server.error': {
-    id: 'internal.server.error',
-    defaultMessage: 'An error has occurred. Try refreshing the page, or check your internet connection.',
-    description: 'Error message that appears when server responds with 500 error code',
-  },
-  'rate.limit.error': {
-    id: 'rate.limit.error',
-    defaultMessage: 'An error has occurred because of too many requests. Please try again after some time.',
-    description: 'Error message that appears when server responds with 429 error code',
-  },
-});
-
-export default messages;

package/src/reset-password/tests/ResetPasswordPage.test.jsx

@@ -1,241 +0,0 @@
-import { Provider } from 'react-redux';
-
-import { CurrentAppProvider, configureI18n, getSiteConfig, injectIntl, IntlProvider } from '@openedx/frontend-base';
-import {
-  fireEvent, render, screen,
-} from '@testing-library/react';
-import { act } from 'react-dom/test-utils';
-import { MemoryRouter, useParams } from 'react-router-dom';
-import configureStore from 'redux-mock-store';
-
-import { appId } from '../../constants';
-import { initializeMockServices } from '../../setupTest';
-import { LOGIN_PAGE, RESET_PAGE } from '../../data/constants';
-import { resetPassword, validateToken } from '../data/actions';
-import {
-  PASSWORD_RESET, PASSWORD_RESET_ERROR, SUCCESS, TOKEN_STATE,
-} from '../data/constants';
-import ResetPasswordPage from '../ResetPasswordPage';
-
-const mockNavigate = jest.fn();
-const mockParams = jest.fn();
-jest.mock('react-router-dom', () => ({
-  ...jest.requireActual('react-router-dom'),
-  useNavigate: () => mockNavigate,
-  useParams: jest.fn(),
-}));
-
-initializeMockServices();
-const IntlResetPasswordPage = injectIntl(ResetPasswordPage);
-const mockStore = configureStore();
-const token = '1c-bmjdkc-5e60e084cf8113048ca7';
-
-describe('ResetPasswordPage', () => {
-  let props = {};
-  let store = {};
-
-  const reduxWrapper = children => (
-    <IntlProvider locale="en">
-      <MemoryRouter>
-        <CurrentAppProvider appId={appId}>
-          <Provider store={store}>{children}</Provider>
-        </CurrentAppProvider>
-      </MemoryRouter>
-    </IntlProvider>
-  );
-
-  const initialState = {
-    register: {
-      validationApiRateLimited: false,
-    },
-    resetPassword: {},
-  };
-
-  beforeEach(() => {
-    store = mockStore(initialState);
-    configureI18n({
-      messages: { 'es-419': {}, de: {}, 'en-us': {} },
-    });
-    props = {
-      resetPassword: jest.fn(),
-      status: null,
-      token: null,
-      errors: null,
-      match: {
-        params: {},
-      },
-    };
-    useParams.mockReturnValue({ token: null });
-  });
-
-  afterEach(() => {
-    jest.clearAllMocks();
-  });
-
-  // ******** form submission tests ********
-
-  it('with valid inputs resetPassword action is dispatched', async () => {
-    const password = 'test-password-1';
-
-    store = mockStore({
-      ...initialState,
-      resetPassword: {
-        status: TOKEN_STATE.VALID,
-      },
-    });
-
-    store.dispatch = jest.fn(store.dispatch);
-    render(reduxWrapper(<IntlResetPasswordPage {...props} />));
-    const newPasswordInput = screen.getByLabelText('New password');
-    const confirmPasswordInput = screen.getByLabelText('Confirm password');
-
-    fireEvent.change(newPasswordInput, { target: { value: password } });
-    fireEvent.change(confirmPasswordInput, { target: { value: password } });
-
-    const resetPasswordButton = screen.getByRole('button', { name: /Reset password/i, id: 'submit-new-password' });
-    await act(async () => {
-      fireEvent.click(resetPasswordButton);
-    });
-    expect(store.dispatch).toHaveBeenCalledWith(
-      resetPassword({ new_password1: password, new_password2: password }, props.token, {}),
-    );
-  });
-
-  // ******** test reset password field validations ********
-
-  it('should show error messages for required fields on empty form submission', () => {
-    store = mockStore({
-      ...initialState,
-      resetPassword: {
-        status: TOKEN_STATE.VALID,
-      },
-    });
-    render(reduxWrapper(<IntlResetPasswordPage {...props} />));
-    const resetPasswordButton = screen.getByRole('button', { name: /Reset password/i, id: 'submit-new-password' });
-    fireEvent.click(resetPasswordButton);
-
-    expect(screen.queryByText(/We couldn't reset your password./i)).toBeTruthy();
-    expect(screen.queryByText('Password criteria has not been met')).toBeTruthy();
-    expect(screen.queryByText('Confirm your password')).toBeTruthy();
-
-    const newPasswordInput = screen.getByLabelText('New password');
-    fireEvent.focus(newPasswordInput);
-    expect(screen.queryByText('Password criteria has not been met')).toBeNull();
-
-    const confirmPasswordInput = screen.getByLabelText('Confirm password');
-    fireEvent.focus(confirmPasswordInput);
-    expect(screen.queryByText('Confirm your password')).toBeNull();
-  });
-
-  it('should show error message when new and confirm password do not match', () => {
-    store = mockStore({
-      ...initialState,
-      resetPassword: {
-        status: TOKEN_STATE.VALID,
-      },
-    });
-    render(reduxWrapper(<IntlResetPasswordPage {...props} />));
-    const confirmPasswordInput = screen.getByLabelText('Confirm password');
-    fireEvent.change(confirmPasswordInput, { target: { value: 'password-mismatch' } });
-
-    const passwordsDoNotMatchError = screen.queryByText('Passwords do not match');
-    expect(passwordsDoNotMatchError).toBeTruthy();
-  });
-
-  // ******** alert message tests ********
-
-  it('should show reset password rate limit error', () => {
-    const validationMessage = 'Too many requests.An error has occurred because of too many requests. Please try again after some time.';
-    store = mockStore({
-      ...initialState,
-      resetPassword: {
-        status: PASSWORD_RESET.FORBIDDEN_REQUEST,
-      },
-    });
-
-    const { container } = render(reduxWrapper(<IntlResetPasswordPage {...props} />));
-
-    const alertElements = container.querySelectorAll('.alert-danger');
-    const rateLimitError = alertElements[0].textContent;
-    expect(rateLimitError).toBe(validationMessage);
-  });
-
-  it('should show reset password internal server error', () => {
-    const validationMessage = 'We couldn\'t reset your password.An error has occurred. Try refreshing the page, or check your internet connection.';
-    store = mockStore({
-      ...initialState,
-      resetPassword: {
-        status: PASSWORD_RESET.INTERNAL_SERVER_ERROR,
-      },
-    });
-
-    const { container } = render(reduxWrapper(<IntlResetPasswordPage {...props} />));
-    const alertElements = container.querySelectorAll('.alert-danger');
-    const internalServerError = alertElements[0].textContent;
-    expect(internalServerError).toBe(validationMessage);
-  });
-
-  // ******** miscellaneous tests ********
-
-  it('should call validation on password field when blur event fires', () => {
-    const resetPasswordPage = render(reduxWrapper(<IntlResetPasswordPage {...props} />));
-    const expectedText = 'Password criteria has not been metPassword must contain at least 8 characters, at least one letter, and at least one number';
-    const newPasswordInput = resetPasswordPage.container.querySelector('input#newPassword');
-    newPasswordInput.value = 'test-password';
-    fireEvent.change(newPasswordInput);
-
-    fireEvent.blur(newPasswordInput);
-
-    const feedbackDiv = resetPasswordPage.container.querySelector('div[feedback-for="newPassword"]');
-    expect(feedbackDiv.textContent).toEqual(expectedText);
-  });
-
-  it('show spinner when api call is pending', () => {
-    store.dispatch = jest.fn(store.dispatch);
-    props = {
-      status:
-        TOKEN_STATE.PENDING,
-    };
-    useParams.mockReturnValue({ token });
-
-    render(reduxWrapper(<IntlResetPasswordPage {...props} />));
-
-    expect(store.dispatch).toHaveBeenCalledWith(validateToken(token));
-
-    useParams.mockClear();
-  });
-  it('should redirect the user to Reset password email screen ', async () => {
-    props = {
-      status:
-        PASSWORD_RESET_ERROR,
-    };
-    render(reduxWrapper(<IntlResetPasswordPage {...props} />));
-    expect(mockNavigate).toHaveBeenCalledWith(RESET_PAGE);
-  });
-  it('should redirect the user to root url of the application ', async () => {
-    props = {
-      status: SUCCESS,
-    };
-    render(reduxWrapper(<IntlResetPasswordPage {...props} />));
-    expect(mockNavigate).toHaveBeenCalledWith(LOGIN_PAGE);
-  });
-
-  it('shows spinner during token validation', () => {
-    render(reduxWrapper(<IntlResetPasswordPage {...props} />));
-    const spinnerElement = document.getElementsByClassName('div.spinner-header');
-
-    expect(spinnerElement).toBeTruthy();
-  });
-
-  // ******** redirection tests ********
-
-  it('by clicking on sign in tab should redirect onto login page', async () => {
-    const { getByText } = render(reduxWrapper(<IntlResetPasswordPage {...props} />));
-
-    const signInTab = getByText('Sign in');
-
-    fireEvent.click(signInTab);
-
-    expect(mockNavigate).toHaveBeenCalledWith(LOGIN_PAGE);
-  });
-});