IO-2327 tests for login and reset password

.gitignore

@@ -117,4 +117,6 @@ logs/oAuthClient-log.log
 
 .node-persist/**
 
-/*.env.*
+/*.env.*
+
+client/cypress/e2e/[1,2]-*

client/cypress.config.js

@@ -12,5 +12,6 @@ module.exports = defineConfig({
     setupNodeEvents(on, config) {
       // implement node event listeners here
     },
+    baseUrl: "http://localhost:3000",
   },
 });

client/cypress/e2e/login-and-navigation/login.cy.js

@@ -0,0 +1,32 @@
+describe("logging in to the application", () => {
+  // FIXME error message
+  it("logs in the using wrong credentials", () => {
+    cy.login("fakeusername", "veryverylongpassword_123@#");
+    cy.contains("invalid-email");
+  });
+
+  it("logs in the using wrong password", () => {
+    cy.login("john@imex.dev", "veryverylongpassword_123@#");
+    cy.contains(
+      "The email and password combination you provided is incorrect."
+    );
+  });
+
+  it("logs in a non-existent credentials", () => {
+    cy.login("franz@imex.dev", "veryverylongpassword_123@#");
+    cy.contains("A user with this email does not exist.");
+  });
+
+  //   TODO create disabled account
+  //   it("logs in with a disabled account", () => {
+  //     cy.login("disabled_account@imex.dev", "john123");
+  //     cy.contains("User account disabled.");
+  //   });
+
+  //   TODO log in to the application
+  //   it("logs in the using the right credentials", () => {
+  //     cy.login("john@imex.dev", "john123");
+
+  //     cy.url().should('include', '/manage')
+  //   });
+});

client/cypress/e2e/login-and-navigation/reset-password.cy.js

@@ -0,0 +1,17 @@
+describe("resetting user password", () => {
+  it("resets forgotten password with an invalid email", () => {
+    cy.passwordReset("franz");
+    cy.contains("Email is not a valid email");
+  });
+
+  //   FIXME error message
+  it("resets forgotten password with a user that does not exist", () => {
+    cy.passwordReset("franz@imex.dev");
+    cy.contains("user-not-found");
+  });
+
+  it("resets forgotten password using the right credentials", () => {
+    cy.passwordReset("john@imex.dev");
+    cy.contains("A password reset link has been sent to you.");
+  });
+});

client/cypress/support/commands.js

@@ -22,4 +22,30 @@
 //
 //
 // -- This will overwrite an existing command --
-// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
+// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
+
+Cypress.Commands.add("goToSignInPage", () => {
+  cy.visit("/");
+  cy.contains("Sign In").click();
+});
+
+Cypress.Commands.add("login", (username, password) => {
+  cy.goToSignInPage();
+
+  cy.get('[data-cy="username"]').type(username);
+  cy.get('[data-cy="password"]').type(password);
+  cy.get('[data-cy="sign-in-button"]', { timeout: 2000 }).click();
+});
+
+Cypress.Commands.add("passwordReset", (email) => {
+  cy.goToSignInPage();
+  cy.get('[data-cy="reset-password"]').click();
+  cy.get('[data-cy="reset-password-email-input"]').type(email);
+  cy.get('[data-cy="reset-password-button"]').click();
+});
+
+Cypress.on("uncaught:exception", (err, runnable) => {
+  // returning false here prevents Cypress from
+  // failing the test
+  return false;
+});

client/cypress/support/e2e.js

@@ -14,7 +14,7 @@
 // ***********************************************************
 
 // Import commands.js using ES2015 syntax:
-import './commands'
+import "./commands";
 
 // Alternatively you can use CommonJS syntax:
-// require('./commands')
+// require('./commands')

client/src/components/header/header.component.jsx

@@ -106,6 +106,7 @@ function Header({
         selectedKeys={[selectedHeader]}
         onClick={handleMenuClick}
         subMenuCloseDelay={0.3}
+        data-cy="header-menu"
       >
         <Menu.Item key="home" icon={<HomeFilled />}>
           <Link to="/manage">{t("menus.header.home")}</Link>
@@ -347,8 +348,14 @@ function Header({
             currentUser.email ||
             t("general.labels.unknown")
           }
+          data-cy="user-sub-menu"
         >
-          <Menu.Item key="signout" danger onClick={() => signOutStart()}>
+          <Menu.Item
+            key="signout"
+            danger
+            data-cy="sign-out-button"
+            onClick={() => signOutStart()}
+          >
             {t("user.actions.signout")}
           </Menu.Item>
           <Menu.Item

client/src/components/sign-in-form/sign-in-form.component.jsx

@@ -69,6 +69,7 @@ export function SignInComponent({
           <Input
             prefix={<UserOutlined />}
             placeholder={t("general.labels.username")}
+            data-cy="username"
           />
         </Form.Item>
         <Form.Item
@@ -84,6 +85,7 @@ export function SignInComponent({
             prefix={<LockOutlined />}
             type="password"
             placeholder={t("general.labels.password")}
+            data-cy="password"
           />
         </Form.Item>
         {signInError ? (
@@ -97,11 +99,12 @@ export function SignInComponent({
           type="primary"
           htmlType="submit"
           loading={loginLoading}
+          data-cy="sign-in-button"
         >
           {t("general.actions.login")}
         </Button>
       </Form>
-      <Link to={"/resetpassword"}>
+      <Link to={"/resetpassword"} data-cy="reset-password">
         <Button>{t("general.actions.resetpassword")}</Button>
       </Link>
     </div>

client/src/components/user-request-pw-reset/user-request-reset-pw.component.jsx

@@ -72,7 +72,7 @@ export function UserRequestResetPw({
             },
           ]}
         >
-          <Input />
+          <Input data-cy="reset-password-email-input" />
         </Form.Item>
         {passwordReset.error ? (
           <AlertComponent message={passwordReset.error} type="warning" />
@@ -82,6 +82,7 @@ export function UserRequestResetPw({
           type="primary"
           htmlType="submit"
           loading={passwordReset.loading}
+          data-cy="reset-password-button"
         >
           {t("general.actions.submit")}
         </Button>