WIP: add login command with session

packages/app/cypress.json

@@ -8,5 +8,7 @@
   "videosFolder": "test/cypress/videos",
   "supportFile": "test/cypress/support/index.ts",
   "pluginsFile": "test/cypress/plugins/index.ts",
-  "testFiles": "**/*.spec.ts"
+  "testFiles": "**/*.spec.ts",
+
+  "experimentalSessionSupport": true
 }

packages/app/src/components/LoginForm.jsx

@@ -50,7 +50,7 @@ class LoginForm extends React.Component {
               <i className="icon-user"></i>
             </span>
           </div>
-          <input type="text" className="form-control rounded-0" placeholder="Username or E-mail" name="loginForm[username]" />
+          <input type="text" className="form-control rounded-0" data-testid="tiUsernameForLogin" placeholder="Username or E-mail" name="loginForm[username]" />
           {isLdapStrategySetup && (
             <div className="input-group-append">
               <small className="input-group-text text-success">
@@ -66,12 +66,12 @@ class LoginForm extends React.Component {
               <i className="icon-lock"></i>
             </span>
           </div>
-          <input type="password" className="form-control rounded-0" placeholder="Password" name="loginForm[password]" />
+          <input type="password" className="form-control rounded-0" data-testid="tiPasswordForLogin" placeholder="Password" name="loginForm[password]" />
         </div>
 
         <div className="input-group my-4">
           <input type="hidden" name="_csrf" value={appContainer.csrfToken} />
-          <button type="submit" id="login" className="btn btn-fill rounded-0 login mx-auto">
+          <button type="submit" id="login" className="btn btn-fill rounded-0 login mx-auto" data-testid="btnSubmitForLogin">
             <div className="eff"></div>
             <span className="btn-label">
               <i className="icon-login"></i>

packages/app/test/cypress/support/commands.ts

@@ -27,4 +27,13 @@
 
 Cypress.Commands.add('getByTestid', (selector, options?) => {
   return cy.get(`[data-testid=${selector}]`, options);
-})
+});
+
+Cypress.Commands.add('login', (username, password) => {
+  cy.session(username, () => {
+    cy.visit('/login');
+    cy.getByTestid('tiUsernameForLogin').type(username);
+    cy.getByTestid('tiPasswordForLogin').type(password);
+    cy.getByTestid('btnSubmitForLogin').click();
+  });
+});

packages/app/test/cypress/support/index.ts

@@ -24,6 +24,7 @@ declare global {
   namespace Cypress {
     interface Chainable {
        getByTestid(selector: string, options?: Partial<Loggable & Timeoutable & Withinable & Shadow>): Chainable<JQuery<Element>>,
+       login(username: string, password: string): Chainable<void>,
     }
   }
 }