add member invite dialog

frontend/cypress/e2e/objective-backlog.cy.ts

@@ -15,8 +15,8 @@ describe('OKR Objective Backlog e2e tests', () => {
     op.addObjective()
       .fillObjectiveTitle('Objective in quarter backlog')
       .selectQuarter('Backlog')
-      .check(cy.contains('Speichern').should('not.exist'))
-      .check(cy.contains('Als Draft speichern'))
+      .run(cy.contains('Speichern').should('not.exist'))
+      .run(cy.contains('Als Draft speichern'))
       .submitDraftObjective();
 
     cy.contains('Objective in quarter backlog').should('not.exist');

frontend/cypress/e2e/teammanagement.cy.ts

@@ -3,6 +3,7 @@ import { uniqueSuffix } from '../support/helper/utils';
 import ConfirmDialog from '../support/helper/pom-helper/dialogs/confirmDialog';
 import TeammanagementPage from '../support/helper/pom-helper/pages/teammanagementPage';
 import CyOverviewPage from '../support/helper/pom-helper/pages/overviewPage';
+import InviteMembersDialog from '../support/helper/pom-helper/dialogs/inviteMembersDialog';
 
 describe('Team management tests', () => {
   const teamName = uniqueSuffix('New Team');
@@ -176,21 +177,13 @@ describe('Team management tests', () => {
 
     describe('invite members', () => {
       it('invite two members', () => {
-        const mailUserClaudia = uniqueSuffix('claudia.meier@test') + '.ch';
-        const mailUserStefan = uniqueSuffix('stefan.schmidt@test') + '.ch';
-        const firstNameClaudia = uniqueSuffix('Claudia');
-        const firstNameStefan = uniqueSuffix('Stefan');
+        teammanagementPage.elements.registerMember().click();
+        const firstNames = InviteMembersDialog.do()
+          .enterUser('Claudia', 'Meier', 'claudia.meier@test.ch')
+          .addAnotherUser()
+          .enterUser('Stefan', 'Schmidt', 'stefan.schmidt@test.ch')
+          .getFirstNames();
 
-        cy.getByTestId('invite-member').click();
-        cy.wait(1000); // wait for dialog to open
-        cy.tabForward();
-        cy.contains('Members registrieren');
-
-        fillOutNewUser(firstNameClaudia, 'Meier', mailUserClaudia);
-        cy.tabForward();
-        cy.tabForward();
-        cy.realPress('Enter');
-        fillOutNewUser(firstNameStefan, 'Schmidt', mailUserStefan);
         cy.tabForward();
         cy.tabForward();
         cy.realPress('Enter');
@@ -217,8 +210,7 @@ describe('Team management tests', () => {
         // save
         cy.getByTestId('invite').click();
         cy.contains('Die Members wurden erfolgreich registriert');
-        cy.contains(firstNameClaudia);
-        cy.contains(firstNameStefan);
+        firstNames.forEach((email) => cy.contains(email));
       });
     });
 

frontend/cypress/support/helper/pom-helper/dialogs/dialog.ts

@@ -22,9 +22,14 @@ export default abstract class Dialog extends PageObjectMapperBase {
     cy.getByTestId('close-dialog').click();
   }
 
-  protected fillInput(testId: string, value: string) {
-    cy.getByTestId(testId).clear();
-    cy.getByTestId(testId).type(value);
+  protected fillInputByTestId(testId: string, value: string) {
+    const elem = cy.getByTestId(testId);
+    this.fillInput(elem, value);
+  }
+
+  protected fillInput(elem: Cypress.Chainable<JQuery<HTMLElement>>, value: string) {
+    elem.clear();
+    elem.type(value);
   }
 
   abstract getPage(): Cypress.Chainable<JQuery<HTMLElement>>;

frontend/cypress/support/helper/pom-helper/dialogs/inviteMembersDialog.ts

@@ -0,0 +1,41 @@
+import Dialog from './dialog';
+import { uniqueSuffix } from '../../utils';
+
+export default class InviteMembersDialog extends Dialog {
+  private readonly firstnames: string[] = [];
+
+  override validatePage() {
+    super.validatePage();
+    this.getPage().contains('Members registrieren').should('exist');
+  }
+
+  enterUser(firstName: string, lastName: string, email: string) {
+    firstName = uniqueSuffix(firstName);
+    email = uniqueSuffix(email);
+    this.firstnames.push(firstName);
+    const firstNameInput = cy.get('[formcontrolname="firstname"]').last();
+    const lastNameInput = cy.get('[formcontrolname="lastname"]').last();
+    const emailInput = cy.get('[formcontrolname="email"]').last();
+    this.fillInput(firstNameInput, firstName);
+    this.fillInput(lastNameInput, lastName);
+    this.fillInput(emailInput, email);
+    return this;
+  }
+
+  addAnotherUser() {
+    cy.contains('Weiterer Member hinzufügen').click();
+    return this;
+  }
+  getFirstNames() {
+    return this.firstnames;
+  }
+
+  override submit() {
+    cy.getByTestId('invite').click();
+    return this.firstnames;
+  }
+
+  getPage(): Cypress.Chainable<JQuery<HTMLElement>> {
+    return cy.get('app-invite-user-dialog');
+  }
+}

frontend/cypress/support/helper/pom-helper/dialogs/keyResultDialog.ts

@@ -3,33 +3,33 @@ import { Unit } from '../../../../../src/app/shared/types/enums/Unit';
 
 export default class KeyResultDialog extends Dialog {
   fillKeyresultTitle(title: string) {
-    this.fillInput('titleInput', title);
+    this.fillInputByTestId('titleInput', title);
     return this;
   }
 
   fillKeyresultDescription(description: string) {
-    this.fillInput('descriptionInput', description);
+    this.fillInputByTestId('descriptionInput', description);
     return this;
   }
 
   withMetricValues(unit: Unit, baseline: string, stretchGoal: string) {
     cy.getByTestId('metricTab').click();
     cy.getByTestId('unit').select(unit);
-    this.fillInput('baseline', baseline);
-    this.fillInput('stretchGoal', stretchGoal);
+    this.fillInputByTestId('baseline', baseline);
+    this.fillInputByTestId('stretchGoal', stretchGoal);
     return this;
   }
 
   withOrdinalValues(commitZone: string, targetZone: string, stretchGoal: string) {
     cy.getByTestId('ordinalTab').click();
-    this.fillInput('commitZone', commitZone);
-    this.fillInput('targetZone', targetZone);
-    this.fillInput('stretchZone', stretchGoal);
+    this.fillInputByTestId('commitZone', commitZone);
+    this.fillInputByTestId('targetZone', targetZone);
+    this.fillInputByTestId('stretchZone', stretchGoal);
     return this;
   }
 
   fillOwner(owner: string) {
-    this.fillInput('ownerInput', owner);
+    this.fillInputByTestId('ownerInput', owner);
     return this;
   }
 

frontend/cypress/support/helper/pom-helper/dialogs/objectiveDialog.ts

@@ -2,12 +2,12 @@ import Dialog from './dialog';
 
 export default class ObjectiveDialog extends Dialog {
   fillObjectiveTitle(title: string) {
-    this.fillInput('title', title);
+    this.fillInputByTestId('title', title);
     return this;
   }
 
   fillObjectiveDescription(description: string) {
-    this.fillInput('description', description);
+    this.fillInputByTestId('description', description);
     return this;
   }
 

frontend/cypress/support/helper/pom-helper/dialogs/teamDialog.ts

@@ -7,7 +7,7 @@ export default class TeamDialog extends Dialog {
   }
 
   fillName(name: string) {
-    this.fillInput('add-team-name', name);
+    this.fillInputByTestId('add-team-name', name);
     return this;
   }
 

frontend/cypress/support/helper/pom-helper/pageObjectMapperBase.ts

@@ -5,7 +5,7 @@ export abstract class PageObjectMapperBase {
     return new this();
   }
 
-  check(arg: any) {
+  run(arg: any) {
     return this;
   }