Cover forgot password with e2e tests

packages/app/components/auth/PanelTransition.tsx

@@ -298,7 +298,7 @@ class PanelTransition extends React.PureComponent<Props, State> {
                 </Panel>
                 <div
                   className={helpLinksStyles}
-                  data-testid="auth-secondary-controls"
+                  data-testid="auth-controls-secondary"
                 >
                   {panels.map(config => this.getLinks(config))}
                 </div>

packages/app/components/auth/forgotPassword/ForgotPasswordBody.js

@@ -48,10 +48,14 @@ export default class ForgotPasswordBody extends BaseAuthBody {
             />
           </div>
         ) : (
-          <div>
+          <div data-testid="forgot-password-login">
             <div className={styles.login}>
               {login}
-              <span className={styles.editLogin} onClick={this.onClickEdit} />
+              <span
+                className={styles.editLogin}
+                onClick={this.onClickEdit}
+                data-testid="edit-login"
+              />
             </div>
             <p className={styles.descriptionText}>
               <Message {...messages.pleasePressButton} />

packages/app/components/contact/ContactForm.tsx

@@ -58,7 +58,7 @@ export class ContactForm extends React.Component<
 
     return (
       <div
-        data-e2e="feedbackPopup"
+        data-testid="feedbackPopup"
         className={
           isSuccessfullySent ? styles.successState : styles.contactForm
         }
@@ -71,6 +71,7 @@ export class ContactForm extends React.Component<
             <span
               className={clsx(icons.close, popupStyles.close)}
               onClick={onClose}
+              data-testid="feedback-popup-close"
             />
           </div>
 

tests-e2e/cypress/integration/auth/forgot-password.ts

@@ -0,0 +1,216 @@
+import { account1 } from '../../fixtures/accounts.json';
+
+it('should request password reset', () => {
+  const captchaCode = 'captchaCode';
+  const emailMask = 'fo*@gm*l.**m';
+
+  cy.server();
+  cy.route({
+    method: 'POST',
+    url: '/api/authentication/forgot-password',
+    response: {
+      success: true,
+      data: {
+        emailMask,
+      },
+    },
+  }).as('forgot');
+
+  cy.visit('/');
+
+  cy.get('[name=login]').type(`${account1.username}{enter}`);
+
+  cy.location('pathname').should('eq', '/password');
+
+  cy.getByTestId('auth-controls-secondary')
+    .contains('Forgot password')
+    .click();
+
+  cy.location('pathname').should('eq', '/forgot-password');
+
+  cy.getByTestId('forgot-password-login').should('contain', account1.username);
+
+  cy.window().should('have.property', 'e2eCaptchaSetCode');
+  cy.window().then(win => {
+    // fake captcha response
+    // @ts-ignore
+    win.e2eCaptchaSetCode(captchaCode);
+  });
+  cy.get('[type=submit]')
+    .should('have.length', 1)
+    .click();
+
+  cy.wait('@forgot')
+    .its('requestBody')
+    .should(
+      'eq',
+      new URLSearchParams({
+        login: account1.username,
+        captcha: captchaCode,
+      }).toString(),
+    );
+
+  cy.location('pathname').should('eq', '/recover-password');
+
+  cy.getByTestId('auth-body').should('contain', emailMask);
+});
+
+it('should allow change login', () => {
+  const captchaCode = 'captchaCode';
+  const login = 'foo';
+  const emailMask = 'fo*@gm*l.**m';
+
+  cy.server();
+  cy.route({
+    method: 'POST',
+    url: '/api/authentication/forgot-password',
+    response: {
+      success: true,
+      data: {
+        emailMask,
+      },
+    },
+  }).as('forgot');
+
+  cy.visit('/');
+
+  cy.get('[name=login]').type(`${account1.username}{enter}`);
+
+  cy.location('pathname').should('eq', '/password');
+
+  cy.getByTestId('auth-controls-secondary')
+    .contains('Forgot password')
+    .click();
+
+  cy.location('pathname').should('eq', '/forgot-password');
+
+  cy.getByTestId('edit-login').click();
+  cy.get('[name=login]').should('have.value', account1.username);
+
+  cy.get('[name=login]').type(`{selectall}${login}`);
+  cy.window().should('have.property', 'e2eCaptchaSetCode');
+  cy.window().then(win => {
+    // fake captcha response
+    // @ts-ignore
+    win.e2eCaptchaSetCode(captchaCode);
+  });
+  cy.get('[type=submit]')
+    .should('have.length', 1)
+    .click();
+
+  cy.wait('@forgot')
+    .its('requestBody')
+    .should(
+      'eq',
+      new URLSearchParams({
+        login,
+        captcha: captchaCode,
+      }).toString(),
+    );
+
+  cy.location('pathname').should('eq', '/recover-password');
+});
+
+it('should allow enter login', () => {
+  const captchaCode = 'captchaCode';
+  const login = 'foo';
+  const emailMask = 'fo*@gm*l.**m';
+
+  cy.server();
+  cy.route({
+    method: 'POST',
+    url: '/api/authentication/forgot-password',
+    response: {
+      success: true,
+      data: {
+        emailMask,
+      },
+    },
+  }).as('forgot');
+
+  cy.visit('/forgot-password');
+
+  cy.get('[name=login]').type(login);
+  cy.window().should('have.property', 'e2eCaptchaSetCode');
+  cy.window().then(win => {
+    // fake captcha response
+    // @ts-ignore
+    win.e2eCaptchaSetCode(captchaCode);
+  });
+  cy.get('[type=submit]')
+    .should('have.length', 1)
+    .click();
+
+  cy.wait('@forgot')
+    .its('requestBody')
+    .should(
+      'eq',
+      new URLSearchParams({
+        login,
+        captcha: captchaCode,
+      }).toString(),
+    );
+
+  cy.location('pathname').should('eq', '/recover-password');
+});
+
+it('should recover password', () => {
+  const key = 'key';
+  const newPassword = 'newPassword';
+
+  cy.server();
+  cy.login({
+    accounts: ['default'],
+    updateState: false,
+    rawApiResp: true,
+  }).then(({ accounts: [account] }) => {
+    cy.route({
+      method: 'POST',
+      url: '/api/authentication/recover-password',
+      response: account,
+    }).as('recover');
+  });
+
+  cy.visit('/');
+
+  cy.get('[name=login]').type(`${account1.username}{enter}`);
+
+  cy.location('pathname').should('eq', '/password');
+
+  cy.getByTestId('auth-controls-secondary')
+    .contains('Forgot password')
+    .click();
+
+  cy.location('pathname').should('eq', '/forgot-password');
+
+  cy.getByTestId('auth-controls-secondary')
+    .contains('Already have')
+    .click();
+
+  cy.location('pathname').should('eq', '/recover-password');
+
+  cy.getByTestId('auth-controls-secondary')
+    .contains('Contact support')
+    .click();
+  cy.getByTestId('feedbackPopup').should('be.visible');
+  cy.getByTestId('feedback-popup-close').click();
+  cy.getByTestId('feedbackPopup').should('not.be.visible');
+
+  cy.get('[name=key]').type(key);
+  cy.get('[name=newPassword]').type(newPassword);
+  cy.get('[name=newRePassword]').type(newPassword);
+  cy.get('[type=submit]')
+    .should('have.length', 1)
+    .click();
+
+  cy.wait('@recover')
+    .its('requestBody')
+    .should(
+      'eq',
+      new URLSearchParams({
+        key,
+        newPassword,
+        newRePassword: newPassword,
+      }).toString(),
+    );
+});

tests-e2e/cypress/integration/auth/register.test.ts

@@ -92,7 +92,7 @@ it('should allow activation', () => {
   });
   cy.visit('/register');
 
-  cy.getByTestId('auth-secondary-controls')
+  cy.getByTestId('auth-controls-secondary')
     .contains('Already have')
     .click();
 
@@ -119,7 +119,7 @@ it('should allow resend code', () => {
   }).as('resend');
   cy.visit('/register');
 
-  cy.getByTestId('auth-secondary-controls')
+  cy.getByTestId('auth-controls-secondary')
     .contains('not received')
     .click();
 

tests-e2e/cypress/integration/dev/guest.test.ts

@@ -23,6 +23,6 @@ describe('/dev/applications - guest', () => {
     cy.visit('/dev/applications');
 
     cy.get('[data-e2e-content] [data-e2e-button="feedbackPopup"]').click();
-    cy.get('[data-e2e="feedbackPopup"]').should('be.visible');
+    cy.getByTestId('feedbackPopup').should('be.visible');
   });
 });

tests-e2e/cypress/integration/oauth/user.test.ts

@@ -105,7 +105,7 @@ xit('should redirect to error page, when permission request declined', () => {
 
   cy.server({ enable: false });
 
-  cy.getByTestId('auth-secondary-controls')
+  cy.getByTestId('auth-controls-secondary')
     .contains('Decline')
     .click();
 
@@ -220,7 +220,7 @@ describe('prompts', () => {
 
     cy.url().should('include', '/oauth/permissions');
 
-    cy.getByTestId('auth-secondary-controls')
+    cy.getByTestId('auth-controls-secondary')
       .contains('Decline')
       .click();