introduce overview pom

puzzle · Nov 8, 2024 · d588d61 · d588d61
1 parent fba300f
commit d588d61
Show file tree

Hide file tree

Showing 3 changed files with 60 additions and 31 deletions.
diff --git a/frontend/cypress/e2e/objective.cy.ts b/frontend/cypress/e2e/objective.cy.ts
@@ -1,8 +1,10 @@
 import * as users from '../fixtures/users.json';
 import { onlyOn } from '@cypress/skip-test';
-import { getObjectiveByNameAndState, selectFromThreeDotMenu } from '../support/objective-helper';
+import CyOverviewPage from '../support/OverviewPage';
 
 describe('OKR Objective e2e tests', () => {
+  const op = new CyOverviewPage();
+
   describe('tests via click', () => {
     describe('Functionality', () => {
       beforeEach(() => {
@@ -14,24 +16,24 @@ describe('OKR Objective e2e tests', () => {
         cy.getByTestId('add-objective').first().click();
         cy.fillOutObjective('A objective in state draft', 'safe-draft', undefined, '', false);
 
-        getObjectiveByNameAndState('A objective in state draft', 'draft').findByTestId('three-dot-menu').click();
-        selectFromThreeDotMenu('Objective veröffentlichen');
+        op.getObjectiveByNameAndState('A objective in state draft', 'draft').findByTestId('three-dot-menu').click();
+        op.selectFromThreeDotMenu('Objective veröffentlichen');
 
         cy.contains('Objective veröffentlichen');
         cy.contains('Soll dieses Objective veröffentlicht werden?');
         cy.getByTestId('confirm-yes').click();
 
-        getObjectiveByNameAndState('A objective in state draft', 'ongoing').should('exist');
+        op.getObjectiveByNameAndState('A objective in state draft', 'ongoing').should('exist');
       });
 
       it(`Complete Objective with Successful`, () => {
-        cy.getByTestId('add-objective').first().click();
+        op.addObjective();
         cy.fillOutObjective('We want to complete this successful', 'safe', undefined, '', false);
 
-        getObjectiveByNameAndState('We want to complete this successful', 'ongoing')
+        op.getObjectiveByNameAndState('We want to complete this successful', 'ongoing')
           .findByTestId('three-dot-menu')
           .click();
-        selectFromThreeDotMenu('Objective abschliessen');
+        op.selectFromThreeDotMenu('Objective abschliessen');
 
         cy.contains('Bewertung');
         cy.contains('Objective erreicht');
@@ -43,14 +45,14 @@ describe('OKR Objective e2e tests', () => {
         cy.getByTestId('successful').click();
         cy.getByTestId('submit').click();
 
-        getObjectiveByNameAndState('We want to complete this successful', 'successful');
+        op.getObjectiveByNameAndState('We want to complete this successful', 'successful');
       });
 
       it(`Complete Objective with Not-Successful`, () => {
         cy.getByTestId('add-objective').first().click();
         cy.fillOutObjective('A not successful objective', 'safe', undefined, '', false);
-        getObjectiveByNameAndState('A not successful objective', 'ongoing').findByTestId('three-dot-menu').click();
-        selectFromThreeDotMenu('Objective abschliessen');
+        op.getObjectiveByNameAndState('A not successful objective', 'ongoing').findByTestId('three-dot-menu').click();
+        op.selectFromThreeDotMenu('Objective abschliessen');
 
         cy.contains('Bewertung');
         cy.contains('Objective erreicht');
@@ -62,46 +64,48 @@ describe('OKR Objective e2e tests', () => {
         cy.getByTestId('not-successful').click();
         cy.getByTestId('submit').click();
 
-        getObjectiveByNameAndState('A not successful objective', 'not-successful');
+        op.getObjectiveByNameAndState('A not successful objective', 'not-successful');
       });
 
       it(`Reopen Successful Objective`, () => {
         cy.getByTestId('add-objective').first().click();
         cy.fillOutObjective('This objective will be reopened after', 'safe', undefined, '', false);
 
-        getObjectiveByNameAndState('This objective will be reopened after', 'ongoing')
+        op.getObjectiveByNameAndState('This objective will be reopened after', 'ongoing')
           .findByTestId('three-dot-menu')
           .click();
-        selectFromThreeDotMenu('Objective abschliessen');
+
+        op.selectFromThreeDotMenu('Objective abschliessen');
 
         cy.getByTestId('successful').click();
         cy.getByTestId('submit').click();
 
         cy.wait(500);
 
-        getObjectiveByNameAndState('This objective will be reopened after', 'successful')
+        op.getObjectiveByNameAndState('This objective will be reopened after', 'successful')
           .findByTestId('three-dot-menu')
           .click();
-        selectFromThreeDotMenu('Objective wiedereröffnen');
 
-        getObjectiveByNameAndState('This objective will be reopened after', 'ongoing').should('exist');
+        op.selectFromThreeDotMenu('Objective wiedereröffnen');
+
+        op.getObjectiveByNameAndState('This objective will be reopened after', 'ongoing').should('exist');
       });
 
       it('Ongoing objective back to draft state', () => {
         onlyOn('chrome');
         cy.getByTestId('add-objective').first().click();
         cy.fillOutObjective('This objective will be returned to draft state', 'safe', undefined, '', false);
 
-        getObjectiveByNameAndState('This objective will be returned to draft state', 'ongoing')
+        op.getObjectiveByNameAndState('This objective will be returned to draft state', 'ongoing')
           .findByTestId('three-dot-menu')
           .click();
-        selectFromThreeDotMenu('Objective als Draft speichern');
+        op.selectFromThreeDotMenu('Objective als Draft speichern');
 
         cy.contains('Objective als Draft speichern');
         cy.contains('Soll dieses Objective als Draft gespeichert werden?');
         cy.getByTestId('confirm-yes').click();
 
-        getObjectiveByNameAndState('This objective will be returned to draft state', 'draft').should('exist');
+        op.getObjectiveByNameAndState('This objective will be returned to draft state', 'draft').should('exist');
       });
 
       it(`Search for Objective`, () => {
@@ -154,8 +158,10 @@ describe('OKR Objective e2e tests', () => {
         cy.getByTestId('add-objective').first().click();
         cy.fillOutObjective('Move to another quarter on edit', 'safe', undefined, '', false);
 
-        getObjectiveByNameAndState('Move to another quarter on edit', 'ongoing').findByTestId('three-dot-menu').click();
-        selectFromThreeDotMenu('Objective bearbeiten');
+        op.getObjectiveByNameAndState('Move to another quarter on edit', 'ongoing')
+          .findByTestId('three-dot-menu')
+          .click();
+        op.selectFromThreeDotMenu('Objective bearbeiten');
 
         cy.fillOutObjective('Move to another quarter on edit', 'safe', '3', '', false);
 

diff --git a/frontend/cypress/support/OverviewPage.ts b/frontend/cypress/support/OverviewPage.ts
@@ -0,0 +1,32 @@
+import { getObjectivesByNameAndState } from './objective-helper';
+
+export default class CyOverviewPage {
+  visit() {
+    cy.visit('');
+  }
+
+  visitWithQuarter(quarter: number) {
+    cy.visit(`/?quarter=${quarter}`);
+  }
+
+  addObjective(teamName?: string) {
+    if (teamName) {
+      this.getTeamByName(teamName).find('.add-objective').first().click();
+      return;
+    }
+    cy.getByTestId('add-objective').first().click();
+  }
+
+  getTeamByName(teamName: string) {
+    return cy.contains(teamName).parentsUntil('.overview').last();
+  }
+
+  getObjectiveByNameAndState(objectiveName: string, state: string) {
+    return getObjectivesByNameAndState(objectiveName, state).first().should('exist');
+  }
+
+  selectFromThreeDotMenu(optionName: string) {
+    cy.contains(optionName).should('exist');
+    cy.get('.objective-three-dot-menu').contains(optionName).should('have.class', 'objective-menu-option').click();
+  }
+}
diff --git a/frontend/cypress/support/objective-helper.ts b/frontend/cypress/support/objective-helper.ts
@@ -1,13 +1,4 @@
-export function getObjectiveByNameAndState(objectiveName: string, state: string) {
-  return getObjectivesByNameAndState(objectiveName, state).first().should('exist');
-}
-
-export function selectFromThreeDotMenu(optionName: string) {
-  cy.contains(optionName).should('exist');
-  cy.get('.objective-three-dot-menu').contains(optionName).should('have.class', 'objective-menu-option').click();
-}
-
-function getObjectivesByNameAndState(objectiveName: string, state: string) {
+export function getObjectivesByNameAndState(objectiveName: string, state: string) {
   return getObjectiveColumns().filter(filterByObjectiveName(objectiveName)).filter(filterByObjectiveState(state));
 }