refactor tabbing tests

puzzle · Nov 12, 2024 · 9b22d2b · 9b22d2b
1 parent 0b0151e
commit 9b22d2b
Show file tree

Hide file tree

Showing 3 changed files with 87 additions and 33 deletions.
diff --git a/frontend/cypress/e2e/tab.cy.ts b/frontend/cypress/e2e/tab.cy.ts
@@ -1,12 +1,15 @@
 import * as users from '../fixtures/users.json';
 import { onlyOn } from '@cypress/skip-test';
+import CyOverviewPage from '../support/helper/pom-helper/pages/overviewPage';
 
 describe('Tab workflow tests', () => {
+  let overviewPage: CyOverviewPage;
   beforeEach(() => {
-    cy.visit('/?quarter=2');
-    cy.loginAsUser(users.gl);
     onlyOn('chrome');
-    cy.getByTestId('logo').parent().focus();
+    cy.loginAsUser(users.gl);
+    overviewPage = new CyOverviewPage();
+    overviewPage.visitCurrentQuarter();
+    overviewPage.elements.logo().parent().focus();
   });
 
   function focusedShouldHaveTestId(testId: string) {
@@ -46,35 +49,78 @@ describe('Tab workflow tests', () => {
     tabAndCheck('add-keyResult', 'Key Result hinzufügen');
   });
 
-  it('should be able to tab through objective form', () => {
-    tabAndCheck('add-objective', 'Objective hinzufügen');
-    cy.realPress('Enter');
-    cy.contains('Objective für');
-    tabAndCheck('title');
-    cy.realType('title');
-    tabAndCheck('description');
-    cy.realType('description');
-    tabAndCheck('quarterSelect');
-    tabAndCheck('safe-draft');
-    tabAndCheck('safe');
-    tabAndCheck('cancel');
-  });
+  describe('Objective forms', () => {
+    it('objective add', () => {
+      tabAndCheck('add-objective', 'Objective hinzufügen');
+      cy.realPress('Enter');
+      cy.contains('h2', 'Objective für');
+      tabAndCheck('title');
+      cy.realType('title');
+      tabAndCheck('description');
+      cy.realType('description');
+      tabAndCheck('quarterSelect');
+      tabAndCheck('safe-draft');
+      tabAndCheck('safe');
+      tabAndCheck('cancel');
+    });
 
-  it('focus to three dot menu should be restored after edit objective', () => {
-    cy.get("[src='assets/icons/ongoing-icon.svg']").parentsUntil('#objective-column').last().focus();
-    tabAndCheck('three-dot-menu');
-    cy.realPress('Enter');
-    cy.focused().contains('Objective bearbeiten');
-    cy.realPress('Enter');
-    cy.contains('Objective von');
-    tabAndCheck('title');
-    cy.realType('title');
-    tabAndCheck('description');
-    cy.realType('description');
-    tabAndCheck('quarterSelect');
-    tabAndCheck('cancel', 'Abbrechen');
-    tabAndCheck('safe', 'Speichern');
-    cy.realPress('Enter');
-    focusedShouldHaveTestId('three-dot-menu');
+    it('focus to three dot menu should be restored after edit objective', () => {
+      overviewPage.getObjectiveByState('ongoing').focus();
+      tabAndCheck('three-dot-menu');
+      cy.realPress('Enter');
+      tabToThreeDotMenuOption('Objective bearbeiten');
+      cy.contains('h2', 'Objective von');
+      tabAndCheck('title');
+      cy.realType('title');
+      tabAndCheck('description');
+      cy.realType('description');
+      tabAndCheck('quarterSelect');
+      tabAndCheck('cancel', 'Abbrechen');
+      tabAndCheck('safe', 'Speichern');
+      cy.realPress('Enter');
+      focusedShouldHaveTestId('three-dot-menu');
+    });
+
+    it('objective complete', () => {
+      overviewPage.getObjectiveByState('ongoing').focus();
+      tabAndCheck('three-dot-menu');
+      cy.realPress('Enter');
+      tabToThreeDotMenuOption('Objective abschliessen');
+      cy.contains('h2', 'Objective abschliessen ');
+      focusedShouldHaveTestId('close-dialog');
+      cy.realPress('Tab');
+      cy.focused().contains('Objective erreicht');
+      cy.focused().contains('Objective nicht erreicht');
+      tabAndCheck('completeComment');
+      cy.realType('description');
+      cy.realPress('Tab');
+      cy.focused().contains('Abbrechen');
+      tabAndCheck('submit', 'Speichern');
+      cy.realPress('Enter');
+      focusedShouldHaveTestId('three-dot-menu');
+    });
+
+    it('objective to draft', () => {
+      overviewPage.getObjectiveByState('ongoing').focus();
+      tabAndCheck('three-dot-menu');
+      cy.realPress('Enter');
+      tabToThreeDotMenuOption('Objective als Draft speichern');
+      cy.contains('h2', 'Objective abschliessen ');
+      focusedShouldHaveTestId('close-dialog');
+      cy.realPress('Tab');
+      cy.focused().contains('Objective erreicht');
+      cy.focused().contains('Objective nicht erreicht');
+      tabAndCheck('completeComment');
+      cy.realType('description');
+      cy.realPress('Tab');
+      cy.focused().contains('Abbrechen');
+      tabAndCheck('submit', 'Speichern');
+      cy.realPress('Enter');
+      focusedShouldHaveTestId('three-dot-menu');
+    });
   });
 });
+function tabToThreeDotMenuOption(name: string) {
+  cy.tabForwardUntil(`:contains('${name}')`);
+  cy.realPress('Enter');
+}
diff --git a/frontend/cypress/support/helper/pom-helper/pages/overviewPage.ts b/frontend/cypress/support/helper/pom-helper/pages/overviewPage.ts
@@ -72,6 +72,14 @@ export default class CyOverviewPage extends Page {
     return getObjectiveColumns().filter(filterByObjectiveName(objectiveName));
   }
 
+  getObjectiveByState(state: string) {
+    return this.getObjectivesByState(state).first().scrollIntoView();
+  }
+
+  getObjectivesByState(state: string) {
+    return getObjectiveColumns().filter(filterByObjectiveState(state));
+  }
+
   getKeyresultByName(keyResultName: string) {
     return this.getKeyresultsByName(keyResultName).last().scrollIntoView();
   }

diff --git a/frontend/cypress/support/helper/utils.ts b/frontend/cypress/support/helper/utils.ts
@@ -11,7 +11,7 @@ export function pressUntilContains(text: string, key: keyof typeof keyCodeDefini
 }
 
 export function doUntilSelector(selector: string, tab: () => void, limit: number = 100, count: number = 0) {
-  const condition = (element: HTMLElement) => element.matches(selector);
+  const condition = (element: HTMLElement) => Cypress.$(element).is(selector);
   doUntil(condition, tab, limit, count);
 }