From 20945aab5f6b08a646ddbdb1c8f5565d3e5082f4 Mon Sep 17 00:00:00 2001 From: Yanick Minder Date: Thu, 19 Dec 2024 09:15:24 +0100 Subject: [PATCH] apply frontend formatter --- frontend/cypress.config.ts | 18 +- frontend/cypress/e2e/check-in.cy.ts | 330 +++---- .../cypress/e2e/duplicate-objective.cy.ts | 132 +-- frontend/cypress/e2e/key-result.cy.ts | 462 ++++----- frontend/cypress/e2e/login.cy.ts | 38 +- frontend/cypress/e2e/objective-backlog.cy.ts | 196 ++-- frontend/cypress/e2e/objective-crud.cy.ts | 102 +- frontend/cypress/e2e/objective.cy.ts | 280 +++--- frontend/cypress/e2e/overview.cy.ts | 44 +- frontend/cypress/e2e/routing.cy.ts | 20 +- frontend/cypress/e2e/scoring.cy.ts | 132 +-- frontend/cypress/e2e/tab.cy.ts | 492 +++++----- frontend/cypress/e2e/team.cy.ts | 180 ++-- frontend/cypress/e2e/teammanagement.cy.ts | 550 +++++------ frontend/cypress/support/commands.ts | 78 +- frontend/cypress/support/component.ts | 4 +- frontend/cypress/support/e2e.ts | 10 +- .../helper/dom-helper/angularSearchBox.ts | 12 +- .../dom-helper/dialogs/checkInDialog.ts | 76 +- .../dialogs/checkInHistoryDialog.ts | 16 +- .../dom-helper/dialogs/confirmDialog.ts | 12 +- .../helper/dom-helper/dialogs/dialog.ts | 10 +- .../dom-helper/dialogs/inviteMembersDialog.ts | 20 +- .../dom-helper/dialogs/keyResultDialog.ts | 80 +- .../dom-helper/dialogs/objectiveDialog.ts | 22 +- .../helper/dom-helper/dialogs/teamDialog.ts | 10 +- .../support/helper/dom-helper/filterHelper.ts | 24 +- .../helper/dom-helper/pageObjectMapperBase.ts | 8 +- .../dom-helper/pages/keyResultDetailPage.ts | 28 +- .../helper/dom-helper/pages/overviewPage.ts | 82 +- .../support/helper/dom-helper/pages/page.ts | 4 +- .../dom-helper/pages/teammanagementPage.ts | 48 +- .../cypress/support/helper/keyResultHelper.ts | 2 +- .../cypress/support/helper/objectiveHelper.ts | 2 +- .../cypress/support/helper/scoringSupport.ts | 100 +- frontend/cypress/support/helper/utils.ts | 16 +- frontend/package.json | 4 +- frontend/setup-jest.ts | 2 +- frontend/src/app/app-routing.module.ts | 84 +- frontend/src/app/app.component.spec.ts | 78 +- frontend/src/app/app.component.ts | 28 +- frontend/src/app/app.module.ts | 212 ++-- .../action-plan/action-plan.component.spec.ts | 114 ++- .../action-plan/action-plan.component.ts | 54 +- .../application-banner.component.spec.ts | 88 +- .../application-banner.component.ts | 24 +- .../application-top-bar.component.spec.ts | 102 +- .../application-top-bar.component.ts | 32 +- .../check-in-history-dialog.component.spec.ts | 66 +- .../check-in-history-dialog.component.ts | 36 +- .../check-in-form-metric.component.spec.ts | 72 +- .../check-in-form-metric.component.ts | 48 +- .../metric-check-in-directive.spec.ts | 44 +- .../metric-check-in-directive.ts | 30 +- .../check-in-form-ordinal.component.spec.ts | 70 +- .../check-in-form-ordinal.component.ts | 16 +- .../check-in-form.component.spec.ts | 174 ++-- .../check-in-form/check-in-form.component.ts | 86 +- .../confidence/confidence.component.spec.ts | 60 +- .../confidence/confidence.component.ts | 16 +- .../key-result-form.component.spec.ts | 276 +++--- .../key-result-form.component.ts | 120 +-- .../keyresult-detail.component.html | 4 +- .../keyresult-detail.component.spec.ts | 104 +- .../keyresult-detail.component.ts | 78 +- .../keyresult-dialog.component.spec.ts | 822 ++++++++-------- .../keyresult-dialog.component.ts | 92 +- .../keyresult-type.component.spec.ts | 224 +++-- .../keyresult-type.component.ts | 80 +- .../keyresult/keyresult.component.spec.ts | 28 +- .../keyresult/keyresult.component.ts | 28 +- .../objective-detail.component.html | 2 +- .../objective-detail.component.spec.ts | 66 +- .../objective-detail.component.ts | 46 +- .../objective-filter.component.spec.ts | 96 +- .../objective-filter.component.ts | 30 +- .../objective/ObjectiveMenuActions.ts | 78 +- .../objective/ObjectiveMenuAfterActions.ts | 40 +- .../objective/objective.component.spec.ts | 124 +-- .../objective/objective.component.ts | 46 +- .../overview/overview.component.spec.ts | 171 ++-- .../components/overview/overview.component.ts | 42 +- .../quarter-filter.component.spec.ts | 104 +- .../quarter-filter.component.ts | 40 +- .../team-filter/team-filter.component.spec.ts | 400 ++++---- .../team-filter/team-filter.component.ts | 41 +- .../components/team/team.component.spec.ts | 138 +-- .../src/app/components/team/team.component.ts | 54 +- frontend/src/app/guards/auth.guard.spec.ts | 68 +- frontend/src/app/guards/auth.guard.ts | 10 +- .../interceptors/error-interceptor.service.ts | 70 +- .../interceptors/error.interceptor.spec.ts | 395 ++++---- .../interceptors/oauth.interceptor.spec.ts | 16 +- .../src/app/interceptors/oauth.interceptor.ts | 32 +- .../src/app/services/action.service.spec.ts | 12 +- frontend/src/app/services/action.service.ts | 12 +- .../src/app/services/check-in.service.spec.ts | 18 +- frontend/src/app/services/check-in.service.ts | 16 +- frontend/src/app/services/completed.servce.ts | 14 +- .../app/services/completed.service.spec.ts | 12 +- .../src/app/services/config.service.spec.ts | 12 +- frontend/src/app/services/config.service.ts | 12 +- .../services/customization.service.spec.ts | 136 +-- .../src/app/services/customization.service.ts | 32 +- .../src/app/services/dialog.service.spec.ts | 110 +-- frontend/src/app/services/dialog.service.ts | 64 +- .../app/services/keyresult.service.spec.ts | 12 +- .../src/app/services/keyresult.service.ts | 20 +- .../objective-menu-actions.service.spec.ts | 58 +- .../objective-menu-actions.service.ts | 50 +- .../app/services/objective.service.spec.ts | 12 +- .../src/app/services/objective.service.ts | 56 +- .../src/app/services/overview.service.spec.ts | 32 +- frontend/src/app/services/overview.service.ts | 22 +- .../src/app/services/quarter.service.spec.ts | 12 +- frontend/src/app/services/quarter.service.ts | 18 +- .../app/services/refresh-data.service.spec.ts | 8 +- .../src/app/services/refresh-data.service.ts | 8 +- .../src/app/services/team.service.spec.ts | 12 +- frontend/src/app/services/team.service.ts | 19 +- .../src/app/services/toaster.service.spec.ts | 74 +- frontend/src/app/services/toaster.service.ts | 14 +- .../src/app/services/user.service.spec.ts | 46 +- frontend/src/app/services/user.service.ts | 24 +- frontend/src/app/shared/common.spec.ts | 588 ++++++----- frontend/src/app/shared/common.ts | 48 +- frontend/src/app/shared/constantLibary.ts | 120 ++- .../dialog-template-core.component.ts | 12 +- .../okr-tangram/okr-tangram.component.ts | 14 +- .../puzzle-icon-button.component.ts | 18 +- .../puzzle-icon/puzzle-icon.component.ts | 12 +- .../custom/scoring/scoring.component.html | 2 +- .../custom/scoring/scoring.component.spec.ts | 212 ++-- .../custom/scoring/scoring.component.ts | 78 +- .../custom/spinner/spinner.component.ts | 10 +- frontend/src/app/shared/customRouter.ts | 6 +- .../complete-dialog.component.spec.ts | 114 +-- .../complete-dialog.component.ts | 46 +- .../confirm-dialog.component.spec.ts | 66 +- .../confirm-dialog.component.ts | 24 +- .../example-dialog.component.spec.ts | 136 +-- .../example-dialog.component.ts | 42 +- .../objective-form.component.html | 2 +- .../objective-form.component.spec.ts | 489 +++++----- .../objective-form.component.ts | 174 ++-- .../unit-transformation.pipe.spec.ts | 44 +- .../unit-transformation.pipe.ts | 20 +- frontend/src/app/shared/regexLibrary.ts | 4 +- frontend/src/app/shared/routeUtils.spec.ts | 28 +- frontend/src/app/shared/routeUtils.ts | 4 +- frontend/src/app/shared/shared.module.ts | 60 +- .../shared/sidepanel/sidepanel.component.ts | 48 +- frontend/src/app/shared/testData.ts | 916 +++++++++--------- .../src/app/shared/types/DTOs/KeyResultDTO.ts | 30 +- .../shared/types/DTOs/KeyResultMetricDTO.ts | 8 +- .../shared/types/DTOs/KeyResultOrdinalDTO.ts | 8 +- .../src/app/shared/types/enums/ButtonState.ts | 6 +- .../src/app/shared/types/enums/CloseState.ts | 8 +- .../src/app/shared/types/enums/HttpType.ts | 8 +- frontend/src/app/shared/types/enums/State.ts | 8 +- .../src/app/shared/types/enums/ToasterType.ts | 6 +- frontend/src/app/shared/types/enums/Unit.ts | 10 +- .../src/app/shared/types/enums/UserRole.ts | 6 +- frontend/src/app/shared/types/enums/Zone.ts | 8 +- frontend/src/app/shared/types/menu-entry.ts | 14 +- frontend/src/app/shared/types/model/Action.ts | 12 +- .../src/app/shared/types/model/CheckIn.ts | 18 +- .../app/shared/types/model/CheckInMetric.ts | 4 +- .../shared/types/model/CheckInMetricMin.ts | 4 +- .../src/app/shared/types/model/CheckInMin.ts | 14 +- .../app/shared/types/model/CheckInOrdinal.ts | 4 +- .../shared/types/model/CheckInOrdinalMin.ts | 4 +- .../app/shared/types/model/ClientConfig.ts | 20 +- .../src/app/shared/types/model/Completed.ts | 10 +- .../src/app/shared/types/model/KeyResult.ts | 28 +- .../app/shared/types/model/KeyResultMetric.ts | 12 +- .../shared/types/model/KeyResultMetricMin.ts | 12 +- .../shared/types/model/KeyResultObjective.ts | 10 +- .../shared/types/model/KeyResultOrdinal.ts | 12 +- .../shared/types/model/KeyResultOrdinalMin.ts | 12 +- .../app/shared/types/model/KeyresultMin.ts | 8 +- .../src/app/shared/types/model/NewUser.ts | 6 +- .../src/app/shared/types/model/NewUserForm.ts | 6 +- .../src/app/shared/types/model/Objective.ts | 28 +- .../app/shared/types/model/ObjectiveMin.ts | 18 +- .../app/shared/types/model/OverviewEntity.ts | 10 +- .../src/app/shared/types/model/Quarter.ts | 6 +- .../src/app/shared/types/model/QuarterMin.ts | 4 +- frontend/src/app/shared/types/model/Team.ts | 8 +- .../src/app/shared/types/model/TeamMin.ts | 4 +- frontend/src/app/shared/types/model/User.ts | 16 +- .../src/app/shared/types/model/UserOkrData.ts | 10 +- .../app/shared/types/model/UserTableEntry.ts | 34 +- .../src/app/shared/types/model/UserTeam.ts | 8 +- frontend/src/app/shared/validators.ts | 34 +- .../add-edit-team-dialog.component.spec.ts | 108 ++- .../add-edit-team-dialog.component.ts | 48 +- ...dd-member-to-team-dialog.component.spec.ts | 98 +- .../add-member-to-team-dialog.component.ts | 69 +- .../add-user-team.component.spec.ts | 62 +- .../add-user-team/add-user-team.component.ts | 56 +- .../delete-user/delete-user.component.spec.ts | 184 ++-- .../delete-user/delete-user.component.ts | 96 +- .../edit-okr-champion.component.ts | 18 +- .../invite-user-dialog.component.spec.ts | 92 +- .../invite-user-dialog.component.ts | 36 +- .../member-detail.component.spec.ts | 112 +-- .../member-detail/member-detail.component.ts | 60 +- .../member-list-mobile.component.spec.ts | 30 +- .../member-list-mobile.component.ts | 22 +- .../member-list-table.component.spec.ts | 136 +-- .../member-list-table.component.ts | 69 +- .../member-list/member-list.component.spec.ts | 231 ++--- .../member-list/member-list.component.ts | 63 +- .../new-user/new-user.component.spec.ts | 36 +- .../new-user/new-user.component.ts | 28 +- .../new-user/unique-mail.directive.spec.ts | 28 +- .../new-user/unique-mail.validator.ts | 12 +- .../team-management/okr-champion.pipe.spec.ts | 16 +- .../app/team-management/okr-champion.pipe.ts | 10 +- .../src/app/team-management/roles.pipe.ts | 14 +- .../search-team-management.component.spec.ts | 208 ++-- .../search-team-management.component.ts | 73 +- .../show-edit-role.component.spec.ts | 24 +- .../show-edit-role.component.ts | 26 +- .../team-list/team-list.component.spec.ts | 38 +- .../team-list/team-list.component.ts | 24 +- .../team-management-banner.component.spec.ts | 56 +- .../team-management-banner.component.ts | 14 +- ...management-mobile-filter.component.spec.ts | 84 +- ...team-management-mobile-filter.component.ts | 44 +- .../team-management-routing.module.ts | 56 +- .../team-management.component.spec.ts | 82 +- .../team-management.component.ts | 8 +- .../team-management/team-management.module.ts | 92 +- .../team-role-dropdown.component.spec.ts | 26 +- .../team-role-dropdown.component.ts | 12 +- .../app/team-management/teams.pipe.spec.ts | 48 +- .../src/app/team-management/teams.pipe.ts | 14 +- frontend/src/app/version.ts | 2 +- frontend/src/environments/environment.prod.ts | 26 +- frontend/src/environments/environment.ts | 26 +- frontend/src/global.ts | 2 +- frontend/src/main.ts | 10 +- 244 files changed, 8642 insertions(+), 8012 deletions(-) diff --git a/frontend/cypress.config.ts b/frontend/cypress.config.ts index 6edad78dd3..f8b883dc2e 100644 --- a/frontend/cypress.config.ts +++ b/frontend/cypress.config.ts @@ -1,14 +1,14 @@ -import { defineConfig } from 'cypress' +import { defineConfig } from "cypress"; export default defineConfig({ - e2e: { - baseUrl: 'http://pitc.okr.localhost:4200', - experimentalMemoryManagement: true, - testIsolation: true, - viewportWidth: 1920, - viewportHeight: 1080 + "e2e": { + "baseUrl": "http://pitc.okr.localhost:4200", + "experimentalMemoryManagement": true, + "testIsolation": true, + "viewportWidth": 1920, + "viewportHeight": 1080 }, - env: { - login_url: 'http://localhost:8544' + "env": { + "login_url": "http://localhost:8544" } }); diff --git a/frontend/cypress/e2e/check-in.cy.ts b/frontend/cypress/e2e/check-in.cy.ts index 04b68b877f..e52b2416a9 100644 --- a/frontend/cypress/e2e/check-in.cy.ts +++ b/frontend/cypress/e2e/check-in.cy.ts @@ -1,14 +1,14 @@ -import * as users from '../fixtures/users.json'; -import { uniqueSuffix } from '../support/helper/utils'; -import CyOverviewPage from '../support/helper/dom-helper/pages/overviewPage'; -import { Unit } from '../../src/app/shared/types/enums/Unit'; -import KeyResultDetailPage from '../support/helper/dom-helper/pages/keyResultDetailPage'; -import CheckInDialog from '../support/helper/dom-helper/dialogs/checkInDialog'; -import CheckInHistoryDialog from '../support/helper/dom-helper/dialogs/checkInHistoryDialog'; -import ConfirmDialog from '../support/helper/dom-helper/dialogs/confirmDialog'; +import * as users from "../fixtures/users.json"; +import { uniqueSuffix } from "../support/helper/utils"; +import CyOverviewPage from "../support/helper/dom-helper/pages/overviewPage"; +import { Unit } from "../../src/app/shared/types/enums/Unit"; +import KeyResultDetailPage from "../support/helper/dom-helper/pages/keyResultDetailPage"; +import CheckInDialog from "../support/helper/dom-helper/dialogs/checkInDialog"; +import CheckInHistoryDialog from "../support/helper/dom-helper/dialogs/checkInHistoryDialog"; +import ConfirmDialog from "../support/helper/dom-helper/dialogs/confirmDialog"; -describe('OKR Check-in e2e tests', () => { - describe('tests via click', () => { +describe("OKR Check-in e2e tests", () => { + describe("tests via click", () => { let overviewPage = new CyOverviewPage(); let keyresultDetailPage = new KeyResultDetailPage(); @@ -18,288 +18,288 @@ describe('OKR Check-in e2e tests', () => { cy.loginAsUser(users.gl); }); - it(`Create checkin metric`, () => { + it("Create checkin metric", () => { overviewPage .addKeyResult() - .fillKeyResultTitle('Very important keyresult') - .withMetricValues(Unit.PERCENT, '21', '51') - .fillKeyResultDescription('This is my description') + .fillKeyResultTitle("Very important keyresult") + .withMetricValues(Unit.PERCENT, "21", "51") + .fillKeyResultDescription("This is my description") .submit(); keyresultDetailPage - .visit('Very important keyresult') + .visit("Very important keyresult") .createCheckIn() .checkForDialogTextMetric() - .fillMetricCheckInValue('30') + .fillMetricCheckInValue("30") .setCheckInConfidence(6) - .fillCheckInCommentary('We bought a new house') - .fillCheckInInitiatives('We have to buy more PCs') + .fillCheckInCommentary("We bought a new house") + .fillCheckInInitiatives("We have to buy more PCs") .submit(); - cy.contains('30%'); - cy.contains('6/10'); - cy.contains('Letztes Check-in (' + getCurrentDate() + ')'); - cy.contains('We bought a new house'); + cy.contains("30%"); + cy.contains("6/10"); + cy.contains("Letztes Check-in (" + getCurrentDate() + ")"); + cy.contains("We bought a new house"); }); - it(`Create checkin metric with confidence 0`, () => { + it("Create checkin metric with confidence 0", () => { overviewPage .addKeyResult() - .fillKeyResultTitle('Very important keyresult') - .withMetricValues(Unit.PERCENT, '21', '51') - .fillKeyResultDescription('This is my description') + .fillKeyResultTitle("Very important keyresult") + .withMetricValues(Unit.PERCENT, "21", "51") + .fillKeyResultDescription("This is my description") .submit(); keyresultDetailPage - .visit('Very important keyresult') + .visit("Very important keyresult") .createCheckIn() - .fillMetricCheckInValue('30') + .fillMetricCheckInValue("30") .setCheckInConfidence(0) - .fillCheckInCommentary('We bought a new house') - .fillCheckInInitiatives('We have to buy more PCs') + .fillCheckInCommentary("We bought a new house") + .fillCheckInInitiatives("We have to buy more PCs") .submit(); - cy.contains('30%'); - cy.contains('6/10'); - cy.contains('Letztes Check-in (' + getCurrentDate() + ')'); - cy.contains('We bought a new house'); + cy.contains("30%"); + cy.contains("6/10"); + cy.contains("Letztes Check-in (" + getCurrentDate() + ")"); + cy.contains("We bought a new house"); }); - it(`Create checkin metric with value below baseline`, () => { + it("Create checkin metric with value below baseline", () => { overviewPage .addKeyResult() - .fillKeyResultTitle('This will not be good') - .withMetricValues(Unit.PERCENT, '21', '52') - .fillKeyResultDescription('This is my description') + .fillKeyResultTitle("This will not be good") + .withMetricValues(Unit.PERCENT, "21", "52") + .fillKeyResultDescription("This is my description") .submit(); keyresultDetailPage - .visit('This will not be good') + .visit("This will not be good") .createCheckIn() - .fillMetricCheckInValue('5') + .fillMetricCheckInValue("5") .setCheckInConfidence(5) .submit(); - cy.contains('5%'); - cy.contains('!'); - cy.contains('5/10'); - cy.contains('Letztes Check-in (' + getCurrentDate() + ')'); + cy.contains("5%"); + cy.contains("!"); + cy.contains("5/10"); + cy.contains("Letztes Check-in (" + getCurrentDate() + ")"); }); - it('Create checkin ordinal', () => { + it("Create checkin ordinal", () => { overviewPage .addKeyResult() - .fillKeyResultTitle('A new ordinal keyresult for our company') - .withOrdinalValues('New house', 'New car', 'New pool') - .fillKeyResultDescription('This is my description') + .fillKeyResultTitle("A new ordinal keyresult for our company") + .withOrdinalValues("New house", "New car", "New pool") + .fillKeyResultDescription("This is my description") .submit(); keyresultDetailPage - .visit('A new ordinal keyresult for our company') + .visit("A new ordinal keyresult for our company") .createCheckIn() .checkForDialogTextOrdinal() - .selectOrdinalCheckInZone('commit') + .selectOrdinalCheckInZone("commit") .setCheckInConfidence(6) - .fillCheckInCommentary('There is a new car') - .fillCheckInInitiatives('Buy a new pool') + .fillCheckInCommentary("There is a new car") + .fillCheckInInitiatives("Buy a new pool") .submit(); - cy.contains('6/10'); - cy.contains('There is a new car'); - cy.contains('Letztes Check-in (' + getCurrentDate() + ')'); + cy.contains("6/10"); + cy.contains("There is a new car"); + cy.contains("Letztes Check-in (" + getCurrentDate() + ")"); }); - it('Should generate checkin list', () => { + it("Should generate checkin list", () => { overviewPage .addKeyResult() - .fillKeyResultTitle('This will give a checkin list') - .withMetricValues(Unit.PERCENT, '21', '52') - .fillKeyResultDescription('This is my description') + .fillKeyResultTitle("This will give a checkin list") + .withMetricValues(Unit.PERCENT, "21", "52") + .fillKeyResultDescription("This is my description") .submit(); keyresultDetailPage - .visit('This will give a checkin list') + .visit("This will give a checkin list") .createCheckIn() - .fillMetricCheckInValue('30') + .fillMetricCheckInValue("30") .setCheckInConfidence(5) - .fillCheckInCommentary('We bought a new house') - .fillCheckInInitiatives('We have to buy more PCs') + .fillCheckInCommentary("We bought a new house") + .fillCheckInInitiatives("We have to buy more PCs") .submit(); keyresultDetailPage .createCheckIn() - .fillMetricCheckInValue('50') + .fillMetricCheckInValue("50") .setCheckInConfidence(6) - .fillCheckInCommentary('This was a good idea') - .fillCheckInInitiatives('Will be difficult') + .fillCheckInCommentary("This was a good idea") + .fillCheckInInitiatives("Will be difficult") .submit(); keyresultDetailPage .showAllCheckins() - .checkForAttribute('Confidence:', '5 / 10') - .checkForAttribute('Confidence:', '6 / 10') - .checkForAttribute('Veränderungen:', 'We bought a new house') - .checkForAttribute('Veränderungen:', 'This was a good idea') - .checkForAttribute('Massnahmen:', 'We have to buy more PCs') - .checkForAttribute('Massnahmen:', 'Will be difficult'); + .checkForAttribute("Confidence:", "5 / 10") + .checkForAttribute("Confidence:", "6 / 10") + .checkForAttribute("Veränderungen:", "We bought a new house") + .checkForAttribute("Veränderungen:", "This was a good idea") + .checkForAttribute("Massnahmen:", "We have to buy more PCs") + .checkForAttribute("Massnahmen:", "Will be difficult"); - cy.contains('Check-in History'); + cy.contains("Check-in History"); cy.contains(getCurrentDate()); - cy.contains('Wert: 30%'); - cy.contains('Wert: 50%'); + cy.contains("Wert: 30%"); + cy.contains("Wert: 50%"); }); - it('Edit metric checkin', () => { + it("Edit metric checkin", () => { overviewPage .addKeyResult() - .fillKeyResultTitle('Here we edit a metric checkin') - .withMetricValues(Unit.CHF, '10', '300') - .fillKeyResultDescription('This is my description') + .fillKeyResultTitle("Here we edit a metric checkin") + .withMetricValues(Unit.CHF, "10", "300") + .fillKeyResultDescription("This is my description") .submit(); keyresultDetailPage - .visit('Here we edit a metric checkin') + .visit("Here we edit a metric checkin") .createCheckIn() - .fillMetricCheckInValue('30') + .fillMetricCheckInValue("30") .setCheckInConfidence(5) - .fillCheckInCommentary('Here we are') - .fillCheckInInitiatives('A cat would be great') + .fillCheckInCommentary("Here we are") + .fillCheckInInitiatives("A cat would be great") .submit(); - cy.contains('Aktuell: 30 CHF'); + cy.contains("Aktuell: 30 CHF"); keyresultDetailPage.showAllCheckins(); - cy.contains('Check-in History'); - cy.contains('Wert: 30 CHF'); + cy.contains("Check-in History"); + cy.contains("Wert: 30 CHF"); CheckInHistoryDialog.do() .editLatestCheckIn(); - cy.contains('Here we edit a metric checkin'); - cy.contains('30 CHF'); - cy.contains('Confidence um Target Zone (213 CHF) zu erreichen'); - cy.contains('5/10'); - cy.contains('Here we are'); - cy.contains('A cat would be great'); + cy.contains("Here we edit a metric checkin"); + cy.contains("30 CHF"); + cy.contains("Confidence um Target Zone (213 CHF) zu erreichen"); + cy.contains("5/10"); + cy.contains("Here we are"); + cy.contains("A cat would be great"); CheckInDialog.do() - .fillMetricCheckInValue('200') - .fillCheckInCommentary('We bought a new sheep') + .fillMetricCheckInValue("200") + .fillCheckInCommentary("We bought a new sheep") .submit(); - cy.contains('200 CHF'); - cy.contains('We bought a new sheep'); + cy.contains("200 CHF"); + cy.contains("We bought a new sheep"); }); - it('Should generate right labels in checkin history list', () => { + it("Should generate right labels in checkin history list", () => { overviewPage .addKeyResult() - .fillKeyResultTitle('A new KeyResult for checking checkin list') - .withMetricValues(Unit.EUR, '10', '300') - .fillKeyResultDescription('This is my description') + .fillKeyResultTitle("A new KeyResult for checking checkin list") + .withMetricValues(Unit.EUR, "10", "300") + .fillKeyResultDescription("This is my description") .submit(); keyresultDetailPage - .visit('A new KeyResult for checking checkin list') + .visit("A new KeyResult for checking checkin list") .createCheckIn() - .fillMetricCheckInValue('30') + .fillMetricCheckInValue("30") .setCheckInConfidence(5) - .fillCheckInCommentary('Here we are') - .fillCheckInInitiatives('A cat would be great') + .fillCheckInCommentary("Here we are") + .fillCheckInInitiatives("A cat would be great") .submit(); - cy.contains('Aktuell: 30 EUR'); + cy.contains("Aktuell: 30 EUR"); keyresultDetailPage.showAllCheckins(); - cy.contains('Check-in History'); - cy.contains('Wert: 30 EUR'); + cy.contains("Check-in History"); + cy.contains("Wert: 30 EUR"); CheckInHistoryDialog.do() .close(); keyresultDetailPage.close(); overviewPage .addKeyResult() - .fillKeyResultTitle('There is another kr with fte') - .withMetricValues(Unit.FTE, '10', '300') - .fillKeyResultDescription('This is my description') + .fillKeyResultTitle("There is another kr with fte") + .withMetricValues(Unit.FTE, "10", "300") + .fillKeyResultDescription("This is my description") .submit(); keyresultDetailPage - .visit('There is another kr with fte') + .visit("There is another kr with fte") .createCheckIn() - .fillMetricCheckInValue('30') + .fillMetricCheckInValue("30") .setCheckInConfidence(5) - .fillCheckInCommentary('Here we are') - .fillCheckInInitiatives('A cat would be great') + .fillCheckInCommentary("Here we are") + .fillCheckInInitiatives("A cat would be great") .submit(); - cy.contains('Aktuell: 30 FTE'); + cy.contains("Aktuell: 30 FTE"); keyresultDetailPage.showAllCheckins(); - cy.contains('Check-in History'); - cy.contains('Wert: 30 FTE'); + cy.contains("Check-in History"); + cy.contains("Wert: 30 FTE"); }); - it('Edit ordinal checkin', () => { + it("Edit ordinal checkin", () => { overviewPage .addKeyResult() - .fillKeyResultTitle('For editing ordinal checkin') - .withOrdinalValues('New house', 'New car', 'New pool') - .fillKeyResultDescription('This is my description') + .fillKeyResultTitle("For editing ordinal checkin") + .withOrdinalValues("New house", "New car", "New pool") + .fillKeyResultDescription("This is my description") .submit(); keyresultDetailPage - .visit('For editing ordinal checkin') + .visit("For editing ordinal checkin") .createCheckIn() - .selectOrdinalCheckInZone('fail') + .selectOrdinalCheckInZone("fail") .setCheckInConfidence(6) - .fillCheckInCommentary('There is a new car') - .fillCheckInInitiatives('Buy now a new pool') + .fillCheckInCommentary("There is a new car") + .fillCheckInInitiatives("Buy now a new pool") .submit(); keyresultDetailPage.showAllCheckins() .editLatestCheckIn(); - cy.contains('For editing ordinal checkin'); - cy.contains('Confidence um Target Zone zu erreichen'); - cy.contains('6/10'); - cy.contains('There is a new car'); - cy.contains('Buy now a new pool'); + cy.contains("For editing ordinal checkin"); + cy.contains("Confidence um Target Zone zu erreichen"); + cy.contains("6/10"); + cy.contains("There is a new car"); + cy.contains("Buy now a new pool"); CheckInDialog.do() - .selectOrdinalCheckInZone('stretch') - .fillCheckInCommentary('We bought a new dog') + .selectOrdinalCheckInZone("stretch") + .fillCheckInCommentary("We bought a new dog") .submit(); - cy.contains('We bought a new dog'); - cy.contains('Buy now a new pool'); - cy.contains('STRETCH'); + cy.contains("We bought a new dog"); + cy.contains("Buy now a new pool"); + cy.contains("STRETCH"); }); - it(`Should display confirm dialog when creating checkin on draft objective`, () => { + it("Should display confirm dialog when creating checkin on draft objective", () => { overviewPage.addObjective() - .fillObjectiveTitle('draft objective title') - .selectQuarter('3') + .fillObjectiveTitle("draft objective title") + .selectQuarter("3") .submitDraftObjective(); overviewPage.visitNextQuarter(); overviewPage - .addKeyResult(undefined, 'draft objective title') - .fillKeyResultTitle('I am a metric keyresult for testing') - .withMetricValues(Unit.PERCENT, '21', '52') - .fillKeyResultDescription('This is my description') + .addKeyResult(undefined, "draft objective title") + .fillKeyResultTitle("I am a metric keyresult for testing") + .withMetricValues(Unit.PERCENT, "21", "52") + .fillKeyResultDescription("This is my description") .submit(); - keyresultDetailPage.visit('I am a metric keyresult for testing'); + keyresultDetailPage.visit("I am a metric keyresult for testing"); keyresultDetailPage.elements.addCheckin() .click(); ConfirmDialog.do() - .checkTitle('Check-in im Draft-Status'); + .checkTitle("Check-in im Draft-Status"); ConfirmDialog.do() - .checkDescription('Dein Objective befindet sich noch im DRAFT Status. Möchtest du das Check-in trotzdem erfassen?'); + .checkDescription("Dein Objective befindet sich noch im DRAFT Status. Möchtest du das Check-in trotzdem erfassen?"); }); - it(`Should only display last value div if last checkin is present`, () => { - const objectiveName = uniqueSuffix('new objective'); + it("Should only display last value div if last checkin is present", () => { + const objectiveName = uniqueSuffix("new objective"); overviewPage.addObjective() .fillObjectiveTitle(objectiveName) - .selectQuarter('3') + .selectQuarter("3") .submit(); overviewPage.visitNextQuarter(); overviewPage .addKeyResult(undefined, objectiveName) - .fillKeyResultTitle('I am a keyresult metric') - .withMetricValues(Unit.PERCENT, '45', '60') - .fillKeyResultDescription('Description') + .fillKeyResultTitle("I am a keyresult metric") + .withMetricValues(Unit.PERCENT, "45", "60") + .fillKeyResultDescription("Description") .submit(); - keyresultDetailPage.visit('I am a keyresult metric') + keyresultDetailPage.visit("I am a keyresult metric") .createCheckIn(); - cy.getByTestId('old-checkin-value') - .should('not.exist'); + cy.getByTestId("old-checkin-value") + .should("not.exist"); CheckInDialog.do() - .fillMetricCheckInValue('10') + .fillMetricCheckInValue("10") .setCheckInConfidence(0) - .fillCheckInCommentary('changeinfo') - .fillCheckInInitiatives('initiatives') + .fillCheckInCommentary("changeinfo") + .fillCheckInInitiatives("initiatives") .submit(); cy.contains(`Letztes Check-in (${getCurrentDate()})`); keyresultDetailPage.createCheckIn(); - cy.contains('Letzter Wert') - .siblings('div') - .contains('10%'); + cy.contains("Letzter Wert") + .siblings("div") + .contains("10%"); }); }); }); @@ -310,10 +310,10 @@ function getCurrentDate () { const mm = today.getMonth() + 1; // Months start at 0! const dd = today.getDate(); - let dd_str = '' + dd; - let mm_str = '' + mm; - if (dd < 10) dd_str = '0' + dd_str; - if (mm < 10) mm_str = '0' + mm_str; + let dd_str = "" + dd; + let mm_str = "" + mm; + if (dd < 10) dd_str = "0" + dd_str; + if (mm < 10) mm_str = "0" + mm_str; - return dd_str + '.' + mm_str + '.' + yyyy; + return dd_str + "." + mm_str + "." + yyyy; } diff --git a/frontend/cypress/e2e/duplicate-objective.cy.ts b/frontend/cypress/e2e/duplicate-objective.cy.ts index 896c841339..2dcb03447d 100644 --- a/frontend/cypress/e2e/duplicate-objective.cy.ts +++ b/frontend/cypress/e2e/duplicate-objective.cy.ts @@ -1,7 +1,7 @@ -import * as users from '../fixtures/users.json'; -import CyOverviewPage from '../support/helper/dom-helper/pages/overviewPage'; -import KeyResultDetailPage from '../support/helper/dom-helper/pages/keyResultDetailPage'; -import ObjectiveDialog from '../support/helper/dom-helper/dialogs/objectiveDialog'; +import * as users from "../fixtures/users.json"; +import CyOverviewPage from "../support/helper/dom-helper/pages/overviewPage"; +import KeyResultDetailPage from "../support/helper/dom-helper/pages/keyResultDetailPage"; +import ObjectiveDialog from "../support/helper/dom-helper/dialogs/objectiveDialog"; let overviewPage = new CyOverviewPage(); @@ -10,141 +10,143 @@ beforeEach(() => { cy.loginAsUser(users.gl); }); -describe('Functionality of duplicating objectives and their belonging keyResults', () => { - const firstKeyResultName = 'New structure that rewards funny guys and innovation before the end of Q1.'; - const secondKeyResultName = 'Monthly town halls between our people and leadership teams over the next four months.'; - const thirdKeyResultName = 'High employee satisfaction scores (80%+) throughout the year.'; +describe("Functionality of duplicating objectives and their belonging keyResults", () => { + const firstKeyResultName = "New structure that rewards funny guys and innovation before the end of Q1."; + const secondKeyResultName = "Monthly town halls between our people and leadership teams over the next four months."; + const thirdKeyResultName = "High employee satisfaction scores (80%+) throughout the year."; - it('Should be able to duplicate a objective into this quarter, including all keyResults', () => { - const duplicatedTitle = 'This is a duplicated objective with all keyResults'; + it("Should be able to duplicate a objective into this quarter, including all keyResults", () => { + const duplicatedTitle = "This is a duplicated objective with all keyResults"; overviewPage - .duplicateObjective('Build a company culture that kills the competition.') + .duplicateObjective("Build a company culture that kills the competition.") .fillObjectiveTitle(duplicatedTitle) .submit(); cy.contains(duplicatedTitle); overviewPage.getKeyResultOfObjective(duplicatedTitle, firstKeyResultName) - .should('exist'); + .should("exist"); overviewPage.getKeyResultOfObjective(duplicatedTitle, secondKeyResultName) - .should('exist'); + .should("exist"); overviewPage.getKeyResultOfObjective(duplicatedTitle, thirdKeyResultName) - .should('exist'); + .should("exist"); }); - it('Should be able to duplicate a objective into this quarter, only including one keyResult', () => { - const duplicatedTitle = 'This is a duplicated objective with one keyResult'; + it("Should be able to duplicate a objective into this quarter, only including one keyResult", () => { + const duplicatedTitle = "This is a duplicated objective with one keyResult"; overviewPage - .duplicateObjective('Build a company culture that kills the competition.') + .duplicateObjective("Build a company culture that kills the competition.") .fillObjectiveTitle(duplicatedTitle) - .excludeKeyResults([secondKeyResultName, - thirdKeyResultName]) + .excludeKeyResults([ + secondKeyResultName, + thirdKeyResultName + ]) .submit(); overviewPage.getKeyResultOfObjective(duplicatedTitle, firstKeyResultName); overviewPage .getAllKeyResultsOfObjective(duplicatedTitle) - .should('not.contain', secondKeyResultName) - .should('not.contain', thirdKeyResultName); + .should("not.contain", secondKeyResultName) + .should("not.contain", thirdKeyResultName); }); - it('Should not show option to select keyResults when objective with no keyResults is being duplicated', () => { - const duplicatedTitle = 'This is a duplicated objective without any keyResults'; + it("Should not show option to select keyResults when objective with no keyResults is being duplicated", () => { + const duplicatedTitle = "This is a duplicated objective without any keyResults"; - overviewPage.duplicateObjective('should not appear on staging, no sea takimata sanctus est Lorem ipsum dolor sit amet.'); - cy.contains('Key Results:') - .should('not.exist'); + overviewPage.duplicateObjective("should not appear on staging, no sea takimata sanctus est Lorem ipsum dolor sit amet."); + cy.contains("Key Results:") + .should("not.exist"); ObjectiveDialog.do() .fillObjectiveTitle(duplicatedTitle) .submit(); overviewPage.getObjectiveByName(duplicatedTitle) - .should('exist'); + .should("exist"); }); - it('Should be able to duplicate a objective into the next quarter, including all keyResults', () => { - const duplicatedTitle = 'This is a default objective with all keyResults in quarter 3!'; + it("Should be able to duplicate a objective into the next quarter, including all keyResults", () => { + const duplicatedTitle = "This is a default objective with all keyResults in quarter 3!"; overviewPage - .duplicateObjective('Build a company culture that kills the competition.') + .duplicateObjective("Build a company culture that kills the competition.") .fillObjectiveTitle(duplicatedTitle) - .selectQuarter('3') + .selectQuarter("3") .submit(); overviewPage.visitNextQuarter(); cy.contains(duplicatedTitle); overviewPage.getKeyResultOfObjective(duplicatedTitle, firstKeyResultName) - .should('exist'); + .should("exist"); overviewPage.getKeyResultOfObjective(duplicatedTitle, secondKeyResultName) - .should('exist'); + .should("exist"); overviewPage.getKeyResultOfObjective(duplicatedTitle, thirdKeyResultName) - .should('exist'); + .should("exist"); }); - it('Should not duplicate objective when cancel button is clicked', () => { - const duplicatedTitle = 'This is a never existing objective'; + it("Should not duplicate objective when cancel button is clicked", () => { + const duplicatedTitle = "This is a never existing objective"; overviewPage - .duplicateObjective('Build a company culture that kills the competition.') + .duplicateObjective("Build a company culture that kills the competition.") .fillObjectiveTitle(duplicatedTitle) - .fillObjectiveDescription('Wow this is a very nice description!') + .fillObjectiveDescription("Wow this is a very nice description!") .cancel(); cy.contains(duplicatedTitle) - .should('not.exist'); + .should("not.exist"); }); }); -describe('Verify functionality of scoring adjustment on duplicated objectives', () => { +describe("Verify functionality of scoring adjustment on duplicated objectives", () => { const keyresultDetailPage = new KeyResultDetailPage(); - it('Duplicate ordinal checkin and validate value of scoring component', () => { + it("Duplicate ordinal checkin and validate value of scoring component", () => { overviewPage - .addKeyResult('Puzzle ITC', 'Wir wollen die Kundenzufriedenheit steigern') - .fillKeyResultTitle('stretch keyresult for testing') - .withOrdinalValues('Ex. val', 'Ex. val', 'Ex. val') + .addKeyResult("Puzzle ITC", "Wir wollen die Kundenzufriedenheit steigern") + .fillKeyResultTitle("stretch keyresult for testing") + .withOrdinalValues("Ex. val", "Ex. val", "Ex. val") .submit(); - cy.contains('stretch keyresult for testing'); + cy.contains("stretch keyresult for testing"); keyresultDetailPage - .visit('stretch keyresult for testing') + .visit("stretch keyresult for testing") .createCheckIn() - .selectOrdinalCheckInZone('stretch') + .selectOrdinalCheckInZone("stretch") .setCheckInConfidence(8) - .fillCheckInCommentary('Testveränderungen') - .fillCheckInInitiatives('Testmassnahmen') + .fillCheckInCommentary("Testveränderungen") + .fillCheckInInitiatives("Testmassnahmen") .submit(); - cy.intercept('GET', '**/overview?*') - .as('indexPage'); + cy.intercept("GET", "**/overview?*") + .as("indexPage"); keyresultDetailPage.close(); - cy.wait('@indexPage'); + cy.wait("@indexPage"); overviewPage - .duplicateObjective('Wir wollen die Kundenzufriedenheit steigern') - .fillObjectiveTitle('A duplicated Objective for this tool') - .selectQuarter('3') + .duplicateObjective("Wir wollen die Kundenzufriedenheit steigern") + .fillObjectiveTitle("A duplicated Objective for this tool") + .selectQuarter("3") .submit(); - overviewPage.checkForToaster('Das Objective wurde erfolgreich erstellt.', 'success'); + overviewPage.checkForToaster("Das Objective wurde erfolgreich erstellt.", "success"); overviewPage.visitNextQuarter(); overviewPage - .getKeyResultByName('stretch keyresult for testing') - .findByTestId('scoring-component') - .findByTestId('fail') - .as('fail-area'); + .getKeyResultByName("stretch keyresult for testing") + .findByTestId("scoring-component") + .findByTestId("fail") + .as("fail-area"); - cy.get('@fail-area') + cy.get("@fail-area") .should(($fail) => { - expect($fail).not.to.have.css('score-red'); - expect($fail).not.to.have.css('score-yellow'); - expect($fail).not.to.have.css('score-green'); - expect($fail).not.to.have.css('score-stretch'); + expect($fail).not.to.have.css("score-red"); + expect($fail).not.to.have.css("score-yellow"); + expect($fail).not.to.have.css("score-green"); + expect($fail).not.to.have.css("score-stretch"); }); }); }); diff --git a/frontend/cypress/e2e/key-result.cy.ts b/frontend/cypress/e2e/key-result.cy.ts index 45d45af130..7f4a7ba647 100644 --- a/frontend/cypress/e2e/key-result.cy.ts +++ b/frontend/cypress/e2e/key-result.cy.ts @@ -1,10 +1,10 @@ -import * as users from '../fixtures/users.json'; -import CyOverviewPage from '../support/helper/dom-helper/pages/overviewPage'; -import KeyResultDetailPage from '../support/helper/dom-helper/pages/keyResultDetailPage'; -import { Unit } from '../../src/app/shared/types/enums/Unit'; -import KeyResultDialog from '../support/helper/dom-helper/dialogs/keyResultDialog'; +import * as users from "../fixtures/users.json"; +import CyOverviewPage from "../support/helper/dom-helper/pages/overviewPage"; +import KeyResultDetailPage from "../support/helper/dom-helper/pages/keyResultDetailPage"; +import { Unit } from "../../src/app/shared/types/enums/Unit"; +import KeyResultDialog from "../support/helper/dom-helper/dialogs/keyResultDialog"; -describe('OKR Overview', () => { +describe("OKR Overview", () => { let overviewPage = new CyOverviewPage(); let keyResultDetailPage = new KeyResultDetailPage(); @@ -14,346 +14,346 @@ describe('OKR Overview', () => { cy.loginAsUser(users.gl); }); - it('Create new metric KeyResult', () => { + it("Create new metric KeyResult", () => { overviewPage .addKeyResult() .checkForDialogTextMetric() - .fillKeyResultTitle('I am a metric keyresult') - .withMetricValues(Unit.PERCENT, '21', '52') - .fillOwner('Bob Baumeister') - .fillKeyResultDescription('This is my description') + .fillKeyResultTitle("I am a metric keyresult") + .withMetricValues(Unit.PERCENT, "21", "52") + .fillOwner("Bob Baumeister") + .fillKeyResultDescription("This is my description") .submit(); - keyResultDetailPage.visit('I am a metric keyresult'); - - cy.contains('I am a metric keyresult'); - cy.contains('Metrisch'); - cy.contains('Bob Baumeister'); - cy.contains('21%'); - cy.contains('52%'); - cy.contains('Stretch'); - cy.contains('Confidence'); - cy.contains('Beschrieb'); - cy.contains('This is my description'); - cy.contains('Check-in erfassen'); - cy.contains('Key Result bearbeiten'); + keyResultDetailPage.visit("I am a metric keyresult"); + + cy.contains("I am a metric keyresult"); + cy.contains("Metrisch"); + cy.contains("Bob Baumeister"); + cy.contains("21%"); + cy.contains("52%"); + cy.contains("Stretch"); + cy.contains("Confidence"); + cy.contains("Beschrieb"); + cy.contains("This is my description"); + cy.contains("Check-in erfassen"); + cy.contains("Key Result bearbeiten"); }); - it('Create new ordinal KeyResult', () => { + it("Create new ordinal KeyResult", () => { overviewPage .addKeyResult() - .fillKeyResultTitle('I am a ordinal keyresult') - .withOrdinalValues('My commit zone', 'My target zone', 'My stretch goal') + .fillKeyResultTitle("I am a ordinal keyresult") + .withOrdinalValues("My commit zone", "My target zone", "My stretch goal") .checkForDialogTextOrdinal() - .fillOwner('Bob Baumeister') - .fillKeyResultDescription('This is my description') + .fillOwner("Bob Baumeister") + .fillKeyResultDescription("This is my description") .submit(); - keyResultDetailPage.visit('I am a ordinal keyresult'); - - cy.contains('I am a ordinal keyresult'); - cy.contains('Ordinal'); - cy.contains('Bob Baumeister'); - cy.contains('Fail'); - cy.contains('Commit'); - cy.contains('Target'); - cy.contains('My commit zone'); - cy.contains('My target zone'); - cy.contains('My stretch goal'); - cy.contains('Stretch'); - cy.contains('Confidence'); - cy.contains('Beschrieb'); - cy.contains('This is my description'); - cy.contains('Check-in erfassen'); - cy.contains('Key Result bearbeiten'); + keyResultDetailPage.visit("I am a ordinal keyresult"); + + cy.contains("I am a ordinal keyresult"); + cy.contains("Ordinal"); + cy.contains("Bob Baumeister"); + cy.contains("Fail"); + cy.contains("Commit"); + cy.contains("Target"); + cy.contains("My commit zone"); + cy.contains("My target zone"); + cy.contains("My stretch goal"); + cy.contains("Stretch"); + cy.contains("Confidence"); + cy.contains("Beschrieb"); + cy.contains("This is my description"); + cy.contains("Check-in erfassen"); + cy.contains("Key Result bearbeiten"); }); - it('Create new KeyResult and Save and New', () => { + it("Create new KeyResult and Save and New", () => { overviewPage .addKeyResult() .checkForDialogTextMetric() - .fillKeyResultTitle('I am a metric keyresult with a new one') - .withMetricValues(Unit.PERCENT, '21', '52') - .fillOwner('Bob Baumeister') - .fillKeyResultDescription('This is my description when creating and then open a new') + .fillKeyResultTitle("I am a metric keyresult with a new one") + .withMetricValues(Unit.PERCENT, "21", "52") + .fillOwner("Bob Baumeister") + .fillKeyResultDescription("This is my description when creating and then open a new") .saveAndNew(); - cy.contains('Jaya Norris'); + cy.contains("Jaya Norris"); KeyResultDialog.do() .checkForDialogTextMetric(); }); - it('Create and edit KeyResult with Action Plan', () => { + it("Create and edit KeyResult with Action Plan", () => { overviewPage .addKeyResult() - .fillKeyResultTitle('This is a keyresult with an action plan') - .withOrdinalValues('My commit zone', 'My target zone', 'My stretch goal') - .fillOwner('Bob Baumeister') - .fillKeyResultDescription('This is my description') - .addActionPlanElement('A new car') - .addActionPlanElement('A new house') - .addActionPlanElement('A new company') + .fillKeyResultTitle("This is a keyresult with an action plan") + .withOrdinalValues("My commit zone", "My target zone", "My stretch goal") + .fillOwner("Bob Baumeister") + .fillKeyResultDescription("This is my description") + .addActionPlanElement("A new car") + .addActionPlanElement("A new house") + .addActionPlanElement("A new company") .submit(); - keyResultDetailPage.visit('This is a keyresult with an action plan'); + keyResultDetailPage.visit("This is a keyresult with an action plan"); - cy.contains('This is a keyresult with an action plan'); - cy.contains('Ordinal'); - cy.contains('My commit zone'); - cy.contains('My target zone'); - cy.contains('My stretch goal'); - cy.contains('A new car'); - cy.contains('A new house'); - cy.contains('A new company'); + cy.contains("This is a keyresult with an action plan"); + cy.contains("Ordinal"); + cy.contains("My commit zone"); + cy.contains("My target zone"); + cy.contains("My stretch goal"); + cy.contains("A new car"); + cy.contains("A new house"); + cy.contains("A new company"); keyResultDetailPage.editKeyResult(); - cy.getByTestId('actionInput') - .should('have.length', 3); + cy.getByTestId("actionInput") + .should("have.length", 3); }); - it('Edit a KeyResult without type change', () => { + it("Edit a KeyResult without type change", () => { overviewPage .addKeyResult() - .fillKeyResultTitle('We want not to change keyresult title') - .withOrdinalValues('My commit zone', 'My target zone', 'My stretch goal') + .fillKeyResultTitle("We want not to change keyresult title") + .withOrdinalValues("My commit zone", "My target zone", "My stretch goal") .checkForDialogTextOrdinal() - .fillKeyResultDescription('This is my description') + .fillKeyResultDescription("This is my description") .submit(); - keyResultDetailPage.visit('We want not to change keyresult title') + keyResultDetailPage.visit("We want not to change keyresult title") .editKeyResult(); - cy.getByTestId('submit') - .should('not.be.disabled'); - cy.contains('Key Result bearbeiten'); - cy.getByTestId('titleInput') - .should('have.value', 'We want not to change keyresult title'); - cy.getByTestId('commitZone') - .should('have.value', 'My commit zone'); - cy.getByTestId('targetZone') - .should('have.value', 'My target zone'); - cy.getByTestId('stretchZone') - .should('have.value', 'My stretch goal'); - cy.getByTestId('ownerInput') - .should('have.value', 'Jaya Norris'); - cy.getByTestId('descriptionInput') - .should('have.value', 'This is my description'); + cy.getByTestId("submit") + .should("not.be.disabled"); + cy.contains("Key Result bearbeiten"); + cy.getByTestId("titleInput") + .should("have.value", "We want not to change keyresult title"); + cy.getByTestId("commitZone") + .should("have.value", "My commit zone"); + cy.getByTestId("targetZone") + .should("have.value", "My target zone"); + cy.getByTestId("stretchZone") + .should("have.value", "My stretch goal"); + cy.getByTestId("ownerInput") + .should("have.value", "Jaya Norris"); + cy.getByTestId("descriptionInput") + .should("have.value", "This is my description"); KeyResultDialog.do() - .fillKeyResultTitle('This is the new title') - .withOrdinalValues('New commit', 'New target', 'New stretch') - .fillKeyResultDescription('This is my new description') + .fillKeyResultTitle("This is the new title") + .withOrdinalValues("New commit", "New target", "New stretch") + .fillKeyResultDescription("This is my new description") .submit(); - cy.contains('This is the new title'); - cy.contains('New commit'); - cy.contains('New target'); - cy.contains('New stretch'); - cy.contains('Jaya Norris'); - cy.contains('This is my new description'); + cy.contains("This is the new title"); + cy.contains("New commit"); + cy.contains("New target"); + cy.contains("New stretch"); + cy.contains("Jaya Norris"); + cy.contains("This is my new description"); }); - it('Edit a KeyResult with type change', () => { + it("Edit a KeyResult with type change", () => { overviewPage .addKeyResult() - .fillKeyResultTitle('Here we want to change keyresult title') - .withOrdinalValues('My commit zone', 'My target zone', 'My stretch goal') + .fillKeyResultTitle("Here we want to change keyresult title") + .withOrdinalValues("My commit zone", "My target zone", "My stretch goal") .checkForDialogTextOrdinal() - .fillKeyResultDescription('This is my description') - .addActionPlanElement('Action 1') - .addActionPlanElement('Action 2') + .fillKeyResultDescription("This is my description") + .addActionPlanElement("Action 1") + .addActionPlanElement("Action 2") .submit(); - keyResultDetailPage.visit('Here we want to change keyresult title') + keyResultDetailPage.visit("Here we want to change keyresult title") .editKeyResult(); - cy.getByTestId('submit') - .should('not.be.disabled'); - cy.contains('Key Result bearbeiten'); - cy.getByTestId('titleInput') - .should('have.value', 'Here we want to change keyresult title'); - cy.getByTestId('commitZone') - .should('have.value', 'My commit zone'); - cy.getByTestId('targetZone') - .should('have.value', 'My target zone'); - cy.getByTestId('stretchZone') - .should('have.value', 'My stretch goal'); - cy.getByTestId('ownerInput') - .should('have.value', 'Jaya Norris'); - cy.getByTestId('descriptionInput') - .should('have.value', 'This is my description'); + cy.getByTestId("submit") + .should("not.be.disabled"); + cy.contains("Key Result bearbeiten"); + cy.getByTestId("titleInput") + .should("have.value", "Here we want to change keyresult title"); + cy.getByTestId("commitZone") + .should("have.value", "My commit zone"); + cy.getByTestId("targetZone") + .should("have.value", "My target zone"); + cy.getByTestId("stretchZone") + .should("have.value", "My stretch goal"); + cy.getByTestId("ownerInput") + .should("have.value", "Jaya Norris"); + cy.getByTestId("descriptionInput") + .should("have.value", "This is my description"); KeyResultDialog.do() - .fillKeyResultTitle('This is my new title for the new metric keyresult') - .withMetricValues(Unit.PERCENT, '21', '56') - .fillKeyResultDescription('This is my new description') + .fillKeyResultTitle("This is my new title for the new metric keyresult") + .withMetricValues(Unit.PERCENT, "21", "56") + .fillKeyResultDescription("This is my new description") .submit(); - cy.contains('This is my new title for the new metric keyresult'); - cy.contains('21%'); - cy.contains('56%'); - cy.contains('Metrisch'); - cy.contains('Jaya Norris'); - cy.contains('This is my new description'); - cy.contains('Action 1'); - cy.contains('Action 2'); + cy.contains("This is my new title for the new metric keyresult"); + cy.contains("21%"); + cy.contains("56%"); + cy.contains("Metrisch"); + cy.contains("Jaya Norris"); + cy.contains("This is my new description"); + cy.contains("Action 1"); + cy.contains("Action 2"); }); - it('A KeyResult should not be able to change type after a checkin', () => { + it("A KeyResult should not be able to change type after a checkin", () => { overviewPage .addKeyResult() - .fillKeyResultTitle('Here we want to create a checkin') - .withOrdinalValues('My commit zone', 'My target zone', 'My stretch goal') + .fillKeyResultTitle("Here we want to create a checkin") + .withOrdinalValues("My commit zone", "My target zone", "My stretch goal") .checkForDialogTextOrdinal() - .fillKeyResultDescription('This is my description') - .addActionPlanElement('Action 1') - .addActionPlanElement('Action 2') + .fillKeyResultDescription("This is my description") + .addActionPlanElement("Action 1") + .addActionPlanElement("Action 2") .submit(); keyResultDetailPage - .visit('Here we want to create a checkin') + .visit("Here we want to create a checkin") .createCheckIn() - .selectOrdinalCheckInZone('commit') + .selectOrdinalCheckInZone("commit") .setCheckInConfidence(6) .submit(); keyResultDetailPage.close(); - keyResultDetailPage.visit('Here we want to create a checkin') + keyResultDetailPage.visit("Here we want to create a checkin") .editKeyResult(); - cy.getByTestId('metricTab') - .should('have.class', 'non-active'); + cy.getByTestId("metricTab") + .should("have.class", "non-active"); }); - it('Check validation in keyresult dialog', () => { + it("Check validation in keyresult dialog", () => { overviewPage.addKeyResult() .checkForDialogTextMetric(); - cy.getByTestId('submit') - .should('be.disabled'); + cy.getByTestId("submit") + .should("be.disabled"); KeyResultDialog.do() - .fillKeyResultTitle('I am a metric keyresult') - .withMetricValues(Unit.PERCENT, '21', '52') - .fillKeyResultDescription('This is my description'); + .fillKeyResultTitle("I am a metric keyresult") + .withMetricValues(Unit.PERCENT, "21", "52") + .fillKeyResultDescription("This is my description"); - cy.getByTestId('submit') - .should('not.be.disabled'); + cy.getByTestId("submit") + .should("not.be.disabled"); - cy.getByTestId('titleInput') + cy.getByTestId("titleInput") .clear(); - cy.getByTestId('submit') - .should('be.disabled'); - cy.contains('Titel muss folgende Länge haben: 2-250 Zeichen'); + cy.getByTestId("submit") + .should("be.disabled"); + cy.contains("Titel muss folgende Länge haben: 2-250 Zeichen"); KeyResultDialog.do() - .fillKeyResultTitle('My title'); - cy.getByTestId('submit') - .should('not.be.disabled'); - cy.getByTestId('baseline') + .fillKeyResultTitle("My title"); + cy.getByTestId("submit") + .should("not.be.disabled"); + cy.getByTestId("baseline") .clear(); - cy.getByTestId('submit') - .should('be.disabled'); - cy.contains('Baseline muss eine Zahl sein'); + cy.getByTestId("submit") + .should("be.disabled"); + cy.contains("Baseline muss eine Zahl sein"); KeyResultDialog.do() - .withMetricValues(Unit.PERCENT, 'abc', '52'); - cy.getByTestId('submit') - .should('be.disabled'); - cy.contains('Baseline muss eine Zahl sein'); + .withMetricValues(Unit.PERCENT, "abc", "52"); + cy.getByTestId("submit") + .should("be.disabled"); + cy.contains("Baseline muss eine Zahl sein"); KeyResultDialog.do() - .withMetricValues(Unit.PERCENT, '45', '52'); - cy.getByTestId('submit') - .should('not.be.disabled'); - cy.getByTestId('stretchGoal') + .withMetricValues(Unit.PERCENT, "45", "52"); + cy.getByTestId("submit") + .should("not.be.disabled"); + cy.getByTestId("stretchGoal") .clear(); - cy.getByTestId('submit') - .should('be.disabled'); - cy.contains('Stretch Goal muss eine Zahl sein'); + cy.getByTestId("submit") + .should("be.disabled"); + cy.contains("Stretch Goal muss eine Zahl sein"); KeyResultDialog.do() - .withMetricValues(Unit.PERCENT, '45', 'abc'); - cy.getByTestId('submit') - .should('be.disabled'); - cy.contains('Stretch Goal muss eine Zahl sein'); + .withMetricValues(Unit.PERCENT, "45", "abc"); + cy.getByTestId("submit") + .should("be.disabled"); + cy.contains("Stretch Goal muss eine Zahl sein"); KeyResultDialog.do() - .withMetricValues(Unit.PERCENT, '45', '83'); - cy.getByTestId('submit') - .should('not.be.disabled'); - cy.getByTestId('ownerInput') + .withMetricValues(Unit.PERCENT, "45", "83"); + cy.getByTestId("submit") + .should("not.be.disabled"); + cy.getByTestId("ownerInput") .clear(); - cy.getByTestId('submit') - .should('be.disabled'); + cy.getByTestId("submit") + .should("be.disabled"); - cy.getByTestId('ownerInput') - .type('abc'); - cy.getByTestId('titleInput') - .type('Hello'); - cy.getByTestId('submit') - .should('be.disabled'); - cy.contains('Owner muss ausgewählt sein'); + cy.getByTestId("ownerInput") + .type("abc"); + cy.getByTestId("titleInput") + .type("Hello"); + cy.getByTestId("submit") + .should("be.disabled"); + cy.contains("Owner muss ausgewählt sein"); KeyResultDialog.do() - .fillOwner('Bob Baumeister'); - cy.getByTestId('submit') - .should('not.be.disabled'); + .fillOwner("Bob Baumeister"); + cy.getByTestId("submit") + .should("not.be.disabled"); - cy.getByTestId('ordinalTab') + cy.getByTestId("ordinalTab") .click(); - cy.getByTestId('submit') - .should('be.disabled'); + cy.getByTestId("submit") + .should("be.disabled"); KeyResultDialog.do() - .withOrdinalValues('Commit', 'Target', 'Stretch'); - cy.getByTestId('submit') - .should('not.be.disabled'); + .withOrdinalValues("Commit", "Target", "Stretch"); + cy.getByTestId("submit") + .should("not.be.disabled"); - cy.getByTestId('commitZone') + cy.getByTestId("commitZone") .clear(); - cy.getByTestId('submit') - .should('be.disabled'); - cy.contains('Commit Zone muss folgende Länge haben: 1-400 Zeichen'); + cy.getByTestId("submit") + .should("be.disabled"); + cy.contains("Commit Zone muss folgende Länge haben: 1-400 Zeichen"); KeyResultDialog.do() - .withOrdinalValues('Commit', 'Target', 'Stretch'); - cy.getByTestId('submit') - .should('not.be.disabled'); - cy.getByTestId('targetZone') + .withOrdinalValues("Commit", "Target", "Stretch"); + cy.getByTestId("submit") + .should("not.be.disabled"); + cy.getByTestId("targetZone") .clear(); - cy.getByTestId('submit') - .should('be.disabled'); - cy.contains('Target Zone muss folgende Länge haben: 1-400 Zeichen'); + cy.getByTestId("submit") + .should("be.disabled"); + cy.contains("Target Zone muss folgende Länge haben: 1-400 Zeichen"); KeyResultDialog.do() - .withOrdinalValues('Commit', 'Target', 'Stretch'); - cy.getByTestId('submit') - .should('not.be.disabled'); - cy.getByTestId('stretchZone') + .withOrdinalValues("Commit", "Target", "Stretch"); + cy.getByTestId("submit") + .should("not.be.disabled"); + cy.getByTestId("stretchZone") .clear(); - cy.getByTestId('submit') - .should('be.disabled'); - cy.contains('Stretch Zone muss folgende Länge haben: 1-400 Zeichen'); + cy.getByTestId("submit") + .should("be.disabled"); + cy.contains("Stretch Zone muss folgende Länge haben: 1-400 Zeichen"); KeyResultDialog.do() - .withOrdinalValues('Commit', 'Target', 'Stretch'); - cy.getByTestId('submit') - .should('not.be.disabled'); + .withOrdinalValues("Commit", "Target", "Stretch"); + cy.getByTestId("submit") + .should("not.be.disabled"); }); - it('Delete existing keyresult', () => { + it("Delete existing keyresult", () => { overviewPage .addKeyResult() - .fillKeyResultTitle('A keyresult to delete') - .withOrdinalValues('My commit zone', 'My target zone', 'My stretch goal') + .fillKeyResultTitle("A keyresult to delete") + .withOrdinalValues("My commit zone", "My target zone", "My stretch goal") .checkForDialogTextOrdinal() - .fillKeyResultDescription('This is my description') + .fillKeyResultDescription("This is my description") .submit(); keyResultDetailPage - .visit('A keyresult to delete') + .visit("A keyresult to delete") .editKeyResult() .deleteKeyResult() - .checkTitle('Key Result löschen') - .checkDescription('Möchtest du dieses Key Result wirklich löschen? Zugehörige Check-ins werden dadurch ebenfalls gelöscht!') + .checkTitle("Key Result löschen") + .checkDescription("Möchtest du dieses Key Result wirklich löschen? Zugehörige Check-ins werden dadurch ebenfalls gelöscht!") .submit(); - cy.contains('Puzzle ITC'); - cy.get('A keyresult to delete') - .should('not.exist'); + cy.contains("Puzzle ITC"); + cy.get("A keyresult to delete") + .should("not.exist"); }); }); diff --git a/frontend/cypress/e2e/login.cy.ts b/frontend/cypress/e2e/login.cy.ts index 2ab584f05c..dfe84ec8d3 100644 --- a/frontend/cypress/e2e/login.cy.ts +++ b/frontend/cypress/e2e/login.cy.ts @@ -1,42 +1,42 @@ -import * as users from '../fixtures/users.json'; +import * as users from "../fixtures/users.json"; -describe('OKR Login', () => { +describe("OKR Login", () => { beforeEach(() => { cy.loginAsUser(users.gl); }); - it('Login and check correct name is displayed', () => { + it("Login and check correct name is displayed", () => { cy.title() - .should('equal', 'Puzzle OKR'); - cy.getByTestId('user-name') + .should("equal", "Puzzle OKR"); + cy.getByTestId("user-name") .contains(users.gl.name); }); - it('Login and logout', () => { + it("Login and logout", () => { cy.title() - .should('equal', 'Puzzle OKR'); - cy.getByTestId('user-options') + .should("equal", "Puzzle OKR"); + cy.getByTestId("user-options") .click(); - cy.getByTestId('logout') + cy.getByTestId("logout") .click(); - cy.origin(Cypress.env('login_url'), () => { + cy.origin(Cypress.env("login_url"), () => { cy.url() - .should('include', Cypress.env('login_url')); - cy.get('#kc-page-title') - .contains('Sign in to your account'); + .should("include", Cypress.env("login_url")); + cy.get("#kc-page-title") + .contains("Sign in to your account"); }); }); - it('Click on the Hilfe button should open a new tab with the correct URL', () => { + it("Click on the Hilfe button should open a new tab with the correct URL", () => { cy.window() .then((win) => { - cy.stub(win, 'open') - .as('openWindow'); + cy.stub(win, "open") + .as("openWindow"); }); - cy.get('#hilfeButton') + cy.get("#hilfeButton") .click(); - cy.get('@openWindow') - .should('be.calledWith', 'https://wiki.puzzle.ch/Puzzle/OKRs'); + cy.get("@openWindow") + .should("be.calledWith", "https://wiki.puzzle.ch/Puzzle/OKRs"); }); }); diff --git a/frontend/cypress/e2e/objective-backlog.cy.ts b/frontend/cypress/e2e/objective-backlog.cy.ts index f14d53ba52..cf9e3a315e 100644 --- a/frontend/cypress/e2e/objective-backlog.cy.ts +++ b/frontend/cypress/e2e/objective-backlog.cy.ts @@ -1,8 +1,8 @@ -import * as users from '../fixtures/users.json'; -import CyOverviewPage from '../support/helper/dom-helper/pages/overviewPage'; -import ObjectiveDialog from '../support/helper/dom-helper/dialogs/objectiveDialog'; +import * as users from "../fixtures/users.json"; +import CyOverviewPage from "../support/helper/dom-helper/pages/overviewPage"; +import ObjectiveDialog from "../support/helper/dom-helper/dialogs/objectiveDialog"; -describe('OKR Objective Backlog e2e tests', () => { +describe("OKR Objective Backlog e2e tests", () => { let overviewPage = new CyOverviewPage(); beforeEach(() => { @@ -10,201 +10,201 @@ describe('OKR Objective Backlog e2e tests', () => { cy.loginAsUser(users.gl); }); - it(`Create Objective in backlog quarter should not have save button`, () => { + it("Create Objective in backlog quarter should not have save button", () => { overviewPage .addObjective() - .fillObjectiveTitle('Objective in quarter backlog') - .selectQuarter('Backlog') - .run(cy.contains('Speichern') - .should('not.exist')) - .run(cy.contains('Als Draft speichern')) + .fillObjectiveTitle("Objective in quarter backlog") + .selectQuarter("Backlog") + .run(cy.contains("Speichern") + .should("not.exist")) + .run(cy.contains("Als Draft speichern")) .submitDraftObjective(); - cy.contains('Objective in quarter backlog') - .should('not.exist'); + cy.contains("Objective in quarter backlog") + .should("not.exist"); overviewPage.visitBacklogQuarter(); - cy.contains('Objective in quarter backlog'); + cy.contains("Objective in quarter backlog"); }); - it(`Edit Objective and move to backlog`, () => { + it("Edit Objective and move to backlog", () => { overviewPage.addObjective() - .fillObjectiveTitle('Move to another quarter on edit') + .fillObjectiveTitle("Move to another quarter on edit") .submitDraftObjective(); overviewPage - .getObjectiveByNameAndState('Move to another quarter on edit', 'draft') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("Move to another quarter on edit", "draft") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective bearbeiten'); + overviewPage.selectFromThreeDotMenu("Objective bearbeiten"); ObjectiveDialog.do() - .fillObjectiveTitle('This goes now to backlog') - .selectQuarter('Backlog') + .fillObjectiveTitle("This goes now to backlog") + .selectQuarter("Backlog") .submit(); - cy.contains('This goes now to backlog') - .should('not.exist'); + cy.contains("This goes now to backlog") + .should("not.exist"); overviewPage.visitBacklogQuarter(); - cy.contains('This goes now to backlog'); + cy.contains("This goes now to backlog"); }); - it(`Edit ongoing Objective can not choose backlog in quarter select`, () => { + it("Edit ongoing Objective can not choose backlog in quarter select", () => { overviewPage.addObjective() - .fillObjectiveTitle('We can not move this to backlog') + .fillObjectiveTitle("We can not move this to backlog") .submit(); overviewPage - .getObjectiveByNameAndState('We can not move this to backlog', 'ongoing') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("We can not move this to backlog", "ongoing") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective bearbeiten'); + overviewPage.selectFromThreeDotMenu("Objective bearbeiten"); - cy.get('select#quarter') - .should('contain', 'GJ ForTests'); - cy.get('select#quarter') - .should('not.contain', 'Backlog'); + cy.get("select#quarter") + .should("contain", "GJ ForTests"); + cy.get("select#quarter") + .should("not.contain", "Backlog"); }); - it(`Can release Objective to another quarter from backlog`, () => { + it("Can release Objective to another quarter from backlog", () => { overviewPage.visitBacklogQuarter(); overviewPage.addObjective() - .fillObjectiveTitle('We can not release this') + .fillObjectiveTitle("We can not release this") .submitDraftObjective(); - overviewPage.getObjectiveByNameAndState('We can not release this', 'draft') - .findByTestId('three-dot-menu') + overviewPage.getObjectiveByNameAndState("We can not release this", "draft") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective veröffentlichen'); + overviewPage.selectFromThreeDotMenu("Objective veröffentlichen"); - cy.contains('Objective veröffentlichen'); - cy.getByTestId('title') + cy.contains("Objective veröffentlichen"); + cy.getByTestId("title") .first() - .as('title'); - cy.get('@title') + .as("title"); + cy.get("@title") .clear(); - cy.get('@title') - .type('This is our first released objective'); - - cy.get('select#quarter') - .should('not.contain', 'Backlog'); - cy.get('select#quarter') - .select('GJ ForTests'); - - cy.contains('Als Draft speichern') - .should('not.exist'); - cy.contains('Speichern'); - cy.getByTestId('save') + cy.get("@title") + .type("This is our first released objective"); + + cy.get("select#quarter") + .should("not.contain", "Backlog"); + cy.get("select#quarter") + .select("GJ ForTests"); + + cy.contains("Als Draft speichern") + .should("not.exist"); + cy.contains("Speichern"); + cy.getByTestId("save") .click(); - cy.contains('This is our first released objective') - .should('not.exist'); + cy.contains("This is our first released objective") + .should("not.exist"); overviewPage.visitGJForTests(); - cy.contains('This is our first released objective'); + cy.contains("This is our first released objective"); }); - it(`Can edit Objective title in backlog`, () => { + it("Can edit Objective title in backlog", () => { overviewPage.visitBacklogQuarter(); overviewPage.addObjective() - .fillObjectiveTitle('This is possible for edit') + .fillObjectiveTitle("This is possible for edit") .submitDraftObjective(); overviewPage - .getObjectiveByNameAndState('This is possible for edit', 'draft') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("This is possible for edit", "draft") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective bearbeiten'); + overviewPage.selectFromThreeDotMenu("Objective bearbeiten"); ObjectiveDialog.do() - .fillObjectiveTitle('My new title') + .fillObjectiveTitle("My new title") .submit(); - overviewPage.getObjectiveByNameAndState('My new title', 'draft'); + overviewPage.getObjectiveByNameAndState("My new title", "draft"); }); - it(`Can edit Objective in backlog and change quarter`, () => { + it("Can edit Objective in backlog and change quarter", () => { overviewPage.visitBacklogQuarter(); overviewPage.addObjective() - .fillObjectiveTitle('This goes to other quarter later') + .fillObjectiveTitle("This goes to other quarter later") .submitDraftObjective(); overviewPage - .getObjectiveByNameAndState('This goes to other quarter later', 'draft') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("This goes to other quarter later", "draft") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective bearbeiten'); + overviewPage.selectFromThreeDotMenu("Objective bearbeiten"); ObjectiveDialog.do() - .selectQuarter('GJ ForTests') + .selectQuarter("GJ ForTests") .submit(); overviewPage.visitGJForTests(); - overviewPage.getObjectiveByNameAndState('This goes to other quarter later', 'draft'); + overviewPage.getObjectiveByNameAndState("This goes to other quarter later", "draft"); }); - it(`Can duplicate in backlog`, () => { + it("Can duplicate in backlog", () => { overviewPage.visitBacklogQuarter(); overviewPage.addObjective() - .fillObjectiveTitle('Ready for duplicate in backlog') + .fillObjectiveTitle("Ready for duplicate in backlog") .submitDraftObjective(); overviewPage - .getObjectiveByNameAndState('Ready for duplicate in backlog', 'draft') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("Ready for duplicate in backlog", "draft") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective duplizieren'); + overviewPage.selectFromThreeDotMenu("Objective duplizieren"); ObjectiveDialog.do() - .fillObjectiveTitle('This is a new duplication in backlog') + .fillObjectiveTitle("This is a new duplication in backlog") .submit(); - overviewPage.getObjectiveByNameAndState('Ready for duplicate in backlog', 'draft'); - overviewPage.getObjectiveByNameAndState('This is a new duplication in backlog', 'draft'); + overviewPage.getObjectiveByNameAndState("Ready for duplicate in backlog", "draft"); + overviewPage.getObjectiveByNameAndState("This is a new duplication in backlog", "draft"); }); - it('should duplicate from backlog', () => { + it("should duplicate from backlog", () => { overviewPage.visitBacklogQuarter(); overviewPage.addObjective() - .fillObjectiveTitle('Ready for duplicate to another quarter') + .fillObjectiveTitle("Ready for duplicate to another quarter") .submitDraftObjective(); overviewPage - .getObjectiveByNameAndState('Ready for duplicate to another quarter', 'draft') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("Ready for duplicate to another quarter", "draft") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective duplizieren'); + overviewPage.selectFromThreeDotMenu("Objective duplizieren"); ObjectiveDialog.do() - .fillObjectiveTitle('New duplication from backlog') - .selectQuarter('GJ ForTests') + .fillObjectiveTitle("New duplication from backlog") + .selectQuarter("GJ ForTests") .submit(); - overviewPage.getObjectiveByNameAndState('Ready for duplicate to another quarter', 'draft') - .should('exist'); - cy.contains('New duplication from backlog') - .should('not.exist'); + overviewPage.getObjectiveByNameAndState("Ready for duplicate to another quarter", "draft") + .should("exist"); + cy.contains("New duplication from backlog") + .should("not.exist"); overviewPage.visitGJForTests(); - overviewPage.getObjectiveByNameAndState('New duplication from backlog', 'draft') - .should('exist'); + overviewPage.getObjectiveByNameAndState("New duplication from backlog", "draft") + .should("exist"); }); - it(`Can duplicate ongoing Objective to backlog`, () => { + it("Can duplicate ongoing Objective to backlog", () => { overviewPage.addObjective() - .fillObjectiveTitle('Possible to duplicate into backlog') + .fillObjectiveTitle("Possible to duplicate into backlog") .submit(); overviewPage - .getObjectiveByNameAndState('Possible to duplicate into backlog', 'ongoing') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("Possible to duplicate into backlog", "ongoing") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective duplizieren'); + overviewPage.selectFromThreeDotMenu("Objective duplizieren"); ObjectiveDialog.do() - .selectQuarter('Backlog') + .selectQuarter("Backlog") .submit(); overviewPage.visitBacklogQuarter(); - cy.contains('Possible to duplicate into backlog'); + cy.contains("Possible to duplicate into backlog"); }); }); diff --git a/frontend/cypress/e2e/objective-crud.cy.ts b/frontend/cypress/e2e/objective-crud.cy.ts index c2af9c5754..4e367e1b44 100644 --- a/frontend/cypress/e2e/objective-crud.cy.ts +++ b/frontend/cypress/e2e/objective-crud.cy.ts @@ -1,8 +1,8 @@ -import * as users from '../fixtures/users.json'; -import CyOverviewPage from '../support/helper/dom-helper/pages/overviewPage'; -import ObjectiveDialog from '../support/helper/dom-helper/dialogs/objectiveDialog'; +import * as users from "../fixtures/users.json"; +import CyOverviewPage from "../support/helper/dom-helper/pages/overviewPage"; +import ObjectiveDialog from "../support/helper/dom-helper/dialogs/objectiveDialog"; -describe('CRUD operations', () => { +describe("CRUD operations", () => { let overviewPage = new CyOverviewPage(); beforeEach(() => { @@ -10,96 +10,104 @@ describe('CRUD operations', () => { cy.loginAsUser(users.gl); }); - [['ongoing objective title', - 'save', - 'ongoing-icon.svg'], - ['draft objective title', - 'save-draft', - 'draft-icon.svg']].forEach(([objectiveTitle, + [ + [ + "ongoing objective title", + "save", + "ongoing-icon.svg" + ], + [ + "draft objective title", + "save-draft", + "draft-icon.svg" + ] + ].forEach(([ + objectiveTitle, buttonTestId, - icon]) => { - it(`Create objective, no keyresults`, () => { + icon + ]) => { + it("Create objective, no keyresults", () => { overviewPage.addObjective() .fillObjectiveTitle(objectiveTitle) - .selectQuarter('3'); + .selectQuarter("3"); cy.getByTestId(buttonTestId) .click(); overviewPage.visitNextQuarter(); overviewPage .getObjectiveByName(objectiveTitle) - .findByTestId('objective-state') - .should('have.attr', 'src', `assets/icons/${icon}`); + .findByTestId("objective-state") + .should("have.attr", "src", `assets/icons/${icon}`); }); }); - it(`Create objective, should display error message`, () => { + it("Create objective, should display error message", () => { overviewPage.addObjective(); - cy.getByTestId('title') + cy.getByTestId("title") .first() - .type('title') + .type("title") .clear(); - cy.contains('Titel muss folgende Länge haben: 2-250 Zeichen'); - cy.getByTestId('save') - .should('be.disabled'); - cy.getByTestId('save-draft') - .should('be.disabled'); - cy.getByTestId('cancel') - .should('not.be.disabled'); + cy.contains("Titel muss folgende Länge haben: 2-250 Zeichen"); + cy.getByTestId("save") + .should("be.disabled"); + cy.getByTestId("save-draft") + .should("be.disabled"); + cy.getByTestId("cancel") + .should("not.be.disabled"); }); - it(`Create objective, cancel`, () => { - const objectiveTitle = 'this is a canceled objective'; + it("Create objective, cancel", () => { + const objectiveTitle = "this is a canceled objective"; overviewPage.addObjective() - .selectQuarter('3') + .selectQuarter("3") .cancel(); overviewPage.visitNextQuarter(); cy.contains(objectiveTitle) - .should('not.exist'); + .should("not.exist"); }); - it(`Delete existing objective`, () => { + it("Delete existing objective", () => { overviewPage.getFirstObjective() - .findByTestId('three-dot-menu') + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective bearbeiten'); + overviewPage.selectFromThreeDotMenu("Objective bearbeiten"); ObjectiveDialog.do() .deleteObjective() - .checkTitle('Objective löschen') - .checkDescription('Möchtest du dieses Objective wirklich löschen? Zugehörige Key Results werden dadurch ebenfalls gelöscht!') + .checkTitle("Objective löschen") + .checkDescription("Möchtest du dieses Objective wirklich löschen? Zugehörige Key Results werden dadurch ebenfalls gelöscht!") .submit(); }); - it(`Open objective aside via click`, () => { + it("Open objective aside via click", () => { overviewPage.getFirstObjective() - .find('.title') + .find(".title") .click(); cy.url() - .should('include', 'objective'); + .should("include", "objective"); }); - it(`update objective`, () => { - const updatedTitle = 'This is an updated title'; + it("update objective", () => { + const updatedTitle = "This is an updated title"; overviewPage.getFirstObjective() - .findByTestId('three-dot-menu') + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective bearbeiten'); + overviewPage.selectFromThreeDotMenu("Objective bearbeiten"); ObjectiveDialog.do() .fillObjectiveTitle(updatedTitle) .submit(); cy.contains(updatedTitle) - .should('exist'); + .should("exist"); }); - it(`Duplicate objective`, () => { - const duplicatedTitle = 'This is a duplicated objective'; + it("Duplicate objective", () => { + const duplicatedTitle = "This is a duplicated objective"; overviewPage.getFirstObjective() - .findByTestId('three-dot-menu') + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective duplizieren'); + overviewPage.selectFromThreeDotMenu("Objective duplizieren"); ObjectiveDialog.do() .fillObjectiveTitle(duplicatedTitle) .submit(); cy.contains(duplicatedTitle) - .should('exist'); + .should("exist"); }); }); diff --git a/frontend/cypress/e2e/objective.cy.ts b/frontend/cypress/e2e/objective.cy.ts index b7dec8295e..28da14fa94 100644 --- a/frontend/cypress/e2e/objective.cy.ts +++ b/frontend/cypress/e2e/objective.cy.ts @@ -1,310 +1,310 @@ -import * as users from '../fixtures/users.json'; -import CyOverviewPage from '../support/helper/dom-helper/pages/overviewPage'; -import ObjectiveDialog from '../support/helper/dom-helper/dialogs/objectiveDialog'; -import ConfirmDialog from '../support/helper/dom-helper/dialogs/confirmDialog'; +import * as users from "../fixtures/users.json"; +import CyOverviewPage from "../support/helper/dom-helper/pages/overviewPage"; +import ObjectiveDialog from "../support/helper/dom-helper/dialogs/objectiveDialog"; +import ConfirmDialog from "../support/helper/dom-helper/dialogs/confirmDialog"; -describe('OKR Objective e2e tests', () => { +describe("OKR Objective e2e tests", () => { let overviewPage = new CyOverviewPage(); beforeEach(() => { overviewPage = new CyOverviewPage(); cy.loginAsUser(users.gl); }); - describe('tests via click', () => { - it(`Release Objective from Draft to Ongoing`, () => { + describe("tests via click", () => { + it("Release Objective from Draft to Ongoing", () => { overviewPage.addObjective() - .fillObjectiveTitle('A objective in state draft') + .fillObjectiveTitle("A objective in state draft") .submitDraftObjective(); overviewPage - .getObjectiveByNameAndState('A objective in state draft', 'draft') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("A objective in state draft", "draft") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective veröffentlichen'); + overviewPage.selectFromThreeDotMenu("Objective veröffentlichen"); ConfirmDialog.do() - .checkTitle('Objective veröffentlichen') - .checkDescription('Soll dieses Objective veröffentlicht werden?') + .checkTitle("Objective veröffentlichen") + .checkDescription("Soll dieses Objective veröffentlicht werden?") .submit(); - overviewPage.getObjectiveByNameAndState('A objective in state draft', 'ongoing') - .should('exist'); + overviewPage.getObjectiveByNameAndState("A objective in state draft", "ongoing") + .should("exist"); }); - it(`Complete Objective with Successful`, () => { + it("Complete Objective with Successful", () => { overviewPage.addObjective() - .fillObjectiveTitle('We want to complete this successful') + .fillObjectiveTitle("We want to complete this successful") .submit(); overviewPage - .getObjectiveByNameAndState('We want to complete this successful', 'ongoing') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("We want to complete this successful", "ongoing") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective abschliessen'); + overviewPage.selectFromThreeDotMenu("Objective abschliessen"); - cy.contains('Bewertung'); - cy.contains('Objective erreicht'); - cy.contains('Objective nicht erreicht'); - cy.contains('Kommentar (optional)'); - cy.contains('Objective abschliessen'); - cy.contains('Abbrechen'); + cy.contains("Bewertung"); + cy.contains("Objective erreicht"); + cy.contains("Objective nicht erreicht"); + cy.contains("Kommentar (optional)"); + cy.contains("Objective abschliessen"); + cy.contains("Abbrechen"); - cy.getByTestId('successful') + cy.getByTestId("successful") .click(); - cy.getByTestId('submit') + cy.getByTestId("submit") .click(); - overviewPage.getObjectiveByNameAndState('We want to complete this successful', 'successful'); + overviewPage.getObjectiveByNameAndState("We want to complete this successful", "successful"); }); - it(`Complete Objective with Not-Successful`, () => { + it("Complete Objective with Not-Successful", () => { overviewPage.addObjective() - .fillObjectiveTitle('A not successful objective') + .fillObjectiveTitle("A not successful objective") .submit(); overviewPage - .getObjectiveByNameAndState('A not successful objective', 'ongoing') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("A not successful objective", "ongoing") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective abschliessen'); + overviewPage.selectFromThreeDotMenu("Objective abschliessen"); - cy.contains('Bewertung'); - cy.contains('Objective erreicht'); - cy.contains('Objective nicht erreicht'); - cy.contains('Kommentar (optional)'); - cy.contains('Objective abschliessen'); - cy.contains('Abbrechen'); + cy.contains("Bewertung"); + cy.contains("Objective erreicht"); + cy.contains("Objective nicht erreicht"); + cy.contains("Kommentar (optional)"); + cy.contains("Objective abschliessen"); + cy.contains("Abbrechen"); - cy.getByTestId('not-successful') + cy.getByTestId("not-successful") .click(); - cy.getByTestId('submit') + cy.getByTestId("submit") .click(); - overviewPage.getObjectiveByNameAndState('A not successful objective', 'not-successful'); + overviewPage.getObjectiveByNameAndState("A not successful objective", "not-successful"); }); - it(`Reopen Successful Objective`, () => { + it("Reopen Successful Objective", () => { overviewPage.addObjective() - .fillObjectiveTitle('This objective will be reopened after') + .fillObjectiveTitle("This objective will be reopened after") .submit(); overviewPage - .getObjectiveByNameAndState('This objective will be reopened after', 'ongoing') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("This objective will be reopened after", "ongoing") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective abschliessen'); + overviewPage.selectFromThreeDotMenu("Objective abschliessen"); - cy.getByTestId('successful') + cy.getByTestId("successful") .click(); - cy.getByTestId('submit') + cy.getByTestId("submit") .click(); cy.wait(500); overviewPage - .getObjectiveByNameAndState('This objective will be reopened after', 'successful') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("This objective will be reopened after", "successful") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective wiedereröffnen'); + overviewPage.selectFromThreeDotMenu("Objective wiedereröffnen"); ConfirmDialog.do() - .checkTitle('Objective wiedereröffnen') - .checkDescription('Soll dieses Objective wiedereröffnet werden?') + .checkTitle("Objective wiedereröffnen") + .checkDescription("Soll dieses Objective wiedereröffnet werden?") .submit(); - overviewPage.getObjectiveByNameAndState('This objective will be reopened after', 'ongoing') - .should('exist'); + overviewPage.getObjectiveByNameAndState("This objective will be reopened after", "ongoing") + .should("exist"); }); - it(`Cancel Reopen Successful Objective`, () => { + it("Cancel Reopen Successful Objective", () => { overviewPage.addObjective() - .fillObjectiveTitle('The reopening of this objective will be canceled') + .fillObjectiveTitle("The reopening of this objective will be canceled") .submit(); overviewPage - .getObjectiveByNameAndState('The reopening of this objective will be canceled', 'ongoing') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("The reopening of this objective will be canceled", "ongoing") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective abschliessen'); + overviewPage.selectFromThreeDotMenu("Objective abschliessen"); - cy.getByTestId('successful') + cy.getByTestId("successful") .click(); - cy.getByTestId('submit') + cy.getByTestId("submit") .click(); cy.wait(500); overviewPage - .getObjectiveByNameAndState('he reopening of this objective will be canceled', 'successful') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("he reopening of this objective will be canceled", "successful") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective wiedereröffnen'); + overviewPage.selectFromThreeDotMenu("Objective wiedereröffnen"); ConfirmDialog.do() - .checkTitle('Objective wiedereröffnen') - .checkDescription('Soll dieses Objective wiedereröffnet werden?') + .checkTitle("Objective wiedereröffnen") + .checkDescription("Soll dieses Objective wiedereröffnet werden?") .cancel(); overviewPage - .getObjectiveByNameAndState('The reopening of this objective will be canceled', 'successful') - .should('exist'); + .getObjectiveByNameAndState("The reopening of this objective will be canceled", "successful") + .should("exist"); }); - it('Cancel Ongoing objective back to draft state', () => { + it("Cancel Ongoing objective back to draft state", () => { overviewPage.addObjective() - .fillObjectiveTitle('This objective will be returned to draft state') + .fillObjectiveTitle("This objective will be returned to draft state") .submit(); overviewPage - .getObjectiveByNameAndState('This objective will be returned to draft state', 'ongoing') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("This objective will be returned to draft state", "ongoing") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective als Draft speichern'); + overviewPage.selectFromThreeDotMenu("Objective als Draft speichern"); ConfirmDialog.do() - .checkTitle('Objective als Draft speichern') - .checkDescription('Soll dieses Objective als Draft gespeichert werden?') + .checkTitle("Objective als Draft speichern") + .checkDescription("Soll dieses Objective als Draft gespeichert werden?") .submit(); overviewPage - .getObjectiveByNameAndState('This objective will be returned to draft state', 'draft') - .should('exist'); + .getObjectiveByNameAndState("This objective will be returned to draft state", "draft") + .should("exist"); }); - it('Ongoing objective back to draft state', () => { + it("Ongoing objective back to draft state", () => { overviewPage .addObjective() - .fillObjectiveTitle('Putting this objective back to draft state will be canceled') + .fillObjectiveTitle("Putting this objective back to draft state will be canceled") .submit(); overviewPage - .getObjectiveByNameAndState('Putting this objective back to draft state will be canceled', 'ongoing') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("Putting this objective back to draft state will be canceled", "ongoing") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective als Draft speichern'); + overviewPage.selectFromThreeDotMenu("Objective als Draft speichern"); ConfirmDialog.do() - .checkTitle('Objective als Draft speichern') - .checkDescription('Soll dieses Objective als Draft gespeichert werden?') + .checkTitle("Objective als Draft speichern") + .checkDescription("Soll dieses Objective als Draft gespeichert werden?") .cancel(); overviewPage - .getObjectiveByNameAndState('Putting this objective back to draft state will be canceled', 'ongoing') - .should('exist'); + .getObjectiveByNameAndState("Putting this objective back to draft state will be canceled", "ongoing") + .should("exist"); }); - it(`Search for Objective`, () => { + it("Search for Objective", () => { overviewPage.addObjective() - .fillObjectiveTitle('Search after this objective') + .fillObjectiveTitle("Search after this objective") .submit(); overviewPage.addObjective() - .fillObjectiveTitle('We dont want to search for this') + .fillObjectiveTitle("We dont want to search for this") .submit(); - cy.contains('Search after this objective'); - cy.contains('We dont want to search for this'); + cy.contains("Search after this objective"); + cy.contains("We dont want to search for this"); cy.scrollTo(0, 0); cy.wait(500); - cy.getByTestId('objectiveSearch') + cy.getByTestId("objectiveSearch") .first() .click(); - cy.getByTestId('objectiveSearch') + cy.getByTestId("objectiveSearch") .first() - .type('Search after') + .type("Search after") .wait(350); - cy.contains('Search after this objective'); - cy.contains('We dont want to search for this') - .should('not.exist'); + cy.contains("Search after this objective"); + cy.contains("We dont want to search for this") + .should("not.exist"); - cy.getByTestId('objectiveSearch') + cy.getByTestId("objectiveSearch") .first() - .as('objective-search') + .as("objective-search") .clear(); - cy.get('@objective-search') - .type('this') + cy.get("@objective-search") + .type("this") .wait(350); - cy.contains('Search after this objective'); - cy.contains('We dont want to search for this'); + cy.contains("Search after this objective"); + cy.contains("We dont want to search for this"); - cy.get('@objective-search') + cy.get("@objective-search") .clear(); - cy.get('@objective-search') - .type('dont want to') + cy.get("@objective-search") + .type("dont want to") .wait(350); - cy.contains('We dont want to search for this'); - cy.contains('Search after this objective') - .should('not.exist'); + cy.contains("We dont want to search for this"); + cy.contains("Search after this objective") + .should("not.exist"); - cy.get('@objective-search') + cy.get("@objective-search") .clear(); - cy.get('@objective-search') - .type('there is no objective') + cy.get("@objective-search") + .type("there is no objective") .wait(350); - cy.contains('We dont want to search for this') - .should('not.exist'); - cy.contains('Search after this objective') - .should('not.exist'); + cy.contains("We dont want to search for this") + .should("not.exist"); + cy.contains("Search after this objective") + .should("not.exist"); }); - it(`Create Objective in other quarter`, () => { + it("Create Objective in other quarter", () => { overviewPage.addObjective() - .fillObjectiveTitle('Objective in quarter 3') - .selectQuarter('3') + .fillObjectiveTitle("Objective in quarter 3") + .selectQuarter("3") .submit(); - cy.contains('Objective in quarter 3') - .should('not.exist'); + cy.contains("Objective in quarter 3") + .should("not.exist"); overviewPage.visitNextQuarter(); - cy.contains('Objective in quarter 3'); + cy.contains("Objective in quarter 3"); }); - it(`Edit Objective and move to other quarter`, () => { + it("Edit Objective and move to other quarter", () => { overviewPage.addObjective() - .fillObjectiveTitle('Move to another quarter on edit') + .fillObjectiveTitle("Move to another quarter on edit") .submit(); overviewPage - .getObjectiveByNameAndState('Move to another quarter on edit', 'ongoing') - .findByTestId('three-dot-menu') + .getObjectiveByNameAndState("Move to another quarter on edit", "ongoing") + .findByTestId("three-dot-menu") .click(); - overviewPage.selectFromThreeDotMenu('Objective bearbeiten'); + overviewPage.selectFromThreeDotMenu("Objective bearbeiten"); ObjectiveDialog.do() - .selectQuarter('3') + .selectQuarter("3") .submit(); - cy.contains('Move to another quarter on edit') - .should('not.exist'); + cy.contains("Move to another quarter on edit") + .should("not.exist"); overviewPage.visitNextQuarter(); - cy.contains('Move to another quarter on edit'); + cy.contains("Move to another quarter on edit"); }); }); - describe('tests via keyboard', () => { - it(`Open objective aside via enter`, () => { - cy.getByTestId('objective') + describe("tests via keyboard", () => { + it("Open objective aside via enter", () => { + cy.getByTestId("objective") .first() - .find('[tabindex]') + .find("[tabindex]") .first() .focus(); - cy.realPress('Enter'); + cy.realPress("Enter"); cy.url() - .should('include', 'objective'); + .should("include", "objective"); }); }); }); diff --git a/frontend/cypress/e2e/overview.cy.ts b/frontend/cypress/e2e/overview.cy.ts index 770428a26e..bd390d73cd 100644 --- a/frontend/cypress/e2e/overview.cy.ts +++ b/frontend/cypress/e2e/overview.cy.ts @@ -1,28 +1,28 @@ -import * as users from '../fixtures/users.json'; -import FilterHelper from '../support/helper/dom-helper/filterHelper'; +import * as users from "../fixtures/users.json"; +import FilterHelper from "../support/helper/dom-helper/filterHelper"; -describe('OKR Overview', () => { +describe("OKR Overview", () => { beforeEach(() => { cy.loginAsUser(users.gl); }); - it('should have the current quarter with label Aktuell', () => { - cy.getByTestId('quarterFilter') - .contains('Aktuell'); + it("should have the current quarter with label Aktuell", () => { + cy.getByTestId("quarterFilter") + .contains("Aktuell"); }); - it('Check order of teams', () => { + it("Check order of teams", () => { FilterHelper.do() - .optionShouldNotBeSelected('Alle') - .toggleOption('Alle'); + .optionShouldNotBeSelected("Alle") + .toggleOption("Alle"); const textsExpectedOrder = [ - 'LoremIpsum', - 'Puzzle ITC', - '/BBT', - 'we are cube.³' + "LoremIpsum", + "Puzzle ITC", + "/BBT", + "we are cube.³" ]; - cy.get('.team-title:contains("we are cube.³")'); - cy.get('.team-title') + cy.get(".team-title:contains(\"we are cube.³\")"); + cy.get(".team-title") .then((elements) => { const texts: string[] = elements.map((_, el) => Cypress.$(el) .text()) @@ -31,14 +31,14 @@ describe('OKR Overview', () => { }); }); - it('Check font ', () => { - cy.get('.team-title') + it("Check font ", () => { + cy.get(".team-title") .first() - .invoke('css', 'font-family') - .should('eq', 'Roboto, "sans-serif"'); - cy.get('.team-title') + .invoke("css", "font-family") + .should("eq", "Roboto, \"sans-serif\""); + cy.get(".team-title") .first() - .invoke('css', 'font-variation-settings') - .should('eq', '"wght" 600'); + .invoke("css", "font-variation-settings") + .should("eq", "\"wght\" 600"); }); }); diff --git a/frontend/cypress/e2e/routing.cy.ts b/frontend/cypress/e2e/routing.cy.ts index e08fb94367..41196d2372 100644 --- a/frontend/cypress/e2e/routing.cy.ts +++ b/frontend/cypress/e2e/routing.cy.ts @@ -1,38 +1,38 @@ -import * as users from '../fixtures/users.json'; -import CyOverviewPage from '../support/helper/dom-helper/pages/overviewPage'; -import TeammanagementPage from '../support/helper/dom-helper/pages/teammanagementPage'; +import * as users from "../fixtures/users.json"; +import CyOverviewPage from "../support/helper/dom-helper/pages/overviewPage"; +import TeammanagementPage from "../support/helper/dom-helper/pages/teammanagementPage"; -describe('Routing', () => { +describe("Routing", () => { beforeEach(() => { cy.loginAsUser(users.gl); }); - describe('Route via url', () => { - it('should route to overview', () => { + describe("Route via url", () => { + it("should route to overview", () => { // Visit autocalls the validatePage method CyOverviewPage.do() .visitViaURL(); }); - it('should route to teammanagement', () => { + it("should route to teammanagement", () => { // Visit autocalls the validatePage method TeammanagementPage.do() .visitViaURL(); }); - it('should route from overview to team management ', () => { + it("should route from overview to team management ", () => { CyOverviewPage.do() .visitViaURL() .visitTeammanagement(); }); - it('should route from team management to Overview via back button', () => { + it("should route from team management to Overview via back button", () => { TeammanagementPage.do() .visitViaURL() .backToOverview(); }); - it('should route from team management to Overview via logo', () => { + it("should route from team management to Overview via logo", () => { TeammanagementPage.do() .visitViaURL() .visitOverview(); diff --git a/frontend/cypress/e2e/scoring.cy.ts b/frontend/cypress/e2e/scoring.cy.ts index 0501c3e60c..c71eb57e99 100644 --- a/frontend/cypress/e2e/scoring.cy.ts +++ b/frontend/cypress/e2e/scoring.cy.ts @@ -1,10 +1,10 @@ -import * as users from '../fixtures/users.json'; -import { getPercentageMetric, getPercentageOrdinal } from 'cypress/support/helper/scoringSupport'; -import CyOverviewPage from '../support/helper/dom-helper/pages/overviewPage'; -import { Unit } from '../../src/app/shared/types/enums/Unit'; -import KeyResultDetailPage from '../support/helper/dom-helper/pages/keyResultDetailPage'; +import * as users from "../fixtures/users.json"; +import { getPercentageMetric, getPercentageOrdinal } from "cypress/support/helper/scoringSupport"; +import CyOverviewPage from "../support/helper/dom-helper/pages/overviewPage"; +import { Unit } from "../../src/app/shared/types/enums/Unit"; +import KeyResultDetailPage from "../support/helper/dom-helper/pages/keyResultDetailPage"; -describe('Scoring component e2e tests', () => { +describe("Scoring component e2e tests", () => { let overviewPage = new CyOverviewPage(); let keyresultDetailPage = new KeyResultDetailPage(); @@ -15,93 +15,107 @@ describe('Scoring component e2e tests', () => { }); [ - [0, + [ + 0, 100, - 10], - [0, + 10 + ], + [ + 0, 100, - 31], - [0, + 31 + ], + [ + 0, 100, - 71], - [0, + 71 + ], + [ + 0, 100, - 100] - ].forEach(([baseline, + 100 + ] + ].forEach(([ + baseline, stretchgoal, - value]) => { - it('Create metric checkin and validate value of scoring component', () => { - setupMetricKR( - `Metric kr with check-in value ${value}`, baseline, stretchgoal, value - ); + value + ]) => { + it("Create metric checkin and validate value of scoring component", () => { + setupMetricKR(`Metric kr with check-in value ${value}`, baseline, stretchgoal, value); const percentage = getPercentageMetric(baseline, stretchgoal, value); cy.validateScoring(false, percentage); - cy.get('.keyResult-detail-attribute-show') - .contains('Aktuell') + cy.get(".keyResult-detail-attribute-show") + .contains("Aktuell") .parent() - .not(':contains(!)') - .should('have.css', 'border-color') - .and('not.equal', 'rgb(186, 56, 56)'); + .not(":contains(!)") + .should("have.css", "border-color") + .and("not.equal", "rgb(186, 56, 56)"); keyresultDetailPage.close(); cy.validateScoring(true, percentage); overviewPage .getKeyResultByName(`Metric kr with check-in value ${value}`) - .not(':contains(*[class="scoring-error-badge"])'); + .not(":contains(*[class=\"scoring-error-badge\"])"); }); }); - [[0, - 100, - -1], - [200, - 100, - 250]].forEach(([baseline, + [ + [ + 0, + 100, + -1 + ], + [ + 200, + 100, + 250 + ] + ].forEach(([ + baseline, stretchgoal, - value]) => { - it('show indicator that value is negative', () => { - setupMetricKR( - `Check indicator with value ${value}`, baseline, stretchgoal, value - ); + value + ]) => { + it("show indicator that value is negative", () => { + setupMetricKR(`Check indicator with value ${value}`, baseline, stretchgoal, value); cy.validateScoring(false, 0); - cy.get('.keyResult-detail-attribute-show') - .contains('Aktuell') + cy.get(".keyResult-detail-attribute-show") + .contains("Aktuell") .parent() - .contains('!') - .should('have.css', 'border-color') - .and('equal', 'rgb(186, 56, 56)'); + .contains("!") + .should("have.css", "border-color") + .and("equal", "rgb(186, 56, 56)"); keyresultDetailPage.close(); cy.validateScoring(true, 0); overviewPage.getKeyResultByName(`Check indicator with value ${value}`) - .get('.scoring-error-badge'); + .get(".scoring-error-badge"); }); }); [ - ['fail'], - ['commit'], - ['target'], - ['stretch'] + ["fail"], + ["commit"], + ["target"], + ["stretch"] ].forEach(([zoneName]) => { - it('Create ordinal checkin and validate value of scoring component', () => { + it("Create ordinal checkin and validate value of scoring component", () => { overviewPage .addKeyResult() - .fillKeyResultTitle('Ordinal scoring keyresult') - .withOrdinalValues('My commit zone', 'My target zone', 'My stretch goal') + .fillKeyResultTitle("Ordinal scoring keyresult") + .withOrdinalValues("My commit zone", "My target zone", "My stretch goal") .checkForDialogTextOrdinal() - .fillKeyResultDescription('This is my description') + .fillKeyResultDescription("This is my description") .submit(); keyresultDetailPage - .visit('Ordinal scoring keyresult') + .visit("Ordinal scoring keyresult") .createCheckIn() - .selectOrdinalCheckInZone(zoneName as 'fail' | 'commit' | 'target' | 'stretch') + .selectOrdinalCheckInZone(zoneName as "fail" | "commit" | "target" | "stretch") .setCheckInConfidence(8) - .fillCheckInCommentary('Testveränderungen') - .fillCheckInInitiatives('Testmassnahmen') + .fillCheckInCommentary("Testveränderungen") + .fillCheckInInitiatives("Testmassnahmen") .submit(); const percentage = getPercentageOrdinal(zoneName); cy.validateScoring(false, percentage); @@ -111,9 +125,7 @@ describe('Scoring component e2e tests', () => { }); }); -function setupMetricKR ( - name: string, baseline: number, stretchgoal: number, value: number -) { +function setupMetricKR (name: string, baseline: number, stretchgoal: number, value: number) { CyOverviewPage.do() .addKeyResult() .fillKeyResultTitle(name) @@ -123,8 +135,8 @@ function setupMetricKR ( .visit(name) .createCheckIn() .fillMetricCheckInValue(value.toString()) - .fillCheckInCommentary('Testveränderungen') - .fillCheckInInitiatives('Testmassnahmen') + .fillCheckInCommentary("Testveränderungen") + .fillCheckInInitiatives("Testmassnahmen") .setCheckInConfidence(8) .submit(); } diff --git a/frontend/cypress/e2e/tab.cy.ts b/frontend/cypress/e2e/tab.cy.ts index 01a6485273..e203824061 100644 --- a/frontend/cypress/e2e/tab.cy.ts +++ b/frontend/cypress/e2e/tab.cy.ts @@ -1,9 +1,9 @@ -import * as users from '../fixtures/users.json'; -import CyOverviewPage from '../support/helper/dom-helper/pages/overviewPage'; -import { Unit } from '../../src/app/shared/types/enums/Unit'; -import KeyResultDetailPage from '../support/helper/dom-helper/pages/keyResultDetailPage'; +import * as users from "../fixtures/users.json"; +import CyOverviewPage from "../support/helper/dom-helper/pages/overviewPage"; +import { Unit } from "../../src/app/shared/types/enums/Unit"; +import KeyResultDetailPage from "../support/helper/dom-helper/pages/keyResultDetailPage"; -describe('Tab workflow tests', () => { +describe("Tab workflow tests", () => { let overviewPage = new CyOverviewPage(); beforeEach(() => { cy.loginAsUser(users.gl); @@ -15,7 +15,7 @@ describe('Tab workflow tests', () => { function focusedShouldHaveTestId (testId: string) { cy.focused() - .should('have.attr', 'data-testId', testId); + .should("have.attr", "data-testId", testId); } function tabAndCheck (testId: string, text?: string) { @@ -27,344 +27,344 @@ describe('Tab workflow tests', () => { } } - it('should be able to tab to header items', () => { - tabAndCheck('team-management', 'Teamverwaltung'); - tabAndCheck('help-button', 'Hilfe'); - tabAndCheck('user-options', 'Jaya Norris'); - cy.realPress('Enter'); - cy.pressUntilContains('Logout', 'ArrowDown'); - focusedShouldHaveTestId('logout'); - cy.realPress('Escape'); - tabAndCheck('quarterFilter', 'GJ'); - tabAndCheck('objectiveSearch'); + it("should be able to tab to header items", () => { + tabAndCheck("team-management", "Teamverwaltung"); + tabAndCheck("help-button", "Hilfe"); + tabAndCheck("user-options", "Jaya Norris"); + cy.realPress("Enter"); + cy.pressUntilContains("Logout", "ArrowDown"); + focusedShouldHaveTestId("logout"); + cy.realPress("Escape"); + tabAndCheck("quarterFilter", "GJ"); + tabAndCheck("objectiveSearch"); cy.tabForward(); cy.focused() - .children('img') + .children("img") .first() - .should('have.attr', 'src') - .and('match', /search-icon.svg/); + .should("have.attr", "src") + .and("match", /search-icon.svg/); cy.tabForward(); cy.focused() - .contains('Alle'); + .contains("Alle"); }); - it('should be able to tab to overview items', () => { - tabAndCheck('team-management', 'Teamverwaltung'); - tabAndCheck('add-objective', 'Objective hinzufügen'); - tabAndCheck('objective'); - tabAndCheck('three-dot-menu'); - tabAndCheck('key-result'); - tabAndCheck('add-keyResult', 'Key Result hinzufügen'); + it("should be able to tab to overview items", () => { + tabAndCheck("team-management", "Teamverwaltung"); + tabAndCheck("add-objective", "Objective hinzufügen"); + tabAndCheck("objective"); + tabAndCheck("three-dot-menu"); + tabAndCheck("key-result"); + tabAndCheck("add-keyResult", "Key Result hinzufügen"); }); - describe('Objective', () => { - it('should be able to tab objective dialog', () => { - 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('save-draft'); - tabAndCheck('save'); - tabAndCheck('cancel'); + describe("Objective", () => { + it("should be able to tab objective dialog", () => { + 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("save-draft"); + tabAndCheck("save"); + tabAndCheck("cancel"); }); - it('should focus three dot menu after edit objective', () => { - overviewPage.getObjectiveByState('ongoing') + it("should focus three dot menu 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('save', 'Speichern'); - cy.realPress('Enter'); - focusedShouldHaveTestId('three-dot-menu'); + 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("save", "Speichern"); + cy.realPress("Enter"); + focusedShouldHaveTestId("three-dot-menu"); }); - it('should be able to complete and reopen objective', () => { - overviewPage.getObjectiveByState('ongoing') + it("should be able to complete and reopen objective", () => { + overviewPage.getObjectiveByState("ongoing") .focus(); - tabAndCheck('three-dot-menu'); - cy.realPress('Enter'); - tabToThreeDotMenuOption('Objective abschliessen'); - cy.contains('h2', 'Objective abschliessen '); - focusedShouldHaveTestId('close-dialog'); + tabAndCheck("three-dot-menu"); + cy.realPress("Enter"); + tabToThreeDotMenuOption("Objective abschliessen"); + cy.contains("h2", "Objective abschliessen "); + focusedShouldHaveTestId("close-dialog"); cy.tabForward(); cy.focused() - .contains('Objective erreicht'); - cy.realPress('Enter'); + .contains("Objective erreicht"); + cy.realPress("Enter"); cy.tabForward(); cy.focused() - .contains('Objective nicht erreicht'); - tabAndCheck('completeComment'); - tabAndCheck('cancel', 'Abbrechen'); - tabAndCheck('submit', 'Objective abschliessen'); - cy.realPress('Enter'); + .contains("Objective nicht erreicht"); + tabAndCheck("completeComment"); + tabAndCheck("cancel", "Abbrechen"); + tabAndCheck("submit", "Objective abschliessen"); + cy.realPress("Enter"); - focusedShouldHaveTestId('three-dot-menu'); - cy.realPress('Enter'); + focusedShouldHaveTestId("three-dot-menu"); + cy.realPress("Enter"); - tabToThreeDotMenuOption('Objective wiedereröffnen'); - cy.contains('h2', 'Objective wiedereröffnen'); - focusedShouldHaveTestId('close-dialog'); - cy.contains('Soll dieses Objective wiedereröffnet werden?'); - tabAndCheck('confirm-no', 'Nein'); - tabAndCheck('confirm-yes', 'Ja'); - cy.realPress('Enter'); - focusedShouldHaveTestId('three-dot-menu'); + tabToThreeDotMenuOption("Objective wiedereröffnen"); + cy.contains("h2", "Objective wiedereröffnen"); + focusedShouldHaveTestId("close-dialog"); + cy.contains("Soll dieses Objective wiedereröffnet werden?"); + tabAndCheck("confirm-no", "Nein"); + tabAndCheck("confirm-yes", "Ja"); + cy.realPress("Enter"); + focusedShouldHaveTestId("three-dot-menu"); }); - it('should be able to set objective to draft and publish it', () => { - overviewPage.getObjectiveByState('ongoing') + it("should be able to set objective to draft and publish it", () => { + overviewPage.getObjectiveByState("ongoing") .focus(); - tabAndCheck('three-dot-menu'); - cy.realPress('Enter'); - tabToThreeDotMenuOption('Objective als Draft speichern'); - cy.contains('h2', 'Objective als Draft speichern'); - focusedShouldHaveTestId('close-dialog'); - cy.contains('Soll dieses Objective als Draft gespeichert werden?'); - tabAndCheck('confirm-no', 'Nein'); - tabAndCheck('confirm-yes', 'Ja'); - cy.realPress('Enter'); + tabAndCheck("three-dot-menu"); + cy.realPress("Enter"); + tabToThreeDotMenuOption("Objective als Draft speichern"); + cy.contains("h2", "Objective als Draft speichern"); + focusedShouldHaveTestId("close-dialog"); + cy.contains("Soll dieses Objective als Draft gespeichert werden?"); + tabAndCheck("confirm-no", "Nein"); + tabAndCheck("confirm-yes", "Ja"); + cy.realPress("Enter"); - focusedShouldHaveTestId('three-dot-menu'); - cy.realPress('Enter'); + focusedShouldHaveTestId("three-dot-menu"); + cy.realPress("Enter"); - tabToThreeDotMenuOption('Objective veröffentlichen'); - cy.contains('h2', 'Objective veröffentlichen'); - focusedShouldHaveTestId('close-dialog'); - cy.contains('Soll dieses Objective veröffentlicht werden?'); - tabAndCheck('confirm-no', 'Nein'); - tabAndCheck('confirm-yes', 'Ja'); - cy.realPress('Enter'); - focusedShouldHaveTestId('three-dot-menu'); + tabToThreeDotMenuOption("Objective veröffentlichen"); + cy.contains("h2", "Objective veröffentlichen"); + focusedShouldHaveTestId("close-dialog"); + cy.contains("Soll dieses Objective veröffentlicht werden?"); + tabAndCheck("confirm-no", "Nein"); + tabAndCheck("confirm-yes", "Ja"); + cy.realPress("Enter"); + focusedShouldHaveTestId("three-dot-menu"); }); - it('should be able to open objective detail view', () => { - overviewPage.getObjectiveByState('ongoing') + it("should be able to open objective detail view", () => { + overviewPage.getObjectiveByState("ongoing") .focus(); - cy.realPress('Enter') + cy.realPress("Enter") .tabForward(); - focusedShouldHaveTestId('closeDrawer'); - tabAndCheck('add-keyResult-objective-detail', 'Key Result hinzufügen'); - tabAndCheck('edit-objective', 'Objective bearbeiten'); + focusedShouldHaveTestId("closeDrawer"); + tabAndCheck("add-keyResult-objective-detail", "Key Result hinzufügen"); + tabAndCheck("edit-objective", "Objective bearbeiten"); }); }); - describe('Keyresult & Check-In', () => { - it('Should be able to tab Keyresult dialog', () => { - tabAndCheck('add-keyResult', 'Key Result hinzufügen'); - cy.realPress('Enter'); - focusedShouldHaveTestId('close-dialog'); - tabAndCheck('titleInput'); + describe("Keyresult & Check-In", () => { + it("Should be able to tab Keyresult dialog", () => { + tabAndCheck("add-keyResult", "Key Result hinzufügen"); + cy.realPress("Enter"); + focusedShouldHaveTestId("close-dialog"); + tabAndCheck("titleInput"); cy.focused() - .type('Title'); - tabAndCheck('unit'); - tabAndCheck('baseline'); - tabAndCheck('stretchGoal'); - tabAndCheck('ownerInput'); - tabAndCheck('descriptionInput'); - tabAndCheck('actionInput'); - tabAndCheck('add-action-plan-line', 'Weitere Action hinzufügen'); - tabAndCheck('ordinalTab', 'Ordinal'); - cy.realPress('Enter'); - tabAndCheck('commitZone'); + .type("Title"); + tabAndCheck("unit"); + tabAndCheck("baseline"); + tabAndCheck("stretchGoal"); + tabAndCheck("ownerInput"); + tabAndCheck("descriptionInput"); + tabAndCheck("actionInput"); + tabAndCheck("add-action-plan-line", "Weitere Action hinzufügen"); + tabAndCheck("ordinalTab", "Ordinal"); + cy.realPress("Enter"); + tabAndCheck("commitZone"); cy.focused() - .type('Commit'); - tabAndCheck('targetZone'); + .type("Commit"); + tabAndCheck("targetZone"); cy.focused() - .type('Target'); - tabAndCheck('stretchZone'); + .type("Target"); + tabAndCheck("stretchZone"); cy.focused() - .type('Stretch'); - tabAndCheck('submit', 'Speichern'); - tabAndCheck('saveAndNew', 'Speichern & Neu'); - tabAndCheck('cancel', 'Abbrechen'); + .type("Stretch"); + tabAndCheck("submit", "Speichern"); + tabAndCheck("saveAndNew", "Speichern & Neu"); + tabAndCheck("cancel", "Abbrechen"); }); - it('Should tab keyresult detail view', () => { - overviewPage.getObjectiveByState('ongoing') - .findByTestId('key-result') + it("Should tab keyresult detail view", () => { + overviewPage.getObjectiveByState("ongoing") + .findByTestId("key-result") .first() .focus(); - cy.realPress('Enter') + cy.realPress("Enter") .tabForward(); - focusedShouldHaveTestId('close-drawer'); - tabAndCheck('show-all-checkins', 'Alle Check-ins anzeigen'); - cy.realPress('Enter'); - cy.contains('Check-in History'); - focusedShouldHaveTestId('close-dialog'); - tabAndCheck('edit-check-in'); - tabAndCheck('closeButton', 'Schliessen'); - cy.realPress('Enter'); - tabAndCheck('add-check-in', 'Check-in erfassen'); - tabAndCheck('edit-keyResult', 'Key Result bearbeiten'); + focusedShouldHaveTestId("close-drawer"); + tabAndCheck("show-all-checkins", "Alle Check-ins anzeigen"); + cy.realPress("Enter"); + cy.contains("Check-in History"); + focusedShouldHaveTestId("close-dialog"); + tabAndCheck("edit-check-in"); + tabAndCheck("closeButton", "Schliessen"); + cy.realPress("Enter"); + tabAndCheck("add-check-in", "Check-in erfassen"); + tabAndCheck("edit-keyResult", "Key Result bearbeiten"); }); - it('Should tab create-check-in metric', () => { + it("Should tab create-check-in metric", () => { overviewPage .addOngoingKeyResult() - .fillKeyResultTitle('A metric Keyresult for tabbing tests') - .withMetricValues(Unit.CHF, '10', '100') + .fillKeyResultTitle("A metric Keyresult for tabbing tests") + .withMetricValues(Unit.CHF, "10", "100") .submit(); KeyResultDetailPage.do() - .visit('A metric Keyresult for tabbing tests'); - tabAndCheck('add-check-in', 'Check-in erfassen'); - cy.realPress('Enter'); - cy.contains('Check-in erfassen'); - focusedShouldHaveTestId('close-dialog'); - tabAndCheck('changeInfo'); - tabAndCheck('check-in-metric-value'); + .visit("A metric Keyresult for tabbing tests"); + tabAndCheck("add-check-in", "Check-in erfassen"); + cy.realPress("Enter"); + cy.contains("Check-in erfassen"); + focusedShouldHaveTestId("close-dialog"); + tabAndCheck("changeInfo"); + tabAndCheck("check-in-metric-value"); cy.focused() - .type('20'); - tabAndCheck('initiatives'); - cy.contains('5/10'); + .type("20"); + tabAndCheck("initiatives"); + cy.contains("5/10"); cy.tabForward(); - cy.realPress('ArrowLeft'); - cy.contains('4/10'); - tabAndCheck('submit-check-in', 'Check-in speichern'); - tabAndCheck('cancel', 'Abbrechen'); + cy.realPress("ArrowLeft"); + cy.contains("4/10"); + tabAndCheck("submit-check-in", "Check-in speichern"); + tabAndCheck("cancel", "Abbrechen"); }); - it('Should tab create-check-in ordinal', () => { + it("Should tab create-check-in ordinal", () => { overviewPage .addOngoingKeyResult() - .fillKeyResultTitle('A ordinal Keyresult for tabbing tests') - .withOrdinalValues('Commit', 'Target', 'Stretch') + .fillKeyResultTitle("A ordinal Keyresult for tabbing tests") + .withOrdinalValues("Commit", "Target", "Stretch") .submit(); KeyResultDetailPage.do() - .visit('A ordinal Keyresult for tabbing tests'); - tabAndCheck('add-check-in', 'Check-in erfassen'); - cy.realPress('Enter'); - cy.contains('Check-in erfassen'); - focusedShouldHaveTestId('close-dialog'); - tabAndCheck('changeInfo'); + .visit("A ordinal Keyresult for tabbing tests"); + tabAndCheck("add-check-in", "Check-in erfassen"); + cy.realPress("Enter"); + cy.contains("Check-in erfassen"); + focusedShouldHaveTestId("close-dialog"); + tabAndCheck("changeInfo"); cy.tabForward(); cy.focused() - .closest('mat-radio-button') - .should('have.attr', 'data-testId', 'fail-radio'); - cy.realPress('ArrowDown'); + .closest("mat-radio-button") + .should("have.attr", "data-testId", "fail-radio"); + cy.realPress("ArrowDown"); cy.focused() - .closest('mat-radio-button') - .should('have.attr', 'data-testId', 'commit-radio'); - cy.realPress('ArrowDown'); + .closest("mat-radio-button") + .should("have.attr", "data-testId", "commit-radio"); + cy.realPress("ArrowDown"); cy.focused() - .closest('mat-radio-button') - .should('have.attr', 'data-testId', 'target-radio'); - cy.realPress('ArrowDown'); + .closest("mat-radio-button") + .should("have.attr", "data-testId", "target-radio"); + cy.realPress("ArrowDown"); cy.focused() - .closest('mat-radio-button') - .should('have.attr', 'data-testId', 'stretch-radio'); - tabAndCheck('initiatives'); - cy.contains('5/10'); + .closest("mat-radio-button") + .should("have.attr", "data-testId", "stretch-radio"); + tabAndCheck("initiatives"); + cy.contains("5/10"); cy.tabForward(); - cy.realPress('ArrowLeft'); - cy.contains('4/10'); - tabAndCheck('submit-check-in', 'Check-in speichern'); - tabAndCheck('cancel', 'Abbrechen'); + cy.realPress("ArrowLeft"); + cy.contains("4/10"); + tabAndCheck("submit-check-in", "Check-in speichern"); + tabAndCheck("cancel", "Abbrechen"); }); }); - describe('Team management', () => { - it('Should tab team management', () => { - tabAndCheck('team-management', 'Teamverwaltung'); - cy.realPress('Enter'); - tabAndCheck('routerLink-to-overview', 'Zurück zur OKR Übersicht'); - tabAndCheck('teamManagementSearch'); - tabAndCheck('add-team', 'Team erfassen'); - tabAndCheck('all-teams-selector', 'Alle Teams (4)'); - tabAndCheck('invite-member', 'Member registrieren'); + describe("Team management", () => { + it("Should tab team management", () => { + tabAndCheck("team-management", "Teamverwaltung"); + cy.realPress("Enter"); + tabAndCheck("routerLink-to-overview", "Zurück zur OKR Übersicht"); + tabAndCheck("teamManagementSearch"); + tabAndCheck("add-team", "Team erfassen"); + tabAndCheck("all-teams-selector", "Alle Teams (4)"); + tabAndCheck("invite-member", "Member registrieren"); }); - it('Should tab create team', () => { - cy.getByTestId('team-management') + it("Should tab create team", () => { + cy.getByTestId("team-management") .click(); - tabAndCheck('add-team'); - cy.realPress('Enter'); - cy.contains('Team erfassen'); - focusedShouldHaveTestId('close-dialog'); - tabAndCheck('add-team-name'); + tabAndCheck("add-team"); + cy.realPress("Enter"); + cy.contains("Team erfassen"); + focusedShouldHaveTestId("close-dialog"); + tabAndCheck("add-team-name"); cy.focused() - .type('Name of new team'); - tabAndCheck('save', 'Speichern'); - tabAndCheck('cancel', 'Abbrechen'); + .type("Name of new team"); + tabAndCheck("save", "Speichern"); + tabAndCheck("cancel", "Abbrechen"); }); - it('Should tab register member', () => { - cy.getByTestId('team-management') + it("Should tab register member", () => { + cy.getByTestId("team-management") .click(); - tabAndCheck('invite-member'); - cy.realPress('Enter'); - cy.contains('Member registrieren'); - focusedShouldHaveTestId('close-dialog'); - tabAndCheck('new-member-first-name'); - tabAndCheck('new-member-last-name'); - tabAndCheck('email-col_0'); + tabAndCheck("invite-member"); + cy.realPress("Enter"); + cy.contains("Member registrieren"); + focusedShouldHaveTestId("close-dialog"); + tabAndCheck("new-member-first-name"); + tabAndCheck("new-member-last-name"); + tabAndCheck("email-col_0"); cy.tabForward(); cy.focused() - .closest('app-puzzle-icon-button') - .should('have.attr', 'icon', 'delete-icon.svg'); - tabAndCheck('new-member-add-row', 'Weiterer Member hinzufügen'); - tabAndCheck('invite', 'Einladen'); - tabAndCheck('new-member-cancel', 'Abbrechen'); + .closest("app-puzzle-icon-button") + .should("have.attr", "icon", "delete-icon.svg"); + tabAndCheck("new-member-add-row", "Weiterer Member hinzufügen"); + tabAndCheck("invite", "Einladen"); + tabAndCheck("new-member-cancel", "Abbrechen"); }); - it('Should tab edit member', () => { - cy.getByTestId('team-management') + it("Should tab edit member", () => { + cy.getByTestId("team-management") .click(); - cy.pressUntilContains('Alice Wunderland', 'Tab'); + cy.pressUntilContains("Alice Wunderland", "Tab"); cy.tabForward(); - cy.realPress('Enter'); + cy.realPress("Enter"); cy.tabForward(); - focusedShouldHaveTestId('close-drawer'); + focusedShouldHaveTestId("close-drawer"); // Field to toggle if user is OKR-Champion cy.tabForward(); cy.focused() - .closest('app-puzzle-icon-button') - .should('have.attr', 'icon', 'edit.svg'); - cy.realPress('Enter'); + .closest("app-puzzle-icon-button") + .should("have.attr", "icon", "edit.svg"); + cy.realPress("Enter"); cy.tabForward(); - tabAndCheck('close-drawer'); + tabAndCheck("close-drawer"); cy.tabForward(); cy.focused() - .closest('mat-checkbox') - .should('have.attr', 'data-testId', 'edit-okr-champion-checkbox'); + .closest("mat-checkbox") + .should("have.attr", "data-testId", "edit-okr-champion-checkbox"); // Field to edit role of assigned team cy.tabForward(); cy.focused() - .closest('app-puzzle-icon-button') - .should('have.attr', 'icon', 'edit.svg'); - cy.realPress('Enter'); + .closest("app-puzzle-icon-button") + .should("have.attr", "icon", "edit.svg"); + cy.realPress("Enter"); cy.tabForward(); - tabAndCheck('select-team-role', 'Team-Member'); + tabAndCheck("select-team-role", "Team-Member"); // Button to delete assigned team cy.tabForward(); cy.focused() - .closest('app-puzzle-icon-button') - .should('have.attr', 'icon', 'delete-icon.svg'); + .closest("app-puzzle-icon-button") + .should("have.attr", "icon", "delete-icon.svg"); // Button to add user to another team - tabAndCheck('add-user'); - cy.realPress('Enter'); + tabAndCheck("add-user"); + cy.realPress("Enter"); cy.tabForward(); - tabAndCheck('select-team-dropdown', 'Puzzle ITC'); - tabAndCheck('select-team-role', 'Team-Member'); - tabAndCheck('add-user-to-team-save', 'Hinzufügen'); - tabAndCheck('add-user-to-team-cancel', 'Abbrechen'); + tabAndCheck("select-team-dropdown", "Puzzle ITC"); + tabAndCheck("select-team-role", "Team-Member"); + tabAndCheck("add-user-to-team-save", "Hinzufügen"); + tabAndCheck("add-user-to-team-cancel", "Abbrechen"); }); }); }); function tabToThreeDotMenuOption (name: string) { - cy.pressUntilContains(name, 'ArrowDown'); - cy.realPress('Enter'); + cy.pressUntilContains(name, "ArrowDown"); + cy.realPress("Enter"); } diff --git a/frontend/cypress/e2e/team.cy.ts b/frontend/cypress/e2e/team.cy.ts index 50a88bc4a0..cdb9fc9dfc 100644 --- a/frontend/cypress/e2e/team.cy.ts +++ b/frontend/cypress/e2e/team.cy.ts @@ -1,147 +1,151 @@ -import * as users from '../fixtures/users.json'; -import FilterHelper from '../support/helper/dom-helper/filterHelper'; -import CyOverviewPage from '../support/helper/dom-helper/pages/overviewPage'; -import TeammanagementPage from '../support/helper/dom-helper/pages/teammanagementPage'; +import * as users from "../fixtures/users.json"; +import FilterHelper from "../support/helper/dom-helper/filterHelper"; +import CyOverviewPage from "../support/helper/dom-helper/pages/overviewPage"; +import TeammanagementPage from "../support/helper/dom-helper/pages/teammanagementPage"; -describe('OKR team e2e tests', () => { - describe('tests via click', () => { +describe("OKR team e2e tests", () => { + describe("tests via click", () => { beforeEach(() => { cy.loginAsUser(users.gl); CyOverviewPage.do() .visitCurrentQuarter(); }); - it('Should select teams from teamfilter', () => { + it("Should select teams from teamfilter", () => { const filterHelper = FilterHelper.do() - .optionShouldBeSelected('Puzzle ITC') - .optionShouldBeSelected('LoremIpsum') - .optionShouldNotBeSelected('Alle') - .optionShouldNotBeSelected('/BBT') - .optionShouldNotBeSelected('we are cube'); + .optionShouldBeSelected("Puzzle ITC") + .optionShouldBeSelected("LoremIpsum") + .optionShouldNotBeSelected("Alle") + .optionShouldNotBeSelected("/BBT") + .optionShouldNotBeSelected("we are cube"); filterHelper - .toggleOption('Alle') - .optionShouldBeSelected('Alle', false) - .optionShouldBeSelected('/BBT') - .optionShouldBeSelected('Puzzle ITC') - .optionShouldBeSelected('LoremIpsum') - .optionShouldBeSelected('we are cube'); + .toggleOption("Alle") + .optionShouldBeSelected("Alle", false) + .optionShouldBeSelected("/BBT") + .optionShouldBeSelected("Puzzle ITC") + .optionShouldBeSelected("LoremIpsum") + .optionShouldBeSelected("we are cube"); filterHelper - .toggleOption('/BBT') - .optionShouldBeSelected('/BBT') - .optionShouldNotBeSelected('Alle') - .optionShouldNotBeSelected('Puzzle ITC') - .optionShouldNotBeSelected('LoremIpsum') - .optionShouldNotBeSelected('we are cube'); + .toggleOption("/BBT") + .optionShouldBeSelected("/BBT") + .optionShouldNotBeSelected("Alle") + .optionShouldNotBeSelected("Puzzle ITC") + .optionShouldNotBeSelected("LoremIpsum") + .optionShouldNotBeSelected("we are cube"); filterHelper - .toggleOption('Puzzle ITC') - .optionShouldBeSelected('/BBT') - .optionShouldNotBeSelected('Alle') - .optionShouldBeSelected('Puzzle ITC') - .optionShouldNotBeSelected('LoremIpsum') - .optionShouldNotBeSelected('we are cube'); + .toggleOption("Puzzle ITC") + .optionShouldBeSelected("/BBT") + .optionShouldNotBeSelected("Alle") + .optionShouldBeSelected("Puzzle ITC") + .optionShouldNotBeSelected("LoremIpsum") + .optionShouldNotBeSelected("we are cube"); }); - it('Deselect all teams from filter will display text on overview', () => { + it("Deselect all teams from filter will display text on overview", () => { const filterHelper = FilterHelper.do() - .optionShouldBeSelected('Puzzle ITC') - .optionShouldBeSelected('LoremIpsum') - .optionShouldNotBeSelected('Alle') - .optionShouldNotBeSelected('/BBT') - .optionShouldNotBeSelected('we are cube'); + .optionShouldBeSelected("Puzzle ITC") + .optionShouldBeSelected("LoremIpsum") + .optionShouldNotBeSelected("Alle") + .optionShouldNotBeSelected("/BBT") + .optionShouldNotBeSelected("we are cube"); - filterHelper.toggleOption('Puzzle ITC') - .toggleOption('LoremIpsum'); + filterHelper.toggleOption("Puzzle ITC") + .toggleOption("LoremIpsum"); - cy.contains('Kein Team ausgewählt'); + cy.contains("Kein Team ausgewählt"); }); - it('URL changes to the selected teams', () => { + it("URL changes to the selected teams", () => { const filterHelper = FilterHelper.do() - .optionShouldBeSelected('Puzzle ITC') - .optionShouldBeSelected('LoremIpsum') - .optionShouldNotBeSelected('Alle') - .optionShouldNotBeSelected('/BBT') - .optionShouldNotBeSelected('we are cube'); - - filterHelper.validateUrlParameter('teams', ['5', - '6']); - - filterHelper.toggleOption('/BBT') - .validateUrlParameter('teams', ['4', - '5', - '6']); - filterHelper.toggleOption('Puzzle ITC') - .toggleOption('LoremIpsum') - .toggleOption('/BBT'); + .optionShouldBeSelected("Puzzle ITC") + .optionShouldBeSelected("LoremIpsum") + .optionShouldNotBeSelected("Alle") + .optionShouldNotBeSelected("/BBT") + .optionShouldNotBeSelected("we are cube"); + + filterHelper.validateUrlParameter("teams", [ + "5", + "6" + ]); + + filterHelper.toggleOption("/BBT") + .validateUrlParameter("teams", [ + "4", + "5", + "6" + ]); + filterHelper.toggleOption("Puzzle ITC") + .toggleOption("LoremIpsum") + .toggleOption("/BBT"); cy.url() - .should('not.include', 'teams='); + .should("not.include", "teams="); }); - it('Select teams by url', () => { + it("Select teams by url", () => { cy.url() - .should('not.include', 'teams'); + .should("not.include", "teams"); - cy.visit('/?quarter=2&teams=4,5,8'); + cy.visit("/?quarter=2&teams=4,5,8"); FilterHelper.do() - .optionShouldNotBeSelected('Alle') - .optionShouldBeSelected('/BBT') - .optionShouldBeSelected('Puzzle ITC') - .optionShouldBeSelected('we are cube') - .optionShouldNotBeSelected('LoremIpsum'); + .optionShouldNotBeSelected("Alle") + .optionShouldBeSelected("/BBT") + .optionShouldBeSelected("Puzzle ITC") + .optionShouldBeSelected("we are cube") + .optionShouldNotBeSelected("LoremIpsum"); }); - it('should display less button on mobile header', () => { + it("should display less button on mobile header", () => { const teammanagementPage = TeammanagementPage.do() .visitViaURL(); - cy.intercept('POST', '**/teams') - .as('addTeam'); + cy.intercept("POST", "**/teams") + .as("addTeam"); teammanagementPage.addTeam() - .fillName('X-Team') + .fillName("X-Team") .submit(); - cy.wait('@addTeam'); - cy.contains('X-Team'); + cy.wait("@addTeam"); + cy.contains("X-Team"); teammanagementPage.addTeam() - .fillName('Y-Team') + .fillName("Y-Team") .submit(); - cy.wait('@addTeam'); - cy.contains('Y-Team'); + cy.wait("@addTeam"); + cy.contains("Y-Team"); teammanagementPage.addTeam() - .fillName('Z-Team') + .fillName("Z-Team") .submit(); - cy.wait('@addTeam'); - cy.contains('Z-Team'); + cy.wait("@addTeam"); + cy.contains("Z-Team"); teammanagementPage.visitOverview(); // set viewport to < 768 to trigger mobile header cy.viewport(767, 1200); - cy.getByTestId('expansion-panel-header') + cy.getByTestId("expansion-panel-header") .click(); - cy.contains('Weniger'); + cy.contains("Weniger"); // reset viewport - cy.viewport(Cypress.config('viewportWidth'), Cypress.config('viewportHeight')); + cy.viewport(Cypress.config("viewportWidth"), Cypress.config("viewportHeight")); cy.visit(`${teammanagementPage.getURL()}`); - cy.intercept('DELETE', '**/teams/*') - .as('deleteTeam'); + cy.intercept("DELETE", "**/teams/*") + .as("deleteTeam"); - teammanagementPage.deleteTeam('X-Team') + teammanagementPage.deleteTeam("X-Team") .submit(); - cy.wait('@deleteTeam'); + cy.wait("@deleteTeam"); - teammanagementPage.deleteTeam('Y-Team') + teammanagementPage.deleteTeam("Y-Team") .submit(); - cy.wait('@deleteTeam'); + cy.wait("@deleteTeam"); - teammanagementPage.deleteTeam('Z-Team') + teammanagementPage.deleteTeam("Z-Team") .submit(); - cy.wait('@deleteTeam'); + cy.wait("@deleteTeam"); }); }); }); diff --git a/frontend/cypress/e2e/teammanagement.cy.ts b/frontend/cypress/e2e/teammanagement.cy.ts index 19b154a3bf..dad79839db 100644 --- a/frontend/cypress/e2e/teammanagement.cy.ts +++ b/frontend/cypress/e2e/teammanagement.cy.ts @@ -1,26 +1,26 @@ -import * as users from '../fixtures/users.json'; -import { uniqueSuffix } from '../support/helper/utils'; -import ConfirmDialog from '../support/helper/dom-helper/dialogs/confirmDialog'; -import TeammanagementPage from '../support/helper/dom-helper/pages/teammanagementPage'; -import CyOverviewPage from '../support/helper/dom-helper/pages/overviewPage'; -import InviteMembersDialog from '../support/helper/dom-helper/dialogs/inviteMembersDialog'; -import FilterHelper from '../support/helper/dom-helper/filterHelper'; - -describe('Team management tests', () => { - const teamName = uniqueSuffix('New Team'); +import * as users from "../fixtures/users.json"; +import { uniqueSuffix } from "../support/helper/utils"; +import ConfirmDialog from "../support/helper/dom-helper/dialogs/confirmDialog"; +import TeammanagementPage from "../support/helper/dom-helper/pages/teammanagementPage"; +import CyOverviewPage from "../support/helper/dom-helper/pages/overviewPage"; +import InviteMembersDialog from "../support/helper/dom-helper/dialogs/inviteMembersDialog"; +import FilterHelper from "../support/helper/dom-helper/filterHelper"; + +describe("Team management tests", () => { + const teamName = uniqueSuffix("New Team"); const nameEsha = users.bl.name; - describe('Routing to overview', () => { + describe("Routing to overview", () => { beforeEach(() => { cy.loginAsUser(users.gl); }); - it('should preserve team filter', () => { + it("should preserve team filter", () => { CyOverviewPage.do() .visitViaURL(); FilterHelper.do() - .toggleOption('/BBT') - .toggleOption('Puzzle ITC'); + .toggleOption("/BBT") + .toggleOption("Puzzle ITC"); checkTeamsSelected(); CyOverviewPage.do() .visitTeammanagement(); @@ -37,19 +37,19 @@ describe('Team management tests', () => { function checkTeamsSelected () { FilterHelper.do() - .optionShouldBeSelected('LoremIpsum') - .optionShouldBeSelected('/BBT'); + .optionShouldBeSelected("LoremIpsum") + .optionShouldBeSelected("/BBT"); } }); - describe('As GL', () => { + describe("As GL", () => { let teammanagementPage: TeammanagementPage; before(() => { // login as bl to ensure this user exists in database cy.loginAsUser(users.bl); - cy.getByTestId('user-name') + cy.getByTestId("user-name") .click(); - cy.getByTestId('logout') + cy.getByTestId("logout") .click(); }); @@ -59,91 +59,93 @@ describe('Team management tests', () => { .visitViaURL(); }); - it('Create team', () => { - cy.intercept('POST', '**/teams') - .as('addTeam'); + it("Create team", () => { + cy.intercept("POST", "**/teams") + .as("addTeam"); teammanagementPage.addTeam() .fillName(teamName) .submit(); - cy.wait('@addTeam'); + cy.wait("@addTeam"); cy.contains(teamName); }); - it('Try to remove last admin of team should not work', () => { - cy.intercept('PUT', '**/removeuser') - .as('removeUser'); + it("Try to remove last admin of team should not work", () => { + cy.intercept("PUT", "**/removeuser") + .as("removeUser"); - cy.get('app-team-list .mat-mdc-list-item') + cy.get("app-team-list .mat-mdc-list-item") .contains(teamName) .click(); - cy.getByTestId('member-list-more') + cy.getByTestId("member-list-more") .click(); - cy.getByTestId('remove-from-member-list') + cy.getByTestId("remove-from-member-list") .click(); ConfirmDialog.do() - .checkTitle('Mitglied entfernen') + .checkTitle("Mitglied entfernen") .checkDescription(`Möchtest du Jaya Norris wirklich aus dem Team '${teamName}' entfernen?`) .submit(); - cy.wait('@removeUser'); + cy.wait("@removeUser"); - cy.contains('Der letzte Administrator eines Teams kann nicht entfernt werden') - .should('exist'); + cy.contains("Der letzte Administrator eines Teams kann nicht entfernt werden") + .should("exist"); }); - it('clicking cancel in dialog when removing user should not remove user', () => { - cy.intercept('PUT', '**/removeuser') - .as('removeUser'); + it("clicking cancel in dialog when removing user should not remove user", () => { + cy.intercept("PUT", "**/removeuser") + .as("removeUser"); - cy.get('app-team-list .mat-mdc-list-item') + cy.get("app-team-list .mat-mdc-list-item") .contains(teamName) .click(); - cy.getByTestId('member-list-more') + cy.getByTestId("member-list-more") .click(); - cy.getByTestId('remove-from-member-list') + cy.getByTestId("remove-from-member-list") .click(); // cancel dialog ConfirmDialog.do() - .checkTitle('Mitglied entfernen') + .checkTitle("Mitglied entfernen") .checkDescription(`Möchtest du Jaya Norris wirklich aus dem Team '${teamName}' entfernen?`) .cancel(); - cy.get('@removeUser.all') + cy.get("@removeUser.all") .then((interceptions) => { expect(interceptions).to.have.length(0); }); }); - it('Edit team', () => { - cy.intercept('GET', '**/users') - .as('getUsers'); - cy.intercept('GET', '**/teams') - .as('getTeams'); + it("Edit team", () => { + cy.intercept("GET", "**/users") + .as("getUsers"); + cy.intercept("GET", "**/teams") + .as("getTeams"); - cy.get('app-team-list .mat-mdc-list-item') - .contains('LoremIpsum') + cy.get("app-team-list .mat-mdc-list-item") + .contains("LoremIpsum") .click(); - editTeamNameAndTest('IpsumLorem'); - cy.visit('team-management'); + editTeamNameAndTest("IpsumLorem"); + cy.visit("team-management"); - cy.wait(['@getUsers', - '@getTeams']); + cy.wait([ + "@getUsers", + "@getTeams" + ]); - cy.contains('LoremIpsum') - .should('not.exist'); - cy.contains('IpsumLorem') - .should('exist'); + cy.contains("LoremIpsum") + .should("not.exist"); + cy.contains("IpsumLorem") + .should("exist"); // set old team name again - cy.get('app-team-list .mat-mdc-list-item') - .contains('IpsumLorem') + cy.get("app-team-list .mat-mdc-list-item") + .contains("IpsumLorem") .click(); - editTeamNameAndTest('LoremIpsum'); + editTeamNameAndTest("LoremIpsum"); }); - it('Delete team', () => { + it("Delete team", () => { // Click delete button and cancel teammanagementPage.deleteTeam(teamName) .cancel(); @@ -153,152 +155,152 @@ describe('Team management tests', () => { .submit(); }); - describe('Search', () => { - it('Search user', () => { + describe("Search", () => { + it("Search user", () => { teammanagementPage.elements .teamSearch() - .fill('pa') - .shouldHaveOption('Paco Eggimann (peggimann@puzzle.ch)') - .shouldHaveOption('Paco Egiman (egiman@puzzle.ch)') - .selectOption('Robin Papierer (papierer@puzzle.ch)'); + .fill("pa") + .shouldHaveOption("Paco Eggimann (peggimann@puzzle.ch)") + .shouldHaveOption("Paco Egiman (egiman@puzzle.ch)") + .selectOption("Robin Papierer (papierer@puzzle.ch)"); - cy.contains('app-member-detail h2', 'Robin Papierer'); + cy.contains("app-member-detail h2", "Robin Papierer"); }); - it('Search team', () => { + it("Search team", () => { teammanagementPage.elements.teamSearch() - .fill('we are') - .selectOption('we are cube.³'); + .fill("we are") + .selectOption("we are cube.³"); - cy.contains('app-member-list h2', 'we are cube.³'); + cy.contains("app-member-list h2", "we are cube.³"); }); - it('Search mixed', () => { + it("Search mixed", () => { teammanagementPage.elements .teamSearch() - .fill('puz') - .shouldHaveLabel('Members') - .shouldHaveLabel('Teams') - .shouldHaveOption('Paco Eggimann (peggimann@puzzle.ch)') - .shouldHaveOption('Paco Egiman (egiman@puzzle.ch)') - .shouldHaveOption('Robin Papierer (papierer@puzzle.ch)') - .shouldHaveOption('Puzzle ITC'); + .fill("puz") + .shouldHaveLabel("Members") + .shouldHaveLabel("Teams") + .shouldHaveOption("Paco Eggimann (peggimann@puzzle.ch)") + .shouldHaveOption("Paco Egiman (egiman@puzzle.ch)") + .shouldHaveOption("Robin Papierer (papierer@puzzle.ch)") + .shouldHaveOption("Puzzle ITC"); }); }); - describe('invite members', () => { - it('invite two members', () => { + describe("invite members", () => { + it("invite two members", () => { teammanagementPage.elements.registerMember() .click(); const firstNames = InviteMembersDialog.do() - .enterUser('Claudia', 'Meier', 'claudia.meier@test.ch') + .enterUser("Claudia", "Meier", "claudia.meier@test.ch") .addAnotherUser() - .enterUser('Stefan', 'Schmidt', 'stefan.schmidt@test.ch') + .enterUser("Stefan", "Schmidt", "stefan.schmidt@test.ch") .addAnotherUser() .getFirstNames(); // test error messages - fillOutNewUser('Robin', '', 'papierer'); - cy.getByTestId('invite') + fillOutNewUser("Robin", "", "papierer"); + cy.getByTestId("invite") .click(); - cy.contains('Angabe benötigt'); - cy.contains('E-Mail ungültig'); - cy.getByTestId('email-col_2') + cy.contains("Angabe benötigt"); + cy.contains("E-Mail ungültig"); + cy.getByTestId("email-col_2") .focus(); - cy.realType('@puzzle.ch'); - cy.contains('E-Mail ungültig') - .should('not.exist'); - cy.contains('E-Mail existiert bereits'); + cy.realType("@puzzle.ch"); + cy.contains("E-Mail ungültig") + .should("not.exist"); + cy.contains("E-Mail existiert bereits"); cy.tabBackward(); - cy.realType('Papirer'); - cy.contains('Angabe benötigt') - .should('not.exist'); + cy.realType("Papirer"); + cy.contains("Angabe benötigt") + .should("not.exist"); // delete last entry cy.tabForward(); cy.tabForward(); - cy.realPress('Enter'); - cy.contains('papiererr@puzzle.ch') - .should('not.exist'); + cy.realPress("Enter"); + cy.contains("papiererr@puzzle.ch") + .should("not.exist"); // save - cy.getByTestId('invite') + cy.getByTestId("invite") .click(); - cy.contains('Die Members wurden erfolgreich registriert'); + cy.contains("Die Members wurden erfolgreich registriert"); firstNames.forEach((email) => cy.contains(email)); }); }); - it('Navigate to Bobs profile and add him to BBT and LoremIpsum', () => { - cy.intercept('PUT', '**/updateaddteammembership/*') - .as('updateEsha'); + it("Navigate to Bobs profile and add him to BBT and LoremIpsum", () => { + cy.intercept("PUT", "**/updateaddteammembership/*") + .as("updateEsha"); navigateToUser(nameEsha); // add to team bbt as admin - cy.get('app-member-detail') - .findByTestId('add-user') + cy.get("app-member-detail") + .findByTestId("add-user") .click(); - cy.get('app-member-detail') - .findByTestId('select-team-dropdown') + cy.get("app-member-detail") + .findByTestId("select-team-dropdown") .click(); - cy.getByTestId('select-team-dropdown-option') - .contains('/BBT') + cy.getByTestId("select-team-dropdown-option") + .contains("/BBT") .click(); - cy.get('app-member-detail') - .findByTestId('select-team-role') + cy.get("app-member-detail") + .findByTestId("select-team-role") .click(); - cy.getByTestId('select-team-role-admin') + cy.getByTestId("select-team-role-admin") .click(); - cy.get('app-member-detail') - .findByTestId('add-user-to-team-save') + cy.get("app-member-detail") + .findByTestId("add-user-to-team-save") .click(); - cy.wait('@updateEsha'); + cy.wait("@updateEsha"); // add to team loremipsum as member - cy.get('app-member-detail') - .findByTestId('add-user') + cy.get("app-member-detail") + .findByTestId("add-user") .click(); - cy.get('app-member-detail') - .findByTestId('select-team-dropdown') + cy.get("app-member-detail") + .findByTestId("select-team-dropdown") .click(); // team BBT should not be in list anymore - cy.getByTestId('select-team-dropdown-option') - .should('not.contain', '/BBT'); + cy.getByTestId("select-team-dropdown-option") + .should("not.contain", "/BBT"); - cy.getByTestId('select-team-dropdown-option') - .contains('LoremIpsum') + cy.getByTestId("select-team-dropdown-option") + .contains("LoremIpsum") .click(); - cy.get('app-member-detail') - .findByTestId('select-team-role') + cy.get("app-member-detail") + .findByTestId("select-team-role") .click(); - cy.getByTestId('select-team-role-member') + cy.getByTestId("select-team-role-member") .click(); - cy.get('app-member-detail') - .findByTestId('add-user-to-team-save') + cy.get("app-member-detail") + .findByTestId("add-user-to-team-save") .click(); - cy.wait('@updateEsha'); + cy.wait("@updateEsha"); // check table checkRolesForEsha(); closeOverlay(); let foundEsha = false; - cy.get('app-member-list tbody tr') + cy.get("app-member-list tbody tr") .each(($row) => { - const usernameCell = $row.find('td:nth-child(2)'); + const usernameCell = $row.find("td:nth-child(2)"); if (usernameCell.text() .trim() === nameEsha) { foundEsha = true; - const roleCell = $row.find('td:nth-child(3)'); - const teamsCell = $row.find('td:nth-child(4)'); + const roleCell = $row.find("td:nth-child(3)"); + const teamsCell = $row.find("td:nth-child(4)"); expect(roleCell.text() - .trim()).to.equal('Team-Admin, Team-Member'); + .trim()).to.equal("Team-Admin, Team-Member"); expect(teamsCell.text() - .trim()).to.equal('/BBT, LoremIpsum'); + .trim()).to.equal("/BBT, LoremIpsum"); return false; } return true; @@ -308,282 +310,282 @@ describe('Team management tests', () => { }); }); - it('Navigate to user Esha and set as okr champion', () => { + it("Navigate to user Esha and set as okr champion", () => { navigateToUser(nameEsha); - cy.getByTestId('edit-okr-champion-readonly') - .contains('OKR Champion:'); - cy.getByTestId('edit-okr-champion-readonly') - .contains('Nein'); - cy.getByTestId('edit-okr-champion-edit') - .click(); - cy.getByTestId('edit-okr-champion-readonly') - .should('not.exist'); - cy.getByTestId('edit-okr-champion-checkbox') - .click(); - cy.getByTestId('edit-okr-champion-readonly') - .contains('OKR Champion:'); - cy.getByTestId('edit-okr-champion-readonly') - .contains('Ja'); - cy.contains('Der Member wurde erfolgreich aktualisiert.'); + cy.getByTestId("edit-okr-champion-readonly") + .contains("OKR Champion:"); + cy.getByTestId("edit-okr-champion-readonly") + .contains("Nein"); + cy.getByTestId("edit-okr-champion-edit") + .click(); + cy.getByTestId("edit-okr-champion-readonly") + .should("not.exist"); + cy.getByTestId("edit-okr-champion-checkbox") + .click(); + cy.getByTestId("edit-okr-champion-readonly") + .contains("OKR Champion:"); + cy.getByTestId("edit-okr-champion-readonly") + .contains("Ja"); + cy.contains("Der Member wurde erfolgreich aktualisiert."); // reset okr champion to false - cy.getByTestId('edit-okr-champion-edit') + cy.getByTestId("edit-okr-champion-edit") .click(); - cy.getByTestId('edit-okr-champion-checkbox') + cy.getByTestId("edit-okr-champion-checkbox") .click(); - cy.getByTestId('edit-okr-champion-readonly') - .contains('OKR Champion:'); - cy.getByTestId('edit-okr-champion-readonly') - .contains('Nein'); + cy.getByTestId("edit-okr-champion-readonly") + .contains("OKR Champion:"); + cy.getByTestId("edit-okr-champion-readonly") + .contains("Nein"); // test click outside of element - cy.getByTestId('edit-okr-champion-edit') + cy.getByTestId("edit-okr-champion-edit") .click(); - cy.get('app-member-detail') - .find('h2') + cy.get("app-member-detail") + .find("h2") .click(); // checkbox should hide again - cy.getByTestId('edit-okr-champion-readonly') - .contains('OKR Champion:'); - cy.getByTestId('edit-okr-champion-readonly') - .contains('Nein'); + cy.getByTestId("edit-okr-champion-readonly") + .contains("OKR Champion:"); + cy.getByTestId("edit-okr-champion-readonly") + .contains("Nein"); }); }); - describe('As BL', () => { + describe("As BL", () => { beforeEach(() => { cy.loginAsUser(users.bl); - cy.getByTestId('team-management') + cy.getByTestId("team-management") .click(); - cy.intercept('GET', '**/users/*') - .as('getEsha'); + cy.intercept("GET", "**/users/*") + .as("getEsha"); }); - it('should check if correct roles for BL are set', () => { - cy.get('td') + it("should check if correct roles for BL are set", () => { + cy.get("td") .contains(nameEsha) .click(); - cy.wait('@getEsha'); + cy.wait("@getEsha"); checkRolesForEsha(); closeOverlay(); }); - it('should check if team loremIpsum cannot be edited', () => { - cy.get('app-team-management') - .contains('LoremIpsum') - .click(); - cy.getByTestId('teamMoreButton') - .should('not.exist'); - cy.getByTestId('editTeamButton') - .should('not.exist'); - cy.getByTestId('member-list-more') - .should('not.exist'); - cy.getByTestId('edit-role') - .should('not.exist'); + it("should check if team loremIpsum cannot be edited", () => { + cy.get("app-team-management") + .contains("LoremIpsum") + .click(); + cy.getByTestId("teamMoreButton") + .should("not.exist"); + cy.getByTestId("editTeamButton") + .should("not.exist"); + cy.getByTestId("member-list-more") + .should("not.exist"); + cy.getByTestId("edit-role") + .should("not.exist"); }); - it('should check if team /BBT can be edited and edit name', () => { - cy.get('app-team-management') - .contains('/BBT') + it("should check if team /BBT can be edited and edit name", () => { + cy.get("app-team-management") + .contains("/BBT") .click(); - cy.getByTestId('teamMoreButton') - .should('exist'); - editTeamNameAndTest('/BBT_edit'); + cy.getByTestId("teamMoreButton") + .should("exist"); + editTeamNameAndTest("/BBT_edit"); // restore old name - editTeamNameAndTest('/BBT'); + editTeamNameAndTest("/BBT"); }); - it('should add members to team /BBT', () => { - cy.get('app-team-management') - .contains('/BBT') + it("should add members to team /BBT", () => { + cy.get("app-team-management") + .contains("/BBT") .click(); - cy.getByTestId('add-team-member') + cy.getByTestId("add-team-member") .click(); - cy.getByTestId('search-member-to-add') + cy.getByTestId("search-member-to-add") .click(); // esha should not exist (is already member of team) - const matOption = '.cdk-overlay-container mat-option'; + const matOption = ".cdk-overlay-container mat-option"; cy.get(matOption) .contains(nameEsha) - .should('not.exist'); + .should("not.exist"); // add findus peterson - cy.getByTestId('search-member-to-add') - .as('member-search') + cy.getByTestId("search-member-to-add") + .as("member-search") .click(); - cy.get('@member-search') - .type('Find'); - cy.contains(matOption, 'Findus Peterson') + cy.get("@member-search") + .type("Find"); + cy.contains(matOption, "Findus Peterson") .click(); // add robin papierer - cy.getByTestId('search-member-to-add') + cy.getByTestId("search-member-to-add") .click(); cy.get(matOption) - .contains('Findus Peterson') - .should('not.exist'); + .contains("Findus Peterson") + .should("not.exist"); cy.get(matOption) - .contains('Robin Papierer') + .contains("Robin Papierer") .click(); // check if Findus and Robin exists in table - const allMemberTableTr = '#all-member-table tbody tr'; + const allMemberTableTr = "#all-member-table tbody tr"; cy.get(allMemberTableTr) .eq(0) - .should('contain', 'Findus Peterson'); + .should("contain", "Findus Peterson"); cy.get(allMemberTableTr) .eq(1) - .should('contain', 'Robin Papierer'); + .should("contain", "Robin Papierer"); // remove robin papierer from list - cy.get(allMemberTableTr + ' button') + cy.get(allMemberTableTr + " button") .eq(1) .click(); cy.get(allMemberTableTr) .eq(1) - .should('not.exist'); + .should("not.exist"); - cy.getByTestId('save') + cy.getByTestId("save") .click(); }); - it('should change role of Findus Peterson to Team Admin', () => { - cy.get('app-team-management') - .contains('/BBT') + it("should change role of Findus Peterson to Team Admin", () => { + cy.get("app-team-management") + .contains("/BBT") .click(); - cy.get('app-member-list tbody tr') + cy.get("app-member-list tbody tr") .each(($row) => { - const usernameCell = $row.find('td:nth-child(2)'); + const usernameCell = $row.find("td:nth-child(2)"); if (usernameCell.text() - .trim() !== 'Findus Peterson') { + .trim() !== "Findus Peterson") { return; } - $row.find(`[data-testId='edit-role']`) + $row.find("[data-testId='edit-role']") .click(); cy.wait(500); // wait for dialog to open }) .then(() => { - cy.getByTestId('select-team-role') + cy.getByTestId("select-team-role") .click(); - cy.getByTestId('select-team-role-admin') + cy.getByTestId("select-team-role-admin") .click(); - cy.getByTestId('select-team-role') - .should('not.exist'); - cy.contains('Das Team wurde erfolgreich aktualisiert.'); + cy.getByTestId("select-team-role") + .should("not.exist"); + cy.contains("Das Team wurde erfolgreich aktualisiert."); }); }); - it('should test that Findus Peterson cannot be added to further teams', () => { - navigateToUser('Findus Peterson'); + it("should test that Findus Peterson cannot be added to further teams", () => { + navigateToUser("Findus Peterson"); /* * current user BL (Esha Harris) is only admin in /BBT team. * That's why 'add-team-member' should be disabled */ - cy.get('app-member-detail') - .getByTestId('add-user') - .should('be.disabled'); + cy.get("app-member-detail") + .getByTestId("add-user") + .should("be.disabled"); }); - it('should remove BBT membership of findus', () => { - navigateToUser('Findus Peterson'); - cy.getByTestId('delete-team-member') + it("should remove BBT membership of findus", () => { + navigateToUser("Findus Peterson"); + cy.getByTestId("delete-team-member") .click(); ConfirmDialog.do() - .checkTitle('Mitglied entfernen') - .checkDescription(`Möchtest du Findus Peterson wirklich aus dem Team '/BBT' entfernen?`) + .checkTitle("Mitglied entfernen") + .checkDescription("Möchtest du Findus Peterson wirklich aus dem Team '/BBT' entfernen?") .submit(); - cy.get('app-member-detail') - .contains('/BBT') - .should('not.exist'); + cy.get("app-member-detail") + .contains("/BBT") + .should("not.exist"); }); - it('should remove added memberships from esha', () => { - cy.intercept('PUT', '**/removeuser') - .as('removeUser'); + it("should remove added memberships from esha", () => { + cy.intercept("PUT", "**/removeuser") + .as("removeUser"); navigateToUser(nameEsha); - cy.getByTestId('delete-team-member') + cy.getByTestId("delete-team-member") .eq(0) .click(); ConfirmDialog.do() - .checkTitle('Mitglied entfernen') + .checkTitle("Mitglied entfernen") .checkDescription(`Möchtest du ${nameEsha} wirklich aus dem Team '/BBT' entfernen?`) .submit(); - cy.wait('@removeUser'); + cy.wait("@removeUser"); - cy.getByTestId('delete-team-member') + cy.getByTestId("delete-team-member") .eq(0) .click(); ConfirmDialog.do() - .checkTitle('Mitglied entfernen') + .checkTitle("Mitglied entfernen") .checkDescription(`Möchtest du ${nameEsha} wirklich aus dem Team 'LoremIpsum' entfernen?`) .submit(); - cy.get('app-member-detail') - .should('not.contain', '/BBT') - .and('not.contain', 'LoremIpsum'); + cy.get("app-member-detail") + .should("not.contain", "/BBT") + .and("not.contain", "LoremIpsum"); }); - it('Navigate to user Esha and check if okr champion is not editable', () => { + it("Navigate to user Esha and check if okr champion is not editable", () => { navigateToUser(nameEsha); - cy.getByTestId('edit-okr-champion-readonly') - .should('exist'); - cy.getByTestId('edit-okr-champion-edit') - .should('not.exist'); + cy.getByTestId("edit-okr-champion-readonly") + .should("exist"); + cy.getByTestId("edit-okr-champion-edit") + .should("not.exist"); }); }); }); function closeOverlay () { - cy.get('.cdk-overlay-backdrop') - .click(-50, -50, { force: true }); + cy.get(".cdk-overlay-backdrop") + .click(-50, -50, { "force": true }); } function checkRolesForEsha () { - cy.get('app-member-detail tbody tr') + cy.get("app-member-detail tbody tr") .eq(0) - .should('contain', '/BBT') - .and('contain', 'Team-Admin'); - cy.get('app-member-detail tbody tr') + .should("contain", "/BBT") + .and("contain", "Team-Admin"); + cy.get("app-member-detail tbody tr") .eq(1) - .should('contain', 'LoremIpsum') - .and('contain', 'Team-Member'); + .should("contain", "LoremIpsum") + .and("contain", "Team-Member"); } function editTeamNameAndTest (teamName: string) { - cy.intercept('PUT', '**/teams/*') - .as('saveTeam'); - cy.getByTestId('editTeamButton') + cy.intercept("PUT", "**/teams/*") + .as("saveTeam"); + cy.getByTestId("editTeamButton") .click(); - cy.getByTestId('add-team-name') - .as('team-name') + cy.getByTestId("add-team-name") + .as("team-name") .click(); - cy.get('@team-name') + cy.get("@team-name") .clear(); - cy.get('@team-name') + cy.get("@team-name") .type(teamName); - cy.getByTestId('save') + cy.getByTestId("save") .click(); - cy.wait('@saveTeam'); + cy.wait("@saveTeam"); cy.contains(teamName); } function navigateToUser (userName: string) { - cy.intercept('GET', '**/users/*') - .as('getUser'); - cy.get('td') + cy.intercept("GET", "**/users/*") + .as("getUser"); + cy.get("td") .contains(userName) .click(); - cy.wait('@getUser'); + cy.wait("@getUser"); } function fillOutNewUser (firstname: string, lastname: string, email: string) { diff --git a/frontend/cypress/support/commands.ts b/frontend/cypress/support/commands.ts index d69d44e2d6..59bcdd9eff 100644 --- a/frontend/cypress/support/commands.ts +++ b/frontend/cypress/support/commands.ts @@ -1,14 +1,14 @@ -import { validateScoring } from './helper/scoringSupport'; -import { keyCodeDefinitions } from 'cypress-real-events/keyCodeDefinitions'; -import { pressUntilContains, doUntilSelector } from './helper/utils'; +import { validateScoring } from "./helper/scoringSupport"; +import { keyCodeDefinitions } from "cypress-real-events/keyCodeDefinitions"; +import { pressUntilContains, doUntilSelector } from "./helper/utils"; import Chainable = Cypress.Chainable; -Cypress.Commands.add('loginAsUser', (user: any) => { +Cypress.Commands.add("loginAsUser", (user: any) => { loginWithCredentials(user.username, user.password); overviewIsLoaded(); }); -Cypress.Commands.add('getByTestId', (testId: string, text?: string): Chainable => { +Cypress.Commands.add("getByTestId", (testId: string, text?: string): Chainable => { const selector = `[data-testId=${testId}]`; if (text) { @@ -19,62 +19,62 @@ Cypress.Commands.add('getByTestId', (testId: string, text?: string): Chainable = } }); -Cypress.Commands.add('findByTestId', - { prevSubject: true }, - (subject: JQuery, testId: string, text?: string): Chainable => { - const selector = `[data-testId=${testId}]`; - if (text) { - return cy.wrap(subject) - .find(selector) - .contains(text); - } else { - return cy.wrap(subject) - .find(selector); - } - }); +Cypress.Commands.add("findByTestId", { "prevSubject": true }, (subject: JQuery, testId: string, text?: string): Chainable => { + const selector = `[data-testId=${testId}]`; + if (text) { + return cy.wrap(subject) + .find(selector) + .contains(text); + } else { + return cy.wrap(subject) + .find(selector); + } +}); -Cypress.Commands.add('pressUntilContains', (text: string, key: keyof typeof keyCodeDefinitions) => { +Cypress.Commands.add("pressUntilContains", (text: string, key: keyof typeof keyCodeDefinitions) => { pressUntilContains(text, key); }); -Cypress.Commands.add('tabForward', () => { - cy.realPress('Tab'); +Cypress.Commands.add("tabForward", () => { + cy.realPress("Tab"); }); -Cypress.Commands.add('tabBackward', () => { - cy.realPress(['Shift', - 'Tab']); +Cypress.Commands.add("tabBackward", () => { + cy.realPress([ + "Shift", + "Tab" + ]); }); -Cypress.Commands.add('tabForwardUntil', (selector: string, limit?: number) => { +Cypress.Commands.add("tabForwardUntil", (selector: string, limit?: number) => { doUntilSelector(selector, cy.tabForward, limit); }); -Cypress.Commands.add('tabBackwardUntil', (selector: string, limit?: number) => { +Cypress.Commands.add("tabBackwardUntil", (selector: string, limit?: number) => { doUntilSelector(selector, cy.tabBackward, limit); }); -Cypress.Commands.add('getZone', (zone: string, onOverview: boolean) => { - return (onOverview ? cy.focused() : cy.getByTestId('side-panel')).findByTestId(zone); +Cypress.Commands.add("getZone", (zone: string, onOverview: boolean) => { + return (onOverview ? cy.focused() : cy.getByTestId("side-panel")).findByTestId(zone); }); -Cypress.Commands.add('validateScoring', (isOverview: boolean, percentage: number) => { +Cypress.Commands.add("validateScoring", (isOverview: boolean, percentage: number) => { validateScoring(isOverview, percentage); }); function loginWithCredentials (username: string, password: string) { - cy.visit('/'); - cy.intercept('GET', '**/users/current') - .as('getCurrentUser'); - cy.origin(Cypress.env('login_url'), { args: { username, + cy.visit("/"); + cy.intercept("GET", "**/users/current") + .as("getCurrentUser"); + cy.origin(Cypress.env("login_url"), { "args": { username, password } }, ({ username, password }) => { - cy.get('input[name="username"]') + cy.get("input[name=\"username\"]") .type(username); - cy.get('input[name="password"]') + cy.get("input[name=\"password\"]") .type(password); - cy.get('button[type="submit"]') + cy.get("button[type=\"submit\"]") .click(); - cy.wait('@getCurrentUser', { responseTimeout: 10000 }); + cy.wait("@getCurrentUser", { "responseTimeout": 10000 }); }); cy.url() .then((url) => { @@ -85,8 +85,8 @@ function loginWithCredentials (username: string, password: string) { }); } -const overviewIsLoaded = () => cy.get('mat-chip') - .should('have.length.at.least', 2); +const overviewIsLoaded = () => cy.get("mat-chip") + .should("have.length.at.least", 2); /* * -- This is a parent command -- diff --git a/frontend/cypress/support/component.ts b/frontend/cypress/support/component.ts index 2733f4b08b..2a4850ed6f 100644 --- a/frontend/cypress/support/component.ts +++ b/frontend/cypress/support/component.ts @@ -1,5 +1,5 @@ -import './commands'; -import { keyCodeDefinitions } from 'cypress-real-events/keyCodeDefinitions'; +import "./commands"; +import { keyCodeDefinitions } from "cypress-real-events/keyCodeDefinitions"; declare global { namespace Cypress { diff --git a/frontend/cypress/support/e2e.ts b/frontend/cypress/support/e2e.ts index 3628b50adf..73b1c9e70b 100644 --- a/frontend/cypress/support/e2e.ts +++ b/frontend/cypress/support/e2e.ts @@ -15,14 +15,14 @@ * *********************************************************** */ -import './commands'; -import 'cypress-real-events'; -import { onlyOn } from '@cypress/skip-test'; +import "./commands"; +import "cypress-real-events"; +import { onlyOn } from "@cypress/skip-test"; Cypress.Keyboard.defaults({ - keystrokeDelay: 0 + "keystrokeDelay": 0 }); beforeEach(() => { - onlyOn('chrome'); + onlyOn("chrome"); }); diff --git a/frontend/cypress/support/helper/dom-helper/angularSearchBox.ts b/frontend/cypress/support/helper/dom-helper/angularSearchBox.ts index c9fe560037..22603028c4 100644 --- a/frontend/cypress/support/helper/dom-helper/angularSearchBox.ts +++ b/frontend/cypress/support/helper/dom-helper/angularSearchBox.ts @@ -1,4 +1,4 @@ -import { PageObjectMapperBase } from './pageObjectMapperBase'; +import { PageObjectMapperBase } from "./pageObjectMapperBase"; export default class AngularSearchBox extends PageObjectMapperBase { selector: string; @@ -10,7 +10,7 @@ export default class AngularSearchBox extends PageObjectMapperBase { } fill (value: string) { - const input = cy.get('input') + const input = cy.get("input") .first(); input.clear(); input.type(value); @@ -18,17 +18,17 @@ export default class AngularSearchBox extends PageObjectMapperBase { } shouldHaveOption (option: string) { - cy.contains('.mat-mdc-autocomplete-panel mat-option', option); + cy.contains(".mat-mdc-autocomplete-panel mat-option", option); return this; } shouldHaveLabel (label: string) { - cy.contains('.mat-mdc-autocomplete-panel .mat-mdc-optgroup-label', label); + cy.contains(".mat-mdc-autocomplete-panel .mat-mdc-optgroup-label", label); return this; } selectOption (option: string) { - cy.contains('.mat-mdc-autocomplete-panel mat-option', option) + cy.contains(".mat-mdc-autocomplete-panel mat-option", option) .click(); } @@ -42,6 +42,6 @@ export default class AngularSearchBox extends PageObjectMapperBase { validatePage (): void { this.getPage() - .should('exist'); + .should("exist"); } } diff --git a/frontend/cypress/support/helper/dom-helper/dialogs/checkInDialog.ts b/frontend/cypress/support/helper/dom-helper/dialogs/checkInDialog.ts index 4aec8b5a1c..40d7a3638a 100644 --- a/frontend/cypress/support/helper/dom-helper/dialogs/checkInDialog.ts +++ b/frontend/cypress/support/helper/dom-helper/dialogs/checkInDialog.ts @@ -1,33 +1,33 @@ -import Dialog from './dialog'; +import Dialog from "./dialog"; import Chainable = Cypress.Chainable; export default class CheckInDialog extends Dialog { fillCheckInCommentary (commentary: string) { - this.fillInputByTestId('changeInfo', commentary); + this.fillInputByTestId("changeInfo", commentary); return this; } fillMetricCheckInValue (value: string) { - this.fillInputByTestId('check-in-metric-value', value); + this.fillInputByTestId("check-in-metric-value", value); return this; } - selectOrdinalCheckInZone (zone: 'fail' | 'commit' | 'target' | 'stretch') { + selectOrdinalCheckInZone (zone: "fail" | "commit" | "target" | "stretch") { switch (zone) { - case 'fail': - cy.getByTestId('fail-radio') + case "fail": + cy.getByTestId("fail-radio") .click(); break; - case 'commit': - cy.getByTestId('commit-radio') + case "commit": + cy.getByTestId("commit-radio") .click(); break; - case 'target': - cy.getByTestId('target-radio') + case "target": + cy.getByTestId("target-radio") .click(); break; - case 'stretch': - cy.getByTestId('stretch-radio') + case "stretch": + cy.getByTestId("stretch-radio") .click(); break; } @@ -35,56 +35,56 @@ export default class CheckInDialog extends Dialog { } fillCheckInInitiatives (value: string) { - this.fillInputByTestId('initiatives', value); + this.fillInputByTestId("initiatives", value); return this; } setCheckInConfidence (confidence: number) { - cy.getByTestId('confidence-slider') - .find('input') + cy.getByTestId("confidence-slider") + .find("input") .focus(); for (let i = 0; i < 10; i++) { - cy.realPress('ArrowLeft'); + cy.realPress("ArrowLeft"); } for (let i = 0; i < confidence; i++) { - cy.realPress('ArrowRight'); + cy.realPress("ArrowRight"); } return this; } checkForDialogTextMetric () { - cy.contains('Very important keyresult'); - cy.contains('Check-in erfassen'); - cy.contains('Key Result'); - cy.contains('Neuer Wert'); - cy.contains('Confidence um Target Zone (42%) zu erreichen'); - cy.contains('Abbrechen'); + cy.contains("Very important keyresult"); + cy.contains("Check-in erfassen"); + cy.contains("Key Result"); + cy.contains("Neuer Wert"); + cy.contains("Confidence um Target Zone (42%) zu erreichen"); + cy.contains("Abbrechen"); return this; } checkForDialogTextOrdinal () { - cy.contains('A new ordinal keyresult for our company'); - cy.contains('Check-in erfassen'); - cy.contains('Key Result'); - cy.contains('Fail:'); - cy.contains('Commit / Target / Stretch noch nicht erreicht'); - cy.contains('Commit:'); - cy.contains('Target:'); - cy.contains('Stretch:'); - cy.contains('New car'); - cy.contains('New house'); - cy.contains('New pool'); - cy.contains('Confidence um Target Zone zu erreichen'); - cy.contains('Abbrechen'); + cy.contains("A new ordinal keyresult for our company"); + cy.contains("Check-in erfassen"); + cy.contains("Key Result"); + cy.contains("Fail:"); + cy.contains("Commit / Target / Stretch noch nicht erreicht"); + cy.contains("Commit:"); + cy.contains("Target:"); + cy.contains("Stretch:"); + cy.contains("New car"); + cy.contains("New house"); + cy.contains("New pool"); + cy.contains("Confidence um Target Zone zu erreichen"); + cy.contains("Abbrechen"); return this; } override submit () { - cy.getByTestId('submit-check-in') + cy.getByTestId("submit-check-in") .click(); } getPage (): Chainable { - return cy.get('app-check-in-form'); + return cy.get("app-check-in-form"); } } diff --git a/frontend/cypress/support/helper/dom-helper/dialogs/checkInHistoryDialog.ts b/frontend/cypress/support/helper/dom-helper/dialogs/checkInHistoryDialog.ts index f97cc858aa..906d1898d6 100644 --- a/frontend/cypress/support/helper/dom-helper/dialogs/checkInHistoryDialog.ts +++ b/frontend/cypress/support/helper/dom-helper/dialogs/checkInHistoryDialog.ts @@ -1,33 +1,33 @@ -import Dialog from './dialog'; -import CheckInDialog from './checkInDialog'; +import Dialog from "./dialog"; +import CheckInDialog from "./checkInDialog"; import Chainable = Cypress.Chainable; export default class CheckInHistoryDialog extends Dialog { override submit () { - throw new Error('This dialog doesnt have a submit button'); + throw new Error("This dialog doesnt have a submit button"); } override cancel () { - cy.getByTestId('closeButton') + cy.getByTestId("closeButton") .click(); } editLatestCheckIn () { - cy.getByTestId('edit-check-in') + cy.getByTestId("edit-check-in") .first() .click(); return new CheckInDialog(); } getPage (): Chainable { - return cy.get('app-check-in-history-dialog'); + return cy.get("app-check-in-history-dialog"); } checkForAttribute (title: string, value: string) { - cy.get('mat-dialog-container') + cy.get("mat-dialog-container") .contains(value) .parent() - .should('contain', title); + .should("contain", title); return this; } } diff --git a/frontend/cypress/support/helper/dom-helper/dialogs/confirmDialog.ts b/frontend/cypress/support/helper/dom-helper/dialogs/confirmDialog.ts index 7c6eb3d945..9217510f5e 100644 --- a/frontend/cypress/support/helper/dom-helper/dialogs/confirmDialog.ts +++ b/frontend/cypress/support/helper/dom-helper/dialogs/confirmDialog.ts @@ -1,32 +1,32 @@ -import Dialog from './dialog'; +import Dialog from "./dialog"; import Chainable = Cypress.Chainable; export default class ConfirmDialog extends Dialog { checkTitle (title: string) { this.getPage() .contains(title) - .should('exist'); + .should("exist"); return this; } checkDescription (title: string) { this.getPage() .contains(title) - .should('exist'); + .should("exist"); return this; } override submit () { - cy.getByTestId('confirm-yes') + cy.getByTestId("confirm-yes") .click(); } override cancel () { - cy.getByTestId('confirm-no') + cy.getByTestId("confirm-no") .click(); } getPage (): Chainable { - return cy.get('app-confirm-dialog'); + return cy.get("app-confirm-dialog"); } } diff --git a/frontend/cypress/support/helper/dom-helper/dialogs/dialog.ts b/frontend/cypress/support/helper/dom-helper/dialogs/dialog.ts index 44cbe75cd6..a0b9185cae 100644 --- a/frontend/cypress/support/helper/dom-helper/dialogs/dialog.ts +++ b/frontend/cypress/support/helper/dom-helper/dialogs/dialog.ts @@ -1,4 +1,4 @@ -import { PageObjectMapperBase } from '../pageObjectMapperBase'; +import { PageObjectMapperBase } from "../pageObjectMapperBase"; import Chainable = Cypress.Chainable; export default abstract class Dialog extends PageObjectMapperBase { @@ -9,21 +9,21 @@ export default abstract class Dialog extends PageObjectMapperBase { override validatePage () { this.getPage() - .should('exist'); + .should("exist"); } submit () { - cy.getByTestId('save') + cy.getByTestId("save") .click(); } cancel () { - cy.getByTestId('cancel') + cy.getByTestId("cancel") .click(); } close () { - cy.getByTestId('close-dialog') + cy.getByTestId("close-dialog") .click(); } diff --git a/frontend/cypress/support/helper/dom-helper/dialogs/inviteMembersDialog.ts b/frontend/cypress/support/helper/dom-helper/dialogs/inviteMembersDialog.ts index 929e614bc9..9c4bc78182 100644 --- a/frontend/cypress/support/helper/dom-helper/dialogs/inviteMembersDialog.ts +++ b/frontend/cypress/support/helper/dom-helper/dialogs/inviteMembersDialog.ts @@ -1,5 +1,5 @@ -import Dialog from './dialog'; -import { uniqueSuffix } from '../../utils'; +import Dialog from "./dialog"; +import { uniqueSuffix } from "../../utils"; import Chainable = Cypress.Chainable; export default class InviteMembersDialog extends Dialog { @@ -8,19 +8,19 @@ export default class InviteMembersDialog extends Dialog { override validatePage () { super.validatePage(); this.getPage() - .contains('Members registrieren') - .should('exist'); + .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"]') + const firstNameInput = cy.get("[formcontrolname=\"firstname\"]") .last(); - const lastNameInput = cy.get('[formcontrolname="lastname"]') + const lastNameInput = cy.get("[formcontrolname=\"lastname\"]") .last(); - const emailInput = cy.get('[formcontrolname="email"]') + const emailInput = cy.get("[formcontrolname=\"email\"]") .last(); this.fillInput(firstNameInput, firstName); this.fillInput(lastNameInput, lastName); @@ -29,7 +29,7 @@ export default class InviteMembersDialog extends Dialog { } addAnotherUser () { - cy.contains('Weiterer Member hinzufügen') + cy.contains("Weiterer Member hinzufügen") .click(); return this; } @@ -39,12 +39,12 @@ export default class InviteMembersDialog extends Dialog { } override submit () { - cy.getByTestId('invite') + cy.getByTestId("invite") .click(); return this.firstnames; } getPage (): Chainable { - return cy.get('app-invite-user-dialog'); + return cy.get("app-invite-user-dialog"); } } diff --git a/frontend/cypress/support/helper/dom-helper/dialogs/keyResultDialog.ts b/frontend/cypress/support/helper/dom-helper/dialogs/keyResultDialog.ts index 7f6da4a841..7dcda24452 100644 --- a/frontend/cypress/support/helper/dom-helper/dialogs/keyResultDialog.ts +++ b/frontend/cypress/support/helper/dom-helper/dialogs/keyResultDialog.ts @@ -1,51 +1,51 @@ -import Dialog from './dialog'; -import { Unit } from '../../../../../src/app/shared/types/enums/Unit'; -import ConfirmDialog from './confirmDialog'; +import Dialog from "./dialog"; +import { Unit } from "../../../../../src/app/shared/types/enums/Unit"; +import ConfirmDialog from "./confirmDialog"; import Chainable = Cypress.Chainable; export default class KeyResultDialog extends Dialog { fillKeyResultTitle (title: string) { - this.fillInputByTestId('titleInput', title); + this.fillInputByTestId("titleInput", title); return this; } fillKeyResultDescription (description: string) { - this.fillInputByTestId('descriptionInput', description); + this.fillInputByTestId("descriptionInput", description); return this; } withMetricValues (unit: Unit, baseline: string, stretchGoal: string) { - cy.getByTestId('metricTab') + cy.getByTestId("metricTab") .click(); - cy.getByTestId('unit') + cy.getByTestId("unit") .select(unit); - this.fillInputByTestId('baseline', baseline); - this.fillInputByTestId('stretchGoal', stretchGoal); + this.fillInputByTestId("baseline", baseline); + this.fillInputByTestId("stretchGoal", stretchGoal); return this; } withOrdinalValues (commitZone: string, targetZone: string, stretchGoal: string) { - cy.getByTestId('ordinalTab') + cy.getByTestId("ordinalTab") .click(); - this.fillInputByTestId('commitZone', commitZone); - this.fillInputByTestId('targetZone', targetZone); - this.fillInputByTestId('stretchZone', stretchGoal); + this.fillInputByTestId("commitZone", commitZone); + this.fillInputByTestId("targetZone", targetZone); + this.fillInputByTestId("stretchZone", stretchGoal); return this; } fillOwner (owner: string) { - this.fillInputByTestId('ownerInput', owner); - cy.realPress('ArrowDown') - .realPress('Enter'); + this.fillInputByTestId("ownerInput", owner); + cy.realPress("ArrowDown") + .realPress("Enter"); return this; } addActionPlanElement (action: string) { - cy.getByTestId('add-action-plan-line') + cy.getByTestId("add-action-plan-line") .click(); - cy.getByTestId('actionInput') + cy.getByTestId("actionInput") .filter((k, el) => { - return (el as HTMLInputElement).value.trim() === ''; + return (el as HTMLInputElement).value.trim() === ""; }) .first() .type(action); @@ -53,52 +53,52 @@ export default class KeyResultDialog extends Dialog { } deleteKeyResult () { - cy.getByTestId('delete-keyResult') + cy.getByTestId("delete-keyResult") .click(); return new ConfirmDialog(); } checkForDialogTextMetric () { - cy.contains('Einheit'); - cy.contains('Baseline'); - cy.contains('Stretch Goal'); + cy.contains("Einheit"); + cy.contains("Baseline"); + cy.contains("Stretch Goal"); this.checkForDialogText(); return this; } checkForDialogTextOrdinal () { - cy.contains('Commit Zone'); - cy.contains('Target Zone'); - cy.contains('Stretch Goal'); + cy.contains("Commit Zone"); + cy.contains("Target Zone"); + cy.contains("Stretch Goal"); this.checkForDialogText(); return this; } private checkForDialogText () { - cy.contains('Key Result erfassen'); - cy.contains('Titel'); - cy.contains('Metrisch'); - cy.contains('Ordinal'); - cy.contains('Owner'); - cy.contains('Beschreibung (optional)'); - cy.contains('Action Plan (optional)'); - cy.contains('Weitere Action hinzufügen'); - cy.contains('Speichern'); - cy.contains('Speichern & Neu'); - cy.contains('Abbrechen'); + cy.contains("Key Result erfassen"); + cy.contains("Titel"); + cy.contains("Metrisch"); + cy.contains("Ordinal"); + cy.contains("Owner"); + cy.contains("Beschreibung (optional)"); + cy.contains("Action Plan (optional)"); + cy.contains("Weitere Action hinzufügen"); + cy.contains("Speichern"); + cy.contains("Speichern & Neu"); + cy.contains("Abbrechen"); } override submit () { - cy.getByTestId('submit') + cy.getByTestId("submit") .click(); } saveAndNew () { - cy.getByTestId('saveAndNew') + cy.getByTestId("saveAndNew") .click(); } getPage (): Chainable { - return cy.get('app-key-result-form'); + return cy.get("app-key-result-form"); } } diff --git a/frontend/cypress/support/helper/dom-helper/dialogs/objectiveDialog.ts b/frontend/cypress/support/helper/dom-helper/dialogs/objectiveDialog.ts index 5a7accd349..ca63916076 100644 --- a/frontend/cypress/support/helper/dom-helper/dialogs/objectiveDialog.ts +++ b/frontend/cypress/support/helper/dom-helper/dialogs/objectiveDialog.ts @@ -1,45 +1,45 @@ -import Dialog from './dialog'; -import ConfirmDialog from './confirmDialog'; +import Dialog from "./dialog"; +import ConfirmDialog from "./confirmDialog"; import Chainable = Cypress.Chainable; export default class ObjectiveDialog extends Dialog { fillObjectiveTitle (title: string) { - this.fillInputByTestId('title', title); + this.fillInputByTestId("title", title); return this; } fillObjectiveDescription (description: string) { - this.fillInputByTestId('description', description); + this.fillInputByTestId("description", description); return this; } selectQuarter (quarter: string) { - cy.get('select#quarter') + cy.get("select#quarter") .select(quarter); return this; } toggleCreateKeyResults () { - cy.getByTestId('keyResult-checkbox') + cy.getByTestId("keyResult-checkbox") .find("[type='checkbox']") .check(); return this; } deleteObjective () { - cy.getByTestId('delete') + cy.getByTestId("delete") .click(); return new ConfirmDialog(); } submitDraftObjective () { - cy.getByTestId('save-draft') + cy.getByTestId("save-draft") .click(); } excludeKeyResults (keyResults: string[]) { keyResults.forEach((keyResult) => { - cy.get('label') + cy.get("label") .contains(keyResult.slice(0, 30)) .click(); }); @@ -47,7 +47,7 @@ export default class ObjectiveDialog extends Dialog { } getPage (): Chainable { - return cy.get('app-objective-form') - .should('exist'); + return cy.get("app-objective-form") + .should("exist"); } } diff --git a/frontend/cypress/support/helper/dom-helper/dialogs/teamDialog.ts b/frontend/cypress/support/helper/dom-helper/dialogs/teamDialog.ts index b48d4c0e9b..8bf5a9796b 100644 --- a/frontend/cypress/support/helper/dom-helper/dialogs/teamDialog.ts +++ b/frontend/cypress/support/helper/dom-helper/dialogs/teamDialog.ts @@ -1,24 +1,24 @@ -import Dialog from './dialog'; +import Dialog from "./dialog"; import Chainable = Cypress.Chainable; export default class TeamDialog extends Dialog { override validatePage () { super.validatePage(); this.getPage() - .contains('Team erfassen'); + .contains("Team erfassen"); } fillName (name: string) { - this.fillInputByTestId('add-team-name', name); + this.fillInputByTestId("add-team-name", name); return this; } override submit () { - cy.getByTestId('save') + cy.getByTestId("save") .click(); } getPage (): Chainable { - return cy.get('app-add-edit-team-dialog'); + return cy.get("app-add-edit-team-dialog"); } } diff --git a/frontend/cypress/support/helper/dom-helper/filterHelper.ts b/frontend/cypress/support/helper/dom-helper/filterHelper.ts index 229b43d626..190f911293 100644 --- a/frontend/cypress/support/helper/dom-helper/filterHelper.ts +++ b/frontend/cypress/support/helper/dom-helper/filterHelper.ts @@ -1,27 +1,27 @@ -import { PageObjectMapperBase } from './pageObjectMapperBase'; +import { PageObjectMapperBase } from "./pageObjectMapperBase"; export default class FilterHelper extends PageObjectMapperBase { validatePage (): void {} optionShouldBeSelected (text: string, onOverview = true): this { if (onOverview) { - cy.contains('h1:visible', text) - .should('have.length', 1); + cy.contains("h1:visible", text) + .should("have.length", 1); } this.getOption(text) - .should('have.length', 1) - .should('have.css', 'background-color') - .and('eq', 'rgb(30, 90, 150)'); + .should("have.length", 1) + .should("have.css", "background-color") + .and("eq", "rgb(30, 90, 150)"); return this; } optionShouldNotBeSelected (text: string): this { - cy.contains('h1:visible', text) - .should('not.exist'); + cy.contains("h1:visible", text) + .should("not.exist"); this.getOption(text) - .should('have.length', 1) - .should('have.css', 'background-color') - .and('eq', 'rgb(255, 255, 255)'); + .should("have.length", 1) + .should("have.css", "background-color") + .and("eq", "rgb(255, 255, 255)"); return this; } @@ -32,6 +32,6 @@ export default class FilterHelper extends PageObjectMapperBase { } private getOption (text: string): Cypress.Chainable> { - return cy.contains('mat-chip:visible', text); + return cy.contains("mat-chip:visible", text); } } diff --git a/frontend/cypress/support/helper/dom-helper/pageObjectMapperBase.ts b/frontend/cypress/support/helper/dom-helper/pageObjectMapperBase.ts index 38464e51c2..5508ceec9b 100644 --- a/frontend/cypress/support/helper/dom-helper/pageObjectMapperBase.ts +++ b/frontend/cypress/support/helper/dom-helper/pageObjectMapperBase.ts @@ -9,11 +9,11 @@ export abstract class PageObjectMapperBase { return this; } - checkForToaster (content: any, type: 'success' | 'error') { - cy.get('#toast-container') + checkForToaster (content: any, type: "success" | "error") { + cy.get("#toast-container") .find(`.toast-${type}`) .contains(content) - .should('exist'); + .should("exist"); return this; } @@ -22,7 +22,7 @@ export abstract class PageObjectMapperBase { .then((url) => { const params = new URL(url).searchParams; const queryParamValues = params.get(key) - ?.split(','); + ?.split(","); expect(queryParamValues).to.have.length(value.length); value.forEach((v) => expect(queryParamValues).to.include(v)); }); diff --git a/frontend/cypress/support/helper/dom-helper/pages/keyResultDetailPage.ts b/frontend/cypress/support/helper/dom-helper/pages/keyResultDetailPage.ts index 9ddea57a8c..d739b48116 100644 --- a/frontend/cypress/support/helper/dom-helper/pages/keyResultDetailPage.ts +++ b/frontend/cypress/support/helper/dom-helper/pages/keyResultDetailPage.ts @@ -1,23 +1,23 @@ -import { Page } from './page'; -import CyOverviewPage from './overviewPage'; -import CheckInDialog from '../dialogs/checkInDialog'; -import KeyResultDialog from '../dialogs/keyResultDialog'; -import CheckInHistoryDialog from '../dialogs/checkInHistoryDialog'; +import { Page } from "./page"; +import CyOverviewPage from "./overviewPage"; +import CheckInDialog from "../dialogs/checkInDialog"; +import KeyResultDialog from "../dialogs/keyResultDialog"; +import CheckInHistoryDialog from "../dialogs/checkInHistoryDialog"; export default class KeyResultDetailPage extends Page { elements = { - logo: () => cy.getByTestId('logo'), - closeDrawer: () => cy.getByTestId('close-drawer'), - addCheckin: () => cy.getByTestId('add-check-in'), - showAllCheckins: () => cy.getByTestId('show-all-checkins'), - editKeyResult: () => cy.getByTestId('edit-keyResult') + "logo": () => cy.getByTestId("logo"), + "closeDrawer": () => cy.getByTestId("close-drawer"), + "addCheckin": () => cy.getByTestId("add-check-in"), + "showAllCheckins": () => cy.getByTestId("show-all-checkins"), + "editKeyResult": () => cy.getByTestId("edit-keyResult") }; override validatePage () { this.elements.addCheckin() - .contains('Check-in erfassen'); + .contains("Check-in erfassen"); this.elements.editKeyResult() - .contains('Key Result bearbeiten'); + .contains("Key Result bearbeiten"); } override visit (keyResultName: string): this { @@ -52,7 +52,7 @@ export default class KeyResultDetailPage extends Page { close (): void { this.elements.closeDrawer() - .click({ force: true }); + .click({ "force": true }); } visitOverview (): void { @@ -61,6 +61,6 @@ export default class KeyResultDetailPage extends Page { } getURL (): string { - return '/details/keyresult'; + return "/details/keyresult"; } } diff --git a/frontend/cypress/support/helper/dom-helper/pages/overviewPage.ts b/frontend/cypress/support/helper/dom-helper/pages/overviewPage.ts index 9a256ba7cc..4727ad3f0c 100644 --- a/frontend/cypress/support/helper/dom-helper/pages/overviewPage.ts +++ b/frontend/cypress/support/helper/dom-helper/pages/overviewPage.ts @@ -1,13 +1,13 @@ -import { filterByObjectiveName, filterByObjectiveState, getObjectiveColumns } from '../../objectiveHelper'; -import ObjectiveDialog from '../dialogs/objectiveDialog'; -import { Page } from './page'; -import KeyResultDialog from '../dialogs/keyResultDialog'; -import { filterByKeyResultName, getKeyResults } from '../../keyResultHelper'; +import { filterByObjectiveName, filterByObjectiveState, getObjectiveColumns } from "../../objectiveHelper"; +import ObjectiveDialog from "../dialogs/objectiveDialog"; +import { Page } from "./page"; +import KeyResultDialog from "../dialogs/keyResultDialog"; +import { filterByKeyResultName, getKeyResults } from "../../keyResultHelper"; export default class CyOverviewPage extends Page { elements = { - logo: () => cy.getByTestId('logo'), - teammanagement: () => cy.getByTestId('team-management') + "logo": () => cy.getByTestId("logo"), + "teammanagement": () => cy.getByTestId("team-management") }; visitGJForTests () { @@ -33,12 +33,12 @@ export default class CyOverviewPage extends Page { addObjective (teamName?: string) { if (teamName) { this.getTeamByName(teamName) - .find('.add-objective') + .find(".add-objective") .first() .click(); return new ObjectiveDialog(); } - cy.getByTestId('add-objective') + cy.getByTestId("add-objective") .first() .click(); return new ObjectiveDialog(); @@ -47,21 +47,21 @@ export default class CyOverviewPage extends Page { addKeyResult (teamName?: string, objectiveName?: string) { if (teamName && objectiveName) { this.getObjectiveByTeamAndName(teamName, objectiveName) - .findByTestId('add-keyResult') + .findByTestId("add-keyResult") .first() .click(); } else if (teamName) { this.getTeamByName(teamName) - .findByTestId('add-keyResult') + .findByTestId("add-keyResult") .first() .click(); } else if (objectiveName) { this.getObjectiveByName(objectiveName) - .findByTestId('add-keyResult') + .findByTestId("add-keyResult") .first() .click(); } else { - cy.getByTestId('add-keyResult') + cy.getByTestId("add-keyResult") .first() .click(); } @@ -70,8 +70,8 @@ export default class CyOverviewPage extends Page { } addOngoingKeyResult () { - this.getObjectiveByState('ongoing') - .findByTestId('add-keyResult') + this.getObjectiveByState("ongoing") + .findByTestId("add-keyResult") .first() .click(); @@ -79,22 +79,22 @@ export default class CyOverviewPage extends Page { } getTeamByName (teamName: string) { - return cy.contains('.team-title', teamName) - .parentsUntil('#overview') + return cy.contains(".team-title", teamName) + .parentsUntil("#overview") .last(); } getFirstObjective () { - return cy.get('.objective') + return cy.get(".objective") .first(); } getObjectiveByNameAndState (objectiveName: string, state: string) { this.getObjectivesByNameAndState(objectiveName, state) .last() - .as('objective') + .as("objective") .scrollIntoView(); - return cy.get('@objective'); + return cy.get("@objective"); } getObjectivesByNameAndState (objectiveName: string, state: string) { @@ -106,20 +106,20 @@ export default class CyOverviewPage extends Page { getObjectiveByName (objectiveName: string) { this.getObjectivesByName(objectiveName) .last() - .as('objective') + .as("objective") .scrollIntoView(); - return cy.get('@objective'); + return cy.get("@objective"); } getObjectiveByTeamAndName (teamName: string, objectiveName: string) { this.getTeamByName(teamName) - .find('.objective') + .find(".objective") .filter(filterByObjectiveName(objectiveName)) .last() - .as('team') + .as("team") .scrollIntoView(); - return cy.get('@team'); + return cy.get("@team"); } getKeyResultOfObjective (objectiveName: string, keyResultName: string) { @@ -129,7 +129,7 @@ export default class CyOverviewPage extends Page { getAllKeyResultsOfObjective (objectiveName: string) { return this.getObjectiveByName(objectiveName) - .find('.key-result'); + .find(".key-result"); } getObjectivesByName (objectiveName: string) { @@ -140,9 +140,9 @@ export default class CyOverviewPage extends Page { getObjectiveByState (state: string) { this.getObjectivesByState(state) .first() - .as('objective') + .as("objective") .scrollIntoView(); - return cy.get('@objective'); + return cy.get("@objective"); } getObjectivesByState (state: string) { @@ -153,9 +153,9 @@ export default class CyOverviewPage extends Page { getKeyResultByName (keyResultName: string) { this.getKeyResultsByName(keyResultName) .last() - .as('keyResult') + .as("keyResult") .scrollIntoView(); - return cy.get('@keyResult'); + return cy.get("@keyResult"); } getKeyResultsByName (keyresultName: string) { @@ -165,25 +165,25 @@ export default class CyOverviewPage extends Page { selectFromThreeDotMenu (optionName: string) { cy.contains(optionName) - .should('exist'); - cy.get('.objective-three-dot-menu') + .should("exist"); + cy.get(".objective-three-dot-menu") .contains(optionName) - .as('option') + .as("option") .scrollIntoView(); - cy.get('@option') - .should('have.class', 'objective-menu-option') + cy.get("@option") + .should("have.class", "objective-menu-option") .click(); } duplicateObjective (objectiveName: string) { - cy.intercept('GET', '**/objectives/*/keyResults') - .as('keyResults'); + cy.intercept("GET", "**/objectives/*/keyResults") + .as("keyResults"); this.getObjectiveByName(objectiveName) - .findByTestId('three-dot-menu') + .findByTestId("three-dot-menu") .click(); - this.selectFromThreeDotMenu('Objective duplizieren'); - cy.wait('@keyResults'); + this.selectFromThreeDotMenu("Objective duplizieren"); + cy.wait("@keyResults"); return new ObjectiveDialog(); } @@ -193,7 +193,7 @@ export default class CyOverviewPage extends Page { } getURL (): string { - return ''; + return ""; } validatePage (): void {} diff --git a/frontend/cypress/support/helper/dom-helper/pages/page.ts b/frontend/cypress/support/helper/dom-helper/pages/page.ts index 12db5e8c7c..da46b1a2f0 100644 --- a/frontend/cypress/support/helper/dom-helper/pages/page.ts +++ b/frontend/cypress/support/helper/dom-helper/pages/page.ts @@ -1,4 +1,4 @@ -import { PageObjectMapperBase } from '../pageObjectMapperBase'; +import { PageObjectMapperBase } from "../pageObjectMapperBase"; export abstract class Page extends PageObjectMapperBase { visit (arg?: any): this { @@ -15,7 +15,7 @@ export abstract class Page extends PageObjectMapperBase { afterVisit (): this { cy.url() - .should('include', this.getURL()); + .should("include", this.getURL()); this.validatePage(); return this; } diff --git a/frontend/cypress/support/helper/dom-helper/pages/teammanagementPage.ts b/frontend/cypress/support/helper/dom-helper/pages/teammanagementPage.ts index a150e13007..25892d9f5e 100644 --- a/frontend/cypress/support/helper/dom-helper/pages/teammanagementPage.ts +++ b/frontend/cypress/support/helper/dom-helper/pages/teammanagementPage.ts @@ -1,35 +1,35 @@ -import { Page } from './page'; -import TeamDialog from '../dialogs/teamDialog'; -import AngularSearchBox from '../angularSearchBox'; -import ConfirmDialog from '../dialogs/confirmDialog'; +import { Page } from "./page"; +import TeamDialog from "../dialogs/teamDialog"; +import AngularSearchBox from "../angularSearchBox"; +import ConfirmDialog from "../dialogs/confirmDialog"; export default class TeammanagementPage extends Page { elements = { - logo: () => cy.getByTestId('logo'), - teammanagement: () => cy.getByTestId('team-management'), - backToOverview: () => cy.getByTestId('routerLink-to-overview'), - teamMenu: () => cy.get('app-team-list'), - memberHeader: () => cy.get('#member-header'), - registerMember: () => cy.getByTestId('invite-member'), - addTeam: () => cy.getByTestId('add-team'), - teamSearch: () => AngularSearchBox.from('app-team-management-banner [data-testId="teamManagementSearch"]') + "logo": () => cy.getByTestId("logo"), + "teammanagement": () => cy.getByTestId("team-management"), + "backToOverview": () => cy.getByTestId("routerLink-to-overview"), + "teamMenu": () => cy.get("app-team-list"), + "memberHeader": () => cy.get("#member-header"), + "registerMember": () => cy.getByTestId("invite-member"), + "addTeam": () => cy.getByTestId("add-team"), + "teamSearch": () => AngularSearchBox.from("app-team-management-banner [data-testId=\"teamManagementSearch\"]") }; override validatePage () { this.elements.teammanagement() - .contains('Teamverwaltung'); + .contains("Teamverwaltung"); this.elements.backToOverview() - .contains('Zurück zur OKR Übersicht'); + .contains("Zurück zur OKR Übersicht"); this.elements.addTeam() - .contains('Team erfassen'); + .contains("Team erfassen"); this.elements.teamMenu() - .contains('Alle Teams'); + .contains("Alle Teams"); this.elements.memberHeader() - .contains('Alle Teams'); + .contains("Alle Teams"); this.elements.memberHeader() - .contains('Members:'); + .contains("Members:"); this.elements.registerMember() - .contains('Member registrieren'); + .contains("Member registrieren"); } protected doVisit (): this { @@ -55,20 +55,20 @@ export default class TeammanagementPage extends Page { } deleteTeam (teamName: string) { - cy.get('app-team-list .mat-mdc-list-item') + cy.get("app-team-list .mat-mdc-list-item") .contains(teamName) .click(); - cy.getByTestId('teamMoreButton') + cy.getByTestId("teamMoreButton") .click(); - cy.getByTestId('teamDeleteButton') + cy.getByTestId("teamDeleteButton") .click(); return ConfirmDialog.do() - .checkTitle('Team löschen') + .checkTitle("Team löschen") .checkDescription(`Möchtest du das Team '${teamName}' wirklich löschen? Zugehörige Objectives werden dadurch in allen Quartalen ebenfalls gelöscht!`); } getURL (): string { - return 'team-management'; + return "team-management"; } } diff --git a/frontend/cypress/support/helper/keyResultHelper.ts b/frontend/cypress/support/helper/keyResultHelper.ts index f6107a3757..aaa000a010 100644 --- a/frontend/cypress/support/helper/keyResultHelper.ts +++ b/frontend/cypress/support/helper/keyResultHelper.ts @@ -8,5 +8,5 @@ const isKeyResultName = (element: HTMLElement, keyResultName: string) => { }; export function getKeyResults () { - return cy.get('.key-result'); + return cy.get(".key-result"); } diff --git a/frontend/cypress/support/helper/objectiveHelper.ts b/frontend/cypress/support/helper/objectiveHelper.ts index f28627c2f3..955b59d5c3 100644 --- a/frontend/cypress/support/helper/objectiveHelper.ts +++ b/frontend/cypress/support/helper/objectiveHelper.ts @@ -17,5 +17,5 @@ const isObjectiveName = (element: HTMLElement, objectiveName: string) => { }; export function getObjectiveColumns () { - return cy.get('.objective'); + return cy.get(".objective"); } diff --git a/frontend/cypress/support/helper/scoringSupport.ts b/frontend/cypress/support/helper/scoringSupport.ts index cccb630f53..caedf205b1 100644 --- a/frontend/cypress/support/helper/scoringSupport.ts +++ b/frontend/cypress/support/helper/scoringSupport.ts @@ -1,9 +1,9 @@ -import { isLastCheckInNegative } from '../../../src/app/shared/common'; +import { isLastCheckInNegative } from "../../../src/app/shared/common"; interface ScoringValue { - failPercent: number; - commitPercent: number; - targetPercent: number; + "failPercent": number; + "commitPercent": number; + "targetPercent": number; } export function validateScoring (isOverview: boolean, percentage: number) { @@ -11,96 +11,96 @@ export function validateScoring (isOverview: boolean, percentage: number) { const scoringValue = scoringValueFromPercentage(percentage); if (percentage >= 100) { - cy.getZone('stretch', isOverview) - .should('have.attr', 'src') - .should('include', 'star-filled-icon.svg'); + cy.getZone("stretch", isOverview) + .should("have.attr", "src") + .should("include", "star-filled-icon.svg"); } - validateScoringWidth('fail', scoringValue.failPercent, isOverview); - validateScoringWidth('commit', scoringValue.commitPercent, isOverview); - validateScoringWidth('target', scoringValue.targetPercent, isOverview); + validateScoringWidth("fail", scoringValue.failPercent, isOverview); + validateScoringWidth("commit", scoringValue.commitPercent, isOverview); + validateScoringWidth("target", scoringValue.targetPercent, isOverview); if (percentage == 0) return; - validateScoringColor('fail', rgbCode, isOverview); - validateScoringColor('commit', rgbCode, isOverview); - validateScoringColor('target', rgbCode, isOverview); + validateScoringColor("fail", rgbCode, isOverview); + validateScoringColor("commit", rgbCode, isOverview); + validateScoringColor("target", rgbCode, isOverview); } export function getPercentageMetric (baseline: number, stretchGoal: number, value: number) { if (isLastCheckInNegative(baseline, stretchGoal, value)) { return -1; } - return (Math.abs(value - baseline) / Math.abs(stretchGoal - baseline)) * 100; + return Math.abs(value - baseline) / Math.abs(stretchGoal - baseline) * 100; } export function getPercentageOrdinal (zone: string) { - if (zone == 'stretch') return 101; - if (zone == 'target') return 99.99; - if (zone == 'commit') return 70; - if (zone == 'fail') return 30; + if (zone == "stretch") return 101; + if (zone == "target") return 99.99; + if (zone == "commit") return 70; + if (zone == "fail") return 30; return 0; } function validateScoringWidth (zone: string, percent: number, isOverview: boolean) { cy.getZone(zone, isOverview) .parent() - .invoke('width') + .invoke("width") .then((parentWidth) => { expect(parentWidth).not.to.be.undefined; cy.getZone(zone, isOverview) - .invoke('width') - .should('be.within', parentWidth! * (percent / 100) - 3, parentWidth! * (percent / 100) + 3); + .invoke("width") + .should("be.within", parentWidth! * (percent / 100) - 3, parentWidth! * (percent / 100) + 3); }); } function validateScoringColor (zone: string, rgbCode: string, isOverview: boolean) { cy.getZone(zone, isOverview) - .invoke('css', 'background-color') - .should('equal', rgbCode); - if (rgbCode == 'rgba(0, 0, 0, 0)') { - cy.getByTestId('star-scoring') - .invoke('css', 'background-image') - .should('contain', 'scoring-stars'); - checkVisibilityOfScoringComponent(isOverview, 'block', 'star-scoring'); - checkVisibilityOfScoringComponent(isOverview, 'none', 'normal-scoring'); + .invoke("css", "background-color") + .should("equal", rgbCode); + if (rgbCode == "rgba(0, 0, 0, 0)") { + cy.getByTestId("star-scoring") + .invoke("css", "background-image") + .should("contain", "scoring-stars"); + checkVisibilityOfScoringComponent(isOverview, "block", "star-scoring"); + checkVisibilityOfScoringComponent(isOverview, "none", "normal-scoring"); } else { - checkVisibilityOfScoringComponent(isOverview, 'none', 'star-scoring'); - checkVisibilityOfScoringComponent(isOverview, 'flex', 'normal-scoring'); + checkVisibilityOfScoringComponent(isOverview, "none", "star-scoring"); + checkVisibilityOfScoringComponent(isOverview, "flex", "normal-scoring"); } } function checkVisibilityOfScoringComponent (isOverview: boolean, displayProperty: string, componentTestId: string) { - (isOverview ? cy.focused() : cy.getByTestId('side-panel')) + (isOverview ? cy.focused() : cy.getByTestId("side-panel")) .findByTestId(componentTestId) - .invoke('css', 'display') - .should('equal', displayProperty); + .invoke("css", "display") + .should("equal", displayProperty); } function colorFromPercentage (percentage: number) { - if (percentage >= 100) return 'rgba(0, 0, 0, 0)'; - if (percentage > 70) return 'rgb(30, 138, 41)'; - if (percentage > 30) return 'rgb(255, 214, 0)'; - return 'rgb(186, 56, 56)'; + if (percentage >= 100) return "rgba(0, 0, 0, 0)"; + if (percentage > 70) return "rgb(30, 138, 41)"; + if (percentage > 30) return "rgb(255, 214, 0)"; + return "rgb(186, 56, 56)"; } function scoringValueFromPercentage (percentage: number): ScoringValue { if (percentage >= 100) { - return { failPercent: 0, - commitPercent: 0, - targetPercent: 0 }; + return { "failPercent": 0, + "commitPercent": 0, + "targetPercent": 0 }; } else if (percentage > 70) { const targetPercent = (percentage - 70) * (100 / 30); - return { failPercent: 100, - commitPercent: 100, - targetPercent: targetPercent }; + return { "failPercent": 100, + "commitPercent": 100, + "targetPercent": targetPercent }; } else if (percentage > 30) { const commitPercent = (percentage - 30) * (100 / 40); - return { failPercent: 100, - commitPercent: commitPercent, - targetPercent: -1 }; + return { "failPercent": 100, + "commitPercent": commitPercent, + "targetPercent": -1 }; } const failPercent = percentage * (100 / 30); - return { failPercent: failPercent, - commitPercent: -1, - targetPercent: -1 }; + return { "failPercent": failPercent, + "commitPercent": -1, + "targetPercent": -1 }; } diff --git a/frontend/cypress/support/helper/utils.ts b/frontend/cypress/support/helper/utils.ts index e89b1392cc..9f19de586f 100644 --- a/frontend/cypress/support/helper/utils.ts +++ b/frontend/cypress/support/helper/utils.ts @@ -1,5 +1,5 @@ -import { v4 as uuidv4 } from 'uuid'; -import { keyCodeDefinitions } from 'cypress-real-events/keyCodeDefinitions'; +import { v4 as uuidv4 } from "uuid"; +import { keyCodeDefinitions } from "cypress-real-events/keyCodeDefinitions"; export const uniqueSuffix = (value: string): string => { return `${value}-${uuidv4()}`; @@ -10,14 +10,10 @@ export function pressUntilContains (text: string, key: keyof typeof keyCodeDefin pressUntil(key, condition); } -export function doUntilSelector ( - selector: string, tab: () => void, limit = 100, count = 0 -) { +export function doUntilSelector (selector: string, tab: () => void, limit = 100, count = 0) { const condition = (element: HTMLElement) => Cypress.$(element) .is(selector); - doUntil( - condition, tab, limit, count - ); + doUntil(condition, tab, limit, count); } function pressUntil (key: keyof typeof keyCodeDefinitions, condition: (elem: HTMLElement) => boolean) { @@ -38,9 +34,7 @@ function doUntil ( return; } else { tab(); - doUntil( - condition, tab, limit, count + 1 - ); + doUntil(condition, tab, limit, count + 1); } }); } diff --git a/frontend/package.json b/frontend/package.json index 1c51c277a4..7ab69e436e 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -16,8 +16,8 @@ "cypress:open-test": "concurrently \"npm start\" \"cypress open\"", "cypress:run-test": "npm run build && concurrently \"npm run serve:dist\" \"cypress run\"", "e2e": "ng e2e", - "format": "npm run lint:format", - "check": "npm run lint", + "format:all": "npm run lint:format && npm run prettier:lint:format", + "check": "npm run lint && npm run prettier:lint", "lint:format:specific": "eslint --fix ", "lint:format": "eslint --fix .", "lint": "eslint .", diff --git a/frontend/setup-jest.ts b/frontend/setup-jest.ts index 90bc5062ea..a702c63396 100644 --- a/frontend/setup-jest.ts +++ b/frontend/setup-jest.ts @@ -1 +1 @@ -import 'jest-preset-angular/setup-jest' +import "jest-preset-angular/setup-jest"; diff --git a/frontend/src/app/app-routing.module.ts b/frontend/src/app/app-routing.module.ts index d73c397344..c51570b5f1 100644 --- a/frontend/src/app/app-routing.module.ts +++ b/frontend/src/app/app-routing.module.ts @@ -1,14 +1,14 @@ -import { inject, NgModule } from '@angular/core'; -import { ResolveFn, RouterModule, Routes } from '@angular/router'; -import { OverviewComponent } from './components/overview/overview.component'; -import { of } from 'rxjs'; -import { SidepanelComponent } from './shared/sidepanel/sidepanel.component'; -import { authGuard } from './guards/auth.guard'; -import { UserService } from './services/user.service'; -import { User } from './shared/types/model/User'; -import { OAuthService } from 'angular-oauth2-oidc'; -import { ObjectiveDetailComponent } from './components/objective-detail/objective-detail.component'; -import { KeyresultDetailComponent } from './components/keyresult-detail/keyresult-detail.component'; +import { inject, NgModule } from "@angular/core"; +import { ResolveFn, RouterModule, Routes } from "@angular/router"; +import { OverviewComponent } from "./components/overview/overview.component"; +import { of } from "rxjs"; +import { SidepanelComponent } from "./shared/sidepanel/sidepanel.component"; +import { authGuard } from "./guards/auth.guard"; +import { UserService } from "./services/user.service"; +import { User } from "./shared/types/model/User"; +import { OAuthService } from "angular-oauth2-oidc"; +import { ObjectiveDetailComponent } from "./components/objective-detail/objective-detail.component"; +import { KeyresultDetailComponent } from "./components/keyresult-detail/keyresult-detail.component"; const currentUserResolver: ResolveFn = () => { const oauthService = inject(OAuthService); @@ -21,42 +21,46 @@ const currentUserResolver: ResolveFn = () => { const routes: Routes = [ { - path: '', - component: OverviewComponent, - resolve: { - user: currentUserResolver + "path": "", + "component": OverviewComponent, + "resolve": { + "user": currentUserResolver }, - children: [{ - path: 'details', - component: SidepanelComponent, - children: [{ - path: 'objective/:id', - component: ObjectiveDetailComponent - }, + "children": [ { - path: 'keyresult/:id', - component: KeyresultDetailComponent - }] - }], - canActivate: [authGuard] + "path": "details", + "component": SidepanelComponent, + "children": [ + { + "path": "objective/:id", + "component": ObjectiveDetailComponent + }, + { + "path": "keyresult/:id", + "component": KeyresultDetailComponent + } + ] + } + ], + "canActivate": [authGuard] }, { - path: 'team-management', - loadChildren: () => import('./team-management/team-management.module').then((m) => m.TeamManagementModule), - canActivate: [authGuard], - resolve: { user: currentUserResolver } + "path": "team-management", + "loadChildren": () => import("./team-management/team-management.module").then((m) => m.TeamManagementModule), + "canActivate": [authGuard], + "resolve": { "user": currentUserResolver } }, - { path: 'objective', - redirectTo: 'details/objective' }, - { path: 'keyresult', - redirectTo: 'details/keyresult' }, - { path: '**', - redirectTo: '', - pathMatch: 'full' } + { "path": "objective", + "redirectTo": "details/objective" }, + { "path": "keyresult", + "redirectTo": "details/keyresult" }, + { "path": "**", + "redirectTo": "", + "pathMatch": "full" } ]; @NgModule({ - imports: [RouterModule.forRoot(routes)], - exports: [RouterModule] + "imports": [RouterModule.forRoot(routes)], + "exports": [RouterModule] }) export class AppRoutingModule {} diff --git a/frontend/src/app/app.component.spec.ts b/frontend/src/app/app.component.spec.ts index 0d10e92017..5439e265c1 100644 --- a/frontend/src/app/app.component.spec.ts +++ b/frontend/src/app/app.component.spec.ts @@ -1,21 +1,21 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { RouterTestingModule } from '@angular/router/testing'; -import { AppComponent } from './app.component'; -import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; -import { TranslateTestingModule } from 'ngx-translate-testing'; -import { AuthConfig, OAuthModule, OAuthService } from 'angular-oauth2-oidc'; -import { HttpClientTestingModule } from '@angular/common/http/testing'; +import { ComponentFixture, TestBed } from "@angular/core/testing"; +import { RouterTestingModule } from "@angular/router/testing"; +import { AppComponent } from "./app.component"; +import { CUSTOM_ELEMENTS_SCHEMA } from "@angular/core"; +import { TranslateTestingModule } from "ngx-translate-testing"; +import { AuthConfig, OAuthModule, OAuthService } from "angular-oauth2-oidc"; +import { HttpClientTestingModule } from "@angular/common/http/testing"; // @ts-ignore -import * as de from '../assets/i18n/de.json'; -import { HarnessLoader } from '@angular/cdk/testing'; -import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed'; -import { MatSidenavModule } from '@angular/material/sidenav'; -import { NoopAnimationsModule } from '@angular/platform-browser/animations'; -import { NavigationEnd, Routes } from '@angular/router'; -import { of } from 'rxjs'; -import { OverviewComponent } from './components/overview/overview.component'; -import { ObjectiveDetailComponent } from './components/objective-detail/objective-detail.component'; -import { CommonModule } from '@angular/common'; +import * as de from "../assets/i18n/de.json"; +import { HarnessLoader } from "@angular/cdk/testing"; +import { TestbedHarnessEnvironment } from "@angular/cdk/testing/testbed"; +import { MatSidenavModule } from "@angular/material/sidenav"; +import { NoopAnimationsModule } from "@angular/platform-browser/animations"; +import { NavigationEnd, Routes } from "@angular/router"; +import { of } from "rxjs"; +import { OverviewComponent } from "./components/overview/overview.component"; +import { ObjectiveDetailComponent } from "./components/objective-detail/objective-detail.component"; +import { CommonModule } from "@angular/common"; const oauthServiceMock = { configure (environment: AuthConfig): void {}, @@ -31,42 +31,50 @@ const oauthServiceMock = { }; const routerMock = { - root: jest.fn(), + "root": jest.fn(), // Router - events: of(new NavigationEnd(0, 'http://localhost:4200/objective/2', 'http://localhost:4200/objective/2')) + "events": of(new NavigationEnd(0, "http://localhost:4200/objective/2", "http://localhost:4200/objective/2")) }; -const routes: Routes = [{ - path: '', - component: OverviewComponent, - children: [{ path: 'objective/:id', - component: ObjectiveDetailComponent, - pathMatch: 'full' }] -}]; +const routes: Routes = [ + { + "path": "", + "component": OverviewComponent, + "children": [ + { "path": "objective/:id", + "component": ObjectiveDetailComponent, + "pathMatch": "full" } + ] + } +]; -describe('AppComponent', () => { +describe("AppComponent", () => { let component: AppComponent; let fixture: ComponentFixture; let loader: HarnessLoader; beforeEach(async () => { await TestBed.configureTestingModule({ - imports: [ + "imports": [ RouterTestingModule.withRoutes(routes), HttpClientTestingModule, TranslateTestingModule.withTranslations({ - de: de + "de": de }), OAuthModule.forRoot(), MatSidenavModule, NoopAnimationsModule, CommonModule ], - providers: [{ provide: OAuthService, - useValue: oauthServiceMock }], - declarations: [AppComponent, - OverviewComponent], - schemas: [CUSTOM_ELEMENTS_SCHEMA] + "providers": [ + { "provide": OAuthService, + "useValue": oauthServiceMock } + ], + "declarations": [ + AppComponent, + OverviewComponent + ], + "schemas": [CUSTOM_ELEMENTS_SCHEMA] }) .compileComponents() .then(() => { @@ -79,7 +87,7 @@ describe('AppComponent', () => { }); }); - test('should create the app', () => { + test("should create the app", () => { expect(component) .toBeTruthy(); }); diff --git a/frontend/src/app/app.component.ts b/frontend/src/app/app.component.ts index b389755dcb..bd592f6e99 100644 --- a/frontend/src/app/app.component.ts +++ b/frontend/src/app/app.component.ts @@ -1,21 +1,21 @@ -import { ChangeDetectionStrategy, Component } from '@angular/core'; -import { MatIconRegistry } from '@angular/material/icon'; -import { DomSanitizer } from '@angular/platform-browser'; +import { ChangeDetectionStrategy, Component } from "@angular/core"; +import { MatIconRegistry } from "@angular/material/icon"; +import { DomSanitizer } from "@angular/platform-browser"; @Component({ - selector: 'app-root', - templateUrl: './app.component.html', - styleUrls: ['./app.component.scss'], - changeDetection: ChangeDetectionStrategy.OnPush + "selector": "app-root", + "templateUrl": "./app.component.html", + "styleUrls": ["./app.component.scss"], + "changeDetection": ChangeDetectionStrategy.OnPush }) export class AppComponent { - readonly PATH_PREFIX = '../assets/icons/'; + readonly PATH_PREFIX = "../assets/icons/"; - constructor (private matIconRegistry: MatIconRegistry, - private domSanitizer: DomSanitizer) { - this.matIconRegistry.addSvgIcon('pz-search', - this.domSanitizer.bypassSecurityTrustResourceUrl(this.PATH_PREFIX + 'search-icon.svg')); - this.matIconRegistry.addSvgIcon('pz-menu-icon', - this.domSanitizer.bypassSecurityTrustResourceUrl(this.PATH_PREFIX + 'three-dot-menu-icon.svg')); + constructor ( + private matIconRegistry: MatIconRegistry, + private domSanitizer: DomSanitizer + ) { + this.matIconRegistry.addSvgIcon("pz-search", this.domSanitizer.bypassSecurityTrustResourceUrl(this.PATH_PREFIX + "search-icon.svg")); + this.matIconRegistry.addSvgIcon("pz-menu-icon", this.domSanitizer.bypassSecurityTrustResourceUrl(this.PATH_PREFIX + "three-dot-menu-icon.svg")); } } diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts index 15918314ce..e3e095ad64 100644 --- a/frontend/src/app/app.module.ts +++ b/frontend/src/app/app.module.ts @@ -1,88 +1,88 @@ -import { APP_INITIALIZER, CUSTOM_ELEMENTS_SCHEMA, Injector, NgModule } from '@angular/core'; -import { BrowserModule } from '@angular/platform-browser'; -import { AppRoutingModule } from './app-routing.module'; -import { AppComponent } from './app.component'; +import { APP_INITIALIZER, CUSTOM_ELEMENTS_SCHEMA, Injector, NgModule } from "@angular/core"; +import { BrowserModule } from "@angular/platform-browser"; +import { AppRoutingModule } from "./app-routing.module"; +import { AppComponent } from "./app.component"; import { HTTP_INTERCEPTORS, HttpBackend, HttpClient, provideHttpClient, withInterceptorsFromDi -} from '@angular/common/http'; -import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; -import { MatFormFieldModule } from '@angular/material/form-field'; -import { MatSelectModule } from '@angular/material/select'; -import { FormsModule, ReactiveFormsModule } from '@angular/forms'; -import { MatIconModule } from '@angular/material/icon'; -import { MatMenuModule } from '@angular/material/menu'; -import { MatButtonModule } from '@angular/material/button'; -import { MatProgressBarModule } from '@angular/material/progress-bar'; -import { MatExpansionModule } from '@angular/material/expansion'; -import { MatInputModule } from '@angular/material/input'; -import { MatDialogModule } from '@angular/material/dialog'; -import { ToastrModule } from 'ngx-toastr'; -import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; -import { TranslateLoader, TranslateModule, TranslateService } from '@ngx-translate/core'; -import { TranslateHttpLoader } from '@ngx-translate/http-loader'; -import { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from '@angular/material/core'; -import { MomentDateAdapter } from '@angular/material-moment-adapter'; -import { OAuthModule, OAuthService, OAuthStorage } from 'angular-oauth2-oidc'; -import { MatTooltipModule } from '@angular/material/tooltip'; -import { MatAutocompleteModule } from '@angular/material/autocomplete'; -import { MatRadioModule } from '@angular/material/radio'; -import { ConfigService } from './services/config.service'; -import { firstValueFrom } from 'rxjs'; -import { environment } from '../environments/environment'; -import { TeamComponent } from './components/team/team.component'; -import { OverviewComponent } from './components/overview/overview.component'; -import { ObjectiveComponent } from './components/objective/objective.component'; -import { CommonModule, NgOptimizedImage } from '@angular/common'; -import { KeyresultComponent } from './components/keyresult/keyresult.component'; -import { KeyresultDetailComponent } from './components/keyresult-detail/keyresult-detail.component'; -import { ObjectiveDetailComponent } from './components/objective-detail/objective-detail.component'; -import { MatSidenavModule } from '@angular/material/sidenav'; -import { ConfidenceComponent } from './components/confidence/confidence.component'; -import { MatSliderModule } from '@angular/material/slider'; -import { MatDividerModule } from '@angular/material/divider'; -import { ApplicationBannerComponent } from './components/application-banner/application-banner.component'; -import { MatCheckboxModule } from '@angular/material/checkbox'; -import { OverlayModule } from '@angular/cdk/overlay'; -import { QuarterFilterComponent } from './components/quarter-filter/quarter-filter.component'; -import { TeamFilterComponent } from './components/team-filter/team-filter.component'; -import { MatChipsModule } from '@angular/material/chips'; -import { Router } from '@angular/router'; -import { KeyresultTypeComponent } from './components/keyresult-type/keyresult-type.component'; -import { ObjectiveFilterComponent } from './components/objective-filter/objective-filter.component'; -import { ActionPlanComponent } from './components/action-plan/action-plan.component'; -import { CdkDrag, CdkDragHandle, CdkDropList } from '@angular/cdk/drag-drop'; -import { SharedModule } from './shared/shared.module'; -import { OauthInterceptor } from './interceptors/oauth.interceptor'; -import { ErrorInterceptor } from './interceptors/error-interceptor.service'; -import { CustomRouter } from './shared/customRouter'; -import { KeyResultFormComponent } from './components/key-result-form/key-result-form.component'; -import { KeyresultDialogComponent } from './components/keyresult-dialog/keyresult-dialog.component'; -import { CheckInHistoryDialogComponent } from './components/check-in-history-dialog/check-in-history-dialog.component'; -import { CheckInFormMetricComponent } from './components/checkin/check-in-form-metric/check-in-form-metric.component'; -import { CheckInFormOrdinalComponent } from './components/checkin/check-in-form-ordinal/check-in-form-ordinal.component'; -import { CheckInFormComponent } from './components/checkin/check-in-form/check-in-form.component'; -import { ApplicationTopBarComponent } from './components/application-top-bar/application-top-bar.component'; -import { A11yModule } from '@angular/cdk/a11y'; -import { CustomizationService } from './services/customization.service'; -import { MetricCheckInDirective } from './components/checkin/check-in-form-metric/metric-check-in-directive'; +} from "@angular/common/http"; +import { BrowserAnimationsModule } from "@angular/platform-browser/animations"; +import { MatFormFieldModule } from "@angular/material/form-field"; +import { MatSelectModule } from "@angular/material/select"; +import { FormsModule, ReactiveFormsModule } from "@angular/forms"; +import { MatIconModule } from "@angular/material/icon"; +import { MatMenuModule } from "@angular/material/menu"; +import { MatButtonModule } from "@angular/material/button"; +import { MatProgressBarModule } from "@angular/material/progress-bar"; +import { MatExpansionModule } from "@angular/material/expansion"; +import { MatInputModule } from "@angular/material/input"; +import { MatDialogModule } from "@angular/material/dialog"; +import { ToastrModule } from "ngx-toastr"; +import { MatProgressSpinnerModule } from "@angular/material/progress-spinner"; +import { TranslateLoader, TranslateModule, TranslateService } from "@ngx-translate/core"; +import { TranslateHttpLoader } from "@ngx-translate/http-loader"; +import { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from "@angular/material/core"; +import { MomentDateAdapter } from "@angular/material-moment-adapter"; +import { OAuthModule, OAuthService, OAuthStorage } from "angular-oauth2-oidc"; +import { MatTooltipModule } from "@angular/material/tooltip"; +import { MatAutocompleteModule } from "@angular/material/autocomplete"; +import { MatRadioModule } from "@angular/material/radio"; +import { ConfigService } from "./services/config.service"; +import { firstValueFrom } from "rxjs"; +import { environment } from "../environments/environment"; +import { TeamComponent } from "./components/team/team.component"; +import { OverviewComponent } from "./components/overview/overview.component"; +import { ObjectiveComponent } from "./components/objective/objective.component"; +import { CommonModule, NgOptimizedImage } from "@angular/common"; +import { KeyresultComponent } from "./components/keyresult/keyresult.component"; +import { KeyresultDetailComponent } from "./components/keyresult-detail/keyresult-detail.component"; +import { ObjectiveDetailComponent } from "./components/objective-detail/objective-detail.component"; +import { MatSidenavModule } from "@angular/material/sidenav"; +import { ConfidenceComponent } from "./components/confidence/confidence.component"; +import { MatSliderModule } from "@angular/material/slider"; +import { MatDividerModule } from "@angular/material/divider"; +import { ApplicationBannerComponent } from "./components/application-banner/application-banner.component"; +import { MatCheckboxModule } from "@angular/material/checkbox"; +import { OverlayModule } from "@angular/cdk/overlay"; +import { QuarterFilterComponent } from "./components/quarter-filter/quarter-filter.component"; +import { TeamFilterComponent } from "./components/team-filter/team-filter.component"; +import { MatChipsModule } from "@angular/material/chips"; +import { Router } from "@angular/router"; +import { KeyresultTypeComponent } from "./components/keyresult-type/keyresult-type.component"; +import { ObjectiveFilterComponent } from "./components/objective-filter/objective-filter.component"; +import { ActionPlanComponent } from "./components/action-plan/action-plan.component"; +import { CdkDrag, CdkDragHandle, CdkDropList } from "@angular/cdk/drag-drop"; +import { SharedModule } from "./shared/shared.module"; +import { OauthInterceptor } from "./interceptors/oauth.interceptor"; +import { ErrorInterceptor } from "./interceptors/error-interceptor.service"; +import { CustomRouter } from "./shared/customRouter"; +import { KeyResultFormComponent } from "./components/key-result-form/key-result-form.component"; +import { KeyresultDialogComponent } from "./components/keyresult-dialog/keyresult-dialog.component"; +import { CheckInHistoryDialogComponent } from "./components/check-in-history-dialog/check-in-history-dialog.component"; +import { CheckInFormMetricComponent } from "./components/checkin/check-in-form-metric/check-in-form-metric.component"; +import { CheckInFormOrdinalComponent } from "./components/checkin/check-in-form-ordinal/check-in-form-ordinal.component"; +import { CheckInFormComponent } from "./components/checkin/check-in-form/check-in-form.component"; +import { ApplicationTopBarComponent } from "./components/application-top-bar/application-top-bar.component"; +import { A11yModule } from "@angular/cdk/a11y"; +import { CustomizationService } from "./services/customization.service"; +import { MetricCheckInDirective } from "./components/checkin/check-in-form-metric/metric-check-in-directive"; function initOauthFactory (configService: ConfigService, oauthService: OAuthService) { return async () => { const config = await firstValueFrom(configService.config$); oauthService.configure({ ...environment.oauth, - issuer: config.issuer, - clientId: config.clientId + "issuer": config.issuer, + "clientId": config.clientId }); }; } export function createTranslateLoader (http: HttpBackend) { - return new TranslateHttpLoader(new HttpClient(http), './assets/i18n/', '.json'); + return new TranslateHttpLoader(new HttpClient(http), "./assets/i18n/", ".json"); } export function storageFactory (): OAuthStorage { @@ -90,19 +90,19 @@ export function storageFactory (): OAuthStorage { } export const MY_FORMATS = { - parse: { - dateInput: 'LL' + "parse": { + "dateInput": "LL" }, - display: { - dateInput: 'DD.MM.YYYY', - monthYearLabel: 'DD.MM.YYYY', - dateA11yLabel: 'DD.MM.YYYY', - monthYearA11yLabel: 'DD.MM.YYYY' + "display": { + "dateInput": "DD.MM.YYYY", + "monthYearLabel": "DD.MM.YYYY", + "dateA11yLabel": "DD.MM.YYYY", + "monthYearA11yLabel": "DD.MM.YYYY" } }; @NgModule({ - declarations: [ + "declarations": [ AppComponent, TeamComponent, OverviewComponent, @@ -126,9 +126,9 @@ export const MY_FORMATS = { CheckInFormComponent, MetricCheckInDirective ], - bootstrap: [AppComponent], - schemas: [CUSTOM_ELEMENTS_SCHEMA], - imports: [ + "bootstrap": [AppComponent], + "schemas": [CUSTOM_ELEMENTS_SCHEMA], + "imports": [ CommonModule, BrowserModule, AppRoutingModule, @@ -149,11 +149,11 @@ export const MY_FORMATS = { ToastrModule.forRoot(), MatProgressSpinnerModule, TranslateModule.forRoot({ - defaultLanguage: 'de', - loader: { - provide: TranslateLoader, - useFactory: createTranslateLoader, - deps: [HttpBackend] + "defaultLanguage": "de", + "loader": { + "provide": TranslateLoader, + "useFactory": createTranslateLoader, + "deps": [HttpBackend] } }), OAuthModule.forRoot(), @@ -172,33 +172,35 @@ export const MY_FORMATS = { CdkDragHandle, SharedModule ], - providers: [ + "providers": [ { - provide: DateAdapter, - useClass: MomentDateAdapter, - deps: [MAT_DATE_LOCALE] + "provide": DateAdapter, + "useClass": MomentDateAdapter, + "deps": [MAT_DATE_LOCALE] }, - { provide: MAT_DATE_FORMATS, - useValue: MY_FORMATS }, - { provide: HTTP_INTERCEPTORS, - useClass: OauthInterceptor, - multi: true }, - { provide: HTTP_INTERCEPTORS, - useClass: ErrorInterceptor, - multi: true }, - { provide: OAuthStorage, - useFactory: storageFactory }, + { "provide": MAT_DATE_FORMATS, + "useValue": MY_FORMATS }, + { "provide": HTTP_INTERCEPTORS, + "useClass": OauthInterceptor, + "multi": true }, + { "provide": HTTP_INTERCEPTORS, + "useClass": ErrorInterceptor, + "multi": true }, + { "provide": OAuthStorage, + "useFactory": storageFactory }, { - provide: APP_INITIALIZER, - useFactory: initOauthFactory, - deps: [ConfigService, + "provide": APP_INITIALIZER, + "useFactory": initOauthFactory, + "deps": [ + ConfigService, OAuthService, - Injector], - multi: true + Injector + ], + "multi": true }, { - provide: Router, - useClass: CustomRouter + "provide": Router, + "useClass": CustomRouter }, TranslateService, provideHttpClient(withInterceptorsFromDi()) diff --git a/frontend/src/app/components/action-plan/action-plan.component.spec.ts b/frontend/src/app/components/action-plan/action-plan.component.spec.ts index 5259e2c93e..0415d87eec 100644 --- a/frontend/src/app/components/action-plan/action-plan.component.spec.ts +++ b/frontend/src/app/components/action-plan/action-plan.component.spec.ts @@ -1,45 +1,45 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; - -import { ActionPlanComponent } from './action-plan.component'; -import { HttpClientTestingModule } from '@angular/common/http/testing'; -import { MatDialogRef } from '@angular/material/dialog'; -import { CdkDrag, CdkDropList } from '@angular/cdk/drag-drop'; -import { ActionService } from '../../services/action.service'; -import { action1, action2, action3, addedAction } from '../../shared/testData'; -import { BehaviorSubject, of } from 'rxjs'; -import { Action } from '../../shared/types/model/Action'; -import { TranslateModule, TranslateService } from '@ngx-translate/core'; -import { DialogService } from '../../services/dialog.service'; -import { ConfirmDialogComponent } from '../../shared/dialog/confirm-dialog/confirm-dialog.component'; +import { ComponentFixture, TestBed } from "@angular/core/testing"; + +import { ActionPlanComponent } from "./action-plan.component"; +import { HttpClientTestingModule } from "@angular/common/http/testing"; +import { MatDialogRef } from "@angular/material/dialog"; +import { CdkDrag, CdkDropList } from "@angular/cdk/drag-drop"; +import { ActionService } from "../../services/action.service"; +import { action1, action2, action3, addedAction } from "../../shared/testData"; +import { BehaviorSubject, of } from "rxjs"; +import { Action } from "../../shared/types/model/Action"; +import { TranslateModule, TranslateService } from "@ngx-translate/core"; +import { DialogService } from "../../services/dialog.service"; +import { ConfirmDialogComponent } from "../../shared/dialog/confirm-dialog/confirm-dialog.component"; const actionServiceMock = { - deleteAction: jest.fn() + "deleteAction": jest.fn() }; -describe('ActionPlanComponent', () => { +describe("ActionPlanComponent", () => { let component: ActionPlanComponent; let fixture: ComponentFixture; let matDialogRef: MatDialogRef; beforeEach(() => { TestBed.configureTestingModule({ - declarations: [ActionPlanComponent], - imports: [ + "declarations": [ActionPlanComponent], + "imports": [ HttpClientTestingModule, CdkDropList, CdkDrag, TranslateModule.forRoot() ], - providers: [ + "providers": [ TranslateService, DialogService, { - provide: ActionService, - useValue: actionServiceMock + "provide": ActionService, + "useValue": actionServiceMock }, { - provide: MatDialogRef, - useValue: matDialogRef + "provide": MatDialogRef, + "useValue": matDialogRef } ] }); @@ -49,18 +49,20 @@ describe('ActionPlanComponent', () => { actionServiceMock.deleteAction.mockReset(); }); - it('should create', () => { + it("should create", () => { expect(component) .toBeTruthy(); }); - it('should remove item from actionplan array', () => { - component.control = new BehaviorSubject([action1, - action2]); + it("should remove item from actionplan array", () => { + component.control = new BehaviorSubject([ + action1, + action2 + ]); actionServiceMock.deleteAction.mockReturnValue(of(null)); jest - .spyOn(component.dialogService, 'openConfirmDialog') - .mockReturnValue({ afterClosed: () => of(true) } as MatDialogRef); + .spyOn(component.dialogService, "openConfirmDialog") + .mockReturnValue({ "afterClosed": () => of(true) } as MatDialogRef); component.removeAction(0); @@ -74,8 +76,8 @@ describe('ActionPlanComponent', () => { .toBe(0); }); - it('should remove item from actionplan without opening dialog when action has no text and id', () => { - const dialogSpy = jest.spyOn(component.dialogService, 'open'); + it("should remove item from actionplan without opening dialog when action has no text and id", () => { + const dialogSpy = jest.spyOn(component.dialogService, "open"); component.control = new BehaviorSubject([action3]); component.removeAction(0); @@ -87,11 +89,13 @@ describe('ActionPlanComponent', () => { expect(actionServiceMock.deleteAction).not.toHaveBeenCalled(); }); - it('should decrease index of active item when index is the same as the one of the removed item', () => { - jest.spyOn(component.dialogService, 'open'); - component.control = new BehaviorSubject([action2, + it("should decrease index of active item when index is the same as the one of the removed item", () => { + jest.spyOn(component.dialogService, "open"); + component.control = new BehaviorSubject([ + action2, action3, - action1]); + action1 + ]); component.activeItem = 2; component.removeAction(2); @@ -99,7 +103,7 @@ describe('ActionPlanComponent', () => { .toBe(1); }); - it('should add new action with empty text into array', () => { + it("should add new action with empty text into array", () => { component.control = new BehaviorSubject([]); component.keyResultId = addedAction.keyResultId; component.addNewAction(); @@ -109,25 +113,29 @@ describe('ActionPlanComponent', () => { .toStrictEqual(addedAction); }); - it('should decrease index of active item', () => { - const keyEvent = new KeyboardEvent('keydown', { key: 'ArrowUp' }); - component.control.next([action1, + it("should decrease index of active item", () => { + const keyEvent = new KeyboardEvent("keydown", { "key": "ArrowUp" }); + component.control.next([ + action1, action2, - action3]); + action3 + ]); component.handleKeyDown(keyEvent, 2); - expect((component.activeItem = 1)); + expect(component.activeItem = 1); expect(component.control.getValue()!.toString()) - .toBe([action1, + .toBe([ + action1, action3, - action2].toString()); + action2 + ].toString()); expect(component.control.getValue()![0].priority == 0); expect(component.control.getValue()![1].priority == 1); expect(component.control.getValue()![2].priority == 2); }); - it('should increase index of active item', () => { - const keyEvent = new KeyboardEvent('keydown', { key: 'ArrowDown' }); + it("should increase index of active item", () => { + const keyEvent = new KeyboardEvent("keydown", { "key": "ArrowDown" }); component.control.next([ action1, action2, @@ -136,7 +144,7 @@ describe('ActionPlanComponent', () => { ]); component.handleKeyDown(keyEvent, 2); - expect((component.activeItem = 3)); + expect(component.activeItem = 3); expect(component.control.getValue()!.toString()) .toBe([ action1, @@ -150,21 +158,25 @@ describe('ActionPlanComponent', () => { expect(component.control.getValue()![3].priority == 3); }); - it('should increase active item index', () => { + it("should increase active item index", () => { component.activeItem = 0; - component.control.next([action1, + component.control.next([ + action1, action2, - action3]); + action3 + ]); component.increaseActiveItemWithTab(); expect(component.activeItem) .toBe(1); }); - it('should decrease active item index', () => { + it("should decrease active item index", () => { component.activeItem = 2; - component.control.next([action1, + component.control.next([ + action1, action2, - action3]); + action3 + ]); component.decreaseActiveItemWithShiftTab(); expect(component.activeItem) .toBe(1); diff --git a/frontend/src/app/components/action-plan/action-plan.component.ts b/frontend/src/app/components/action-plan/action-plan.component.ts index 2b7e8b9aa2..601dee8567 100644 --- a/frontend/src/app/components/action-plan/action-plan.component.ts +++ b/frontend/src/app/components/action-plan/action-plan.component.ts @@ -1,15 +1,15 @@ -import { Component, ElementRef, Input, QueryList, ViewChildren } from '@angular/core'; -import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop'; -import { Action } from '../../shared/types/model/Action'; -import { ActionService } from '../../services/action.service'; -import { BehaviorSubject } from 'rxjs'; -import { trackByFn } from '../../shared/common'; -import { DialogService } from '../../services/dialog.service'; +import { Component, ElementRef, Input, QueryList, ViewChildren } from "@angular/core"; +import { CdkDragDrop, moveItemInArray, transferArrayItem } from "@angular/cdk/drag-drop"; +import { Action } from "../../shared/types/model/Action"; +import { ActionService } from "../../services/action.service"; +import { BehaviorSubject } from "rxjs"; +import { trackByFn } from "../../shared/common"; +import { DialogService } from "../../services/dialog.service"; @Component({ - selector: 'app-action-plan', - templateUrl: './action-plan.component.html', - styleUrls: ['./action-plan.component.scss'] + "selector": "app-action-plan", + "templateUrl": "./action-plan.component.html", + "styleUrls": ["./action-plan.component.scss"] }) export class ActionPlanComponent { @Input() control: BehaviorSubject = new BehaviorSubject([]); @@ -18,19 +18,21 @@ export class ActionPlanComponent { activeItem = 0; - @ViewChildren('listItem') + @ViewChildren("listItem") listItems!: QueryList; - constructor (private actionService: ActionService, - public dialogService: DialogService) {} + constructor ( + private actionService: ActionService, + public dialogService: DialogService + ) {} handleKeyDown (event: Event, currentIndex: number) { let newIndex = currentIndex; - if ((event as KeyboardEvent).key === 'ArrowDown') { + if ((event as KeyboardEvent).key === "ArrowDown") { if (newIndex + 1 <= this.control.getValue()!.length - 1) { newIndex += 1; } - } else if ((event as KeyboardEvent).key === 'ArrowUp') { + } else if ((event as KeyboardEvent).key === "ArrowUp") { if (newIndex - 1 >= 0) { newIndex -= 1; } @@ -44,14 +46,14 @@ export class ActionPlanComponent { const currentActionPlan: Action[] = this.control.getValue()!; this.updateActionTexts(currentActionPlan); moveItemInArray(currentActionPlan, currentIndex, newIndex); - currentActionPlan.forEach((action: Action, index: number) => (action.priority = index)); + currentActionPlan.forEach((action: Action, index: number) => action.priority = index); this.control.next(currentActionPlan); } updateActionTexts (currentActionPlan: Action[]) { const texts = Array.from(this.listItems) .map((input: any) => input.nativeElement.value); - currentActionPlan.forEach((action: Action, index: number) => (action.action = texts[index])); + currentActionPlan.forEach((action: Action, index: number) => action.action = texts[index]); } increaseActiveItemWithTab () { @@ -69,17 +71,15 @@ export class ActionPlanComponent { drop (event: CdkDragDrop) { const value: string = (event.container.element.nativeElement.children[event.previousIndex].children[1] as HTMLInputElement).value; const actions: Action[] = this.control.getValue()!; - if (actions[event.previousIndex].action == '' && value != '') { + if (actions[event.previousIndex].action == "" && value != "") { actions[event.previousIndex] = { ...actions[event.previousIndex], - action: value }; + "action": value }; this.control.next(actions); } if (event.previousContainer === event.container) { moveItemInArray(event.container.data!, event.previousIndex, event.currentIndex); } else { - transferArrayItem( - event.previousContainer.data!, event.container.data!, event.previousIndex, event.currentIndex - ); + transferArrayItem(event.previousContainer.data!, event.container.data!, event.previousIndex, event.currentIndex); } this.adjustPriorities(); this.activeItem = event.currentIndex; @@ -98,9 +98,9 @@ export class ActionPlanComponent { if (this.activeItem == index && this.activeItem > 0) { this.activeItem--; } - if (actions[index].action !== '' || actions[index].id) { + if (actions[index].action !== "" || actions[index].id) { this.dialogService - .openConfirmDialog('DELETE.ACTION') + .openConfirmDialog("DELETE.ACTION") .afterClosed() .subscribe((result) => { if (result) { @@ -122,9 +122,9 @@ export class ActionPlanComponent { addNewAction () { const actions: Action[] = this.control.getValue()!; - actions.push({ action: '', - priority: actions.length, - keyResultId: this.keyResultId } as Action); + actions.push({ "action": "", + "priority": actions.length, + "keyResultId": this.keyResultId } as Action); this.control.next(actions); this.activeItem = actions.length - 1; } diff --git a/frontend/src/app/components/application-banner/application-banner.component.spec.ts b/frontend/src/app/components/application-banner/application-banner.component.spec.ts index 1bde07e55d..73a886c030 100644 --- a/frontend/src/app/components/application-banner/application-banner.component.spec.ts +++ b/frontend/src/app/components/application-banner/application-banner.component.spec.ts @@ -1,24 +1,24 @@ -import { ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing'; - -import { ApplicationBannerComponent } from './application-banner.component'; -import { By } from '@angular/platform-browser'; -import { RefreshDataService } from '../../services/refresh-data.service'; -import { PUZZLE_TOP_BAR_HEIGHT } from '../../shared/constantLibary'; -import { TeamFilterComponent } from '../team-filter/team-filter.component'; -import { QuarterFilterComponent } from '../quarter-filter/quarter-filter.component'; -import { HttpClientTestingModule } from '@angular/common/http/testing'; -import { ActivatedRoute } from '@angular/router'; -import { ObjectiveFilterComponent } from '../objective-filter/objective-filter.component'; -import { of } from 'rxjs'; -import { MatExpansionModule } from '@angular/material/expansion'; -import { MatFormFieldModule } from '@angular/material/form-field'; -import { MatChipsModule } from '@angular/material/chips'; -import { MatSelectModule } from '@angular/material/select'; -import { MatIconModule } from '@angular/material/icon'; -import { NoopAnimationsModule } from '@angular/platform-browser/animations'; -import { OkrTangramComponent } from '../../shared/custom/okr-tangram/okr-tangram.component'; -import { FormsModule, ReactiveFormsModule } from '@angular/forms'; -import { MatInputModule } from '@angular/material/input'; +import { ComponentFixture, fakeAsync, TestBed, tick } from "@angular/core/testing"; + +import { ApplicationBannerComponent } from "./application-banner.component"; +import { By } from "@angular/platform-browser"; +import { RefreshDataService } from "../../services/refresh-data.service"; +import { PUZZLE_TOP_BAR_HEIGHT } from "../../shared/constantLibary"; +import { TeamFilterComponent } from "../team-filter/team-filter.component"; +import { QuarterFilterComponent } from "../quarter-filter/quarter-filter.component"; +import { HttpClientTestingModule } from "@angular/common/http/testing"; +import { ActivatedRoute } from "@angular/router"; +import { ObjectiveFilterComponent } from "../objective-filter/objective-filter.component"; +import { of } from "rxjs"; +import { MatExpansionModule } from "@angular/material/expansion"; +import { MatFormFieldModule } from "@angular/material/form-field"; +import { MatChipsModule } from "@angular/material/chips"; +import { MatSelectModule } from "@angular/material/select"; +import { MatIconModule } from "@angular/material/icon"; +import { NoopAnimationsModule } from "@angular/platform-browser/animations"; +import { OkrTangramComponent } from "../../shared/custom/okr-tangram/okr-tangram.component"; +import { FormsModule, ReactiveFormsModule } from "@angular/forms"; +import { MatInputModule } from "@angular/material/input"; class ResizeObserverMock { observe () {} @@ -29,17 +29,17 @@ class ResizeObserverMock { } const refreshDataServiceMock = { - okrBannerHeightSubject: { - next: jest.fn() + "okrBannerHeightSubject": { + "next": jest.fn() }, - reloadOverviewSubject: of(null) + "reloadOverviewSubject": of(null) }; const routeMock = { - queryParams: of(null) + "queryParams": of(null) }; -describe('ApplicationBannerComponent', () => { +describe("ApplicationBannerComponent", () => { // @ts-ignore global.ResizeObserver = ResizeObserverMock; let component: ApplicationBannerComponent; @@ -47,7 +47,7 @@ describe('ApplicationBannerComponent', () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [ + "imports": [ HttpClientTestingModule, MatExpansionModule, MatFormFieldModule, @@ -59,17 +59,19 @@ describe('ApplicationBannerComponent', () => { ReactiveFormsModule, MatInputModule ], - declarations: [ + "declarations": [ ApplicationBannerComponent, TeamFilterComponent, QuarterFilterComponent, ObjectiveFilterComponent, OkrTangramComponent ], - providers: [{ provide: RefreshDataService, - useValue: refreshDataServiceMock }, - { provide: ActivatedRoute, - useValue: routeMock }] + "providers": [ + { "provide": RefreshDataService, + "useValue": refreshDataServiceMock }, + { "provide": ActivatedRoute, + "useValue": routeMock } + ] }); fixture = TestBed.createComponent(ApplicationBannerComponent); @@ -77,12 +79,12 @@ describe('ApplicationBannerComponent', () => { fixture.detectChanges(); }); - it('should create', () => { + it("should create", () => { expect(component) .toBeTruthy(); }); - it('should should hide banner if scrolled down', fakeAsync(() => { + it("should should hide banner if scrolled down", fakeAsync(() => { // Set bannerHeight to default const bannerHeight = 160; // Scroll more than the height of the banner @@ -97,11 +99,11 @@ describe('ApplicationBannerComponent', () => { // Assert that banner is hidden was changed fixture.detectChanges(); - expect(fixture.debugElement.query(By.css('#okrBanner')).attributes['style']) - .toContain('top: -' + (PUZZLE_TOP_BAR_HEIGHT + bannerHeight)); + expect(fixture.debugElement.query(By.css("#okrBanner")).attributes["style"]) + .toContain("top: -" + (PUZZLE_TOP_BAR_HEIGHT + bannerHeight)); })); - it('should show banner if scrolled up', fakeAsync(() => { + it("should show banner if scrolled up", fakeAsync(() => { // Scroll more than the height of the banner const scrollTop = 180; // Set lastScrollPosition to bigger than scrollTop => user scrolls up @@ -113,12 +115,12 @@ describe('ApplicationBannerComponent', () => { // Assert that banner is visible fixture.detectChanges(); - expect(fixture.debugElement.query(By.css('#okrBanner')).attributes['style']) - .toContain('top: ' + PUZZLE_TOP_BAR_HEIGHT); + expect(fixture.debugElement.query(By.css("#okrBanner")).attributes["style"]) + .toContain("top: " + PUZZLE_TOP_BAR_HEIGHT); })); - it('should call setOKRBannerStyle() when changing header appearance', () => { - jest.spyOn(component, 'refreshBanner') + it("should call setOKRBannerStyle() when changing header appearance", () => { + jest.spyOn(component, "refreshBanner") .mockReturnValue(); // Set bannerHeight to default and execute header appearance change @@ -131,8 +133,8 @@ describe('ApplicationBannerComponent', () => { .toHaveBeenCalled(); }); - it('should call correct method after call scroll()', () => { - jest.spyOn(component, 'changeHeaderAppearance'); + it("should call correct method after call scroll()", () => { + jest.spyOn(component, "changeHeaderAppearance"); component.scroll(); diff --git a/frontend/src/app/components/application-banner/application-banner.component.ts b/frontend/src/app/components/application-banner/application-banner.component.ts index a5d64d1917..70913c8d80 100644 --- a/frontend/src/app/components/application-banner/application-banner.component.ts +++ b/frontend/src/app/components/application-banner/application-banner.component.ts @@ -6,21 +6,21 @@ import { HostListener, OnDestroy, ViewChild -} from '@angular/core'; -import { BehaviorSubject } from 'rxjs'; -import { RefreshDataService } from '../../services/refresh-data.service'; -import { DEFAULT_HEADER_HEIGHT_PX, PUZZLE_TOP_BAR_HEIGHT } from '../../shared/constantLibary'; +} from "@angular/core"; +import { BehaviorSubject } from "rxjs"; +import { RefreshDataService } from "../../services/refresh-data.service"; +import { DEFAULT_HEADER_HEIGHT_PX, PUZZLE_TOP_BAR_HEIGHT } from "../../shared/constantLibary"; @Component({ - selector: 'app-application-banner', - templateUrl: './application-banner.component.html', - styleUrls: ['./application-banner.component.scss'], - changeDetection: ChangeDetectionStrategy.OnPush + "selector": "app-application-banner", + "templateUrl": "./application-banner.component.html", + "styleUrls": ["./application-banner.component.scss"], + "changeDetection": ChangeDetectionStrategy.OnPush }) export class ApplicationBannerComponent implements AfterViewInit, OnDestroy { - @ViewChild('okrBanner') okrBanner!: ElementRef; + @ViewChild("okrBanner") okrBanner!: ElementRef; - quarterLabel$: BehaviorSubject = new BehaviorSubject(''); + quarterLabel$: BehaviorSubject = new BehaviorSubject(""); panelOpenState = false; @@ -53,7 +53,7 @@ export class ApplicationBannerComponent implements AfterViewInit, OnDestroy { refreshBanner (scrollTop: number) { const newBannerPadding = this.getBannerTopPadding(scrollTop); - this.okrBanner.nativeElement.style.top = newBannerPadding + 'px'; + this.okrBanner.nativeElement.style.top = newBannerPadding + "px"; const overviewPadding = this.getOverviewPadding(newBannerPadding, this.bannerHeight); this.refreshDataService.okrBannerHeightSubject.next(overviewPadding); @@ -69,7 +69,7 @@ export class ApplicationBannerComponent implements AfterViewInit, OnDestroy { return newBannerPadding < 0 ? PUZZLE_TOP_BAR_HEIGHT * 2 : paddingAmount; } - @HostListener('window:scroll') + @HostListener("window:scroll") scroll () { this.changeHeaderAppearance(); } diff --git a/frontend/src/app/components/application-top-bar/application-top-bar.component.spec.ts b/frontend/src/app/components/application-top-bar/application-top-bar.component.spec.ts index 06831bcdba..c7370660c6 100644 --- a/frontend/src/app/components/application-top-bar/application-top-bar.component.spec.ts +++ b/frontend/src/app/components/application-top-bar/application-top-bar.component.spec.ts @@ -1,82 +1,84 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { ComponentFixture, TestBed } from "@angular/core/testing"; -import { ApplicationTopBarComponent } from './application-top-bar.component'; -import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; -import { DateTimeProvider, OAuthLogger, OAuthService, UrlHelperService } from 'angular-oauth2-oidc'; -import { HttpClient, HttpHandler } from '@angular/common/http'; -import { MatMenuModule } from '@angular/material/menu'; -import { HarnessLoader } from '@angular/cdk/testing'; -import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed'; -import { MatMenuHarness } from '@angular/material/menu/testing'; -import { NoopAnimationsModule } from '@angular/platform-browser/animations'; -import { MatDialogModule } from '@angular/material/dialog'; -import { NavigationEnd, Router } from '@angular/router'; -import { of } from 'rxjs'; -import { testUser } from '../../shared/testData'; -import { UserService } from '../../services/user.service'; -import { ConfigService } from '../../services/config.service'; -import { DialogService } from '../../services/dialog.service'; +import { ApplicationTopBarComponent } from "./application-top-bar.component"; +import { CUSTOM_ELEMENTS_SCHEMA } from "@angular/core"; +import { DateTimeProvider, OAuthLogger, OAuthService, UrlHelperService } from "angular-oauth2-oidc"; +import { HttpClient, HttpHandler } from "@angular/common/http"; +import { MatMenuModule } from "@angular/material/menu"; +import { HarnessLoader } from "@angular/cdk/testing"; +import { TestbedHarnessEnvironment } from "@angular/cdk/testing/testbed"; +import { MatMenuHarness } from "@angular/material/menu/testing"; +import { NoopAnimationsModule } from "@angular/platform-browser/animations"; +import { MatDialogModule } from "@angular/material/dialog"; +import { NavigationEnd, Router } from "@angular/router"; +import { of } from "rxjs"; +import { testUser } from "../../shared/testData"; +import { UserService } from "../../services/user.service"; +import { ConfigService } from "../../services/config.service"; +import { DialogService } from "../../services/dialog.service"; const oAuthMock = { - getIdentityClaims: jest.fn(), - logOut: jest.fn(), - hasValidIdToken: jest.fn() + "getIdentityClaims": jest.fn(), + "logOut": jest.fn(), + "hasValidIdToken": jest.fn() }; const dialogServiceMock = { - open: jest.fn() + "open": jest.fn() }; const routerMock = { - events: of(new NavigationEnd(1, '', '')), - navigateByUrl: jest.fn() + "events": of(new NavigationEnd(1, "", "")), + "navigateByUrl": jest.fn() }; const userServiceMock = { - getCurrentUser: () => testUser + "getCurrentUser": () => testUser }; const configServiceMock = { - config$: of({}) + "config$": of({}) }; -describe('ApplicationTopBarComponent', () => { +describe("ApplicationTopBarComponent", () => { let component: ApplicationTopBarComponent; let fixture: ComponentFixture; let loader: HarnessLoader; beforeEach(() => { TestBed.configureTestingModule({ - imports: [MatMenuModule, + "imports": [ + MatMenuModule, NoopAnimationsModule, - MatDialogModule], - declarations: [ApplicationTopBarComponent], - providers: [ - { provide: OAuthService, - useValue: oAuthMock }, - { provide: HttpClient }, - { provide: HttpHandler }, - { provide: UrlHelperService }, - { provide: OAuthLogger }, - { provide: DateTimeProvider }, + MatDialogModule + ], + "declarations": [ApplicationTopBarComponent], + "providers": [ + { "provide": OAuthService, + "useValue": oAuthMock }, + { "provide": HttpClient }, + { "provide": HttpHandler }, + { "provide": UrlHelperService }, + { "provide": OAuthLogger }, + { "provide": DateTimeProvider }, { - provide: DialogService, - useValue: dialogServiceMock + "provide": DialogService, + "useValue": dialogServiceMock }, { - provide: Router, - useValue: routerMock + "provide": Router, + "useValue": routerMock }, { - provide: UserService, - useValue: userServiceMock + "provide": UserService, + "useValue": userServiceMock }, { - provide: ConfigService, - useValue: configServiceMock + "provide": ConfigService, + "useValue": configServiceMock } ], - schemas: [CUSTOM_ELEMENTS_SCHEMA] + "schemas": [CUSTOM_ELEMENTS_SCHEMA] }) .compileComponents(); @@ -86,17 +88,17 @@ describe('ApplicationTopBarComponent', () => { component.ngOnInit(); }); - it('should create', () => { + it("should create", () => { expect(component) .toBeTruthy(); }); - it('should set full name from user service', () => { + it("should set full name from user service", () => { expect(component.userFullName) - .toBe('Bob Baumeister'); + .toBe("Bob Baumeister"); }); - it('logout function should get called on button click', async () => { + it("logout function should get called on button click", async () => { routerMock.navigateByUrl.mockReturnValue(of() .toPromise()); const harness = await loader.getHarness(MatMenuHarness); diff --git a/frontend/src/app/components/application-top-bar/application-top-bar.component.ts b/frontend/src/app/components/application-top-bar/application-top-bar.component.ts index 2560e0a0c7..81aaa6aa5b 100644 --- a/frontend/src/app/components/application-top-bar/application-top-bar.component.ts +++ b/frontend/src/app/components/application-top-bar/application-top-bar.component.ts @@ -1,25 +1,25 @@ -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core'; -import { OAuthService } from 'angular-oauth2-oidc'; -import { BehaviorSubject, Subscription } from 'rxjs'; -import { ConfigService } from '../../services/config.service'; -import { NavigationEnd, Router } from '@angular/router'; -import { UserService } from '../../services/user.service'; -import { getFullNameFromUser } from '../../shared/types/model/User'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnDestroy, OnInit } from "@angular/core"; +import { OAuthService } from "angular-oauth2-oidc"; +import { BehaviorSubject, Subscription } from "rxjs"; +import { ConfigService } from "../../services/config.service"; +import { NavigationEnd, Router } from "@angular/router"; +import { UserService } from "../../services/user.service"; +import { getFullNameFromUser } from "../../shared/types/model/User"; @Component({ - selector: 'app-application-top-bar', - templateUrl: './application-top-bar.component.html', - styleUrls: ['./application-top-bar.component.scss'], - changeDetection: ChangeDetectionStrategy.OnPush + "selector": "app-application-top-bar", + "templateUrl": "./application-top-bar.component.html", + "styleUrls": ["./application-top-bar.component.scss"], + "changeDetection": ChangeDetectionStrategy.OnPush }) export class ApplicationTopBarComponent implements OnInit, OnDestroy { - userFullName = ''; + userFullName = ""; menuIsOpen = false; - logoSrc$ = new BehaviorSubject('assets/images/empty.svg'); + logoSrc$ = new BehaviorSubject("assets/images/empty.svg"); - helpSiteUrl = new BehaviorSubject('https://en.wikipedia.org/wiki/Objectives_and_key_results'); + helpSiteUrl = new BehaviorSubject("https://en.wikipedia.org/wiki/Objectives_and_key_results"); private subscription?: Subscription; @@ -33,7 +33,7 @@ export class ApplicationTopBarComponent implements OnInit, OnDestroy { ngOnInit (): void { this.subscription = this.configService.config$.subscribe({ - next: (config) => { + "next": (config) => { if (config.logo) { this.logoSrc$.next(config.logo); } @@ -50,7 +50,7 @@ export class ApplicationTopBarComponent implements OnInit, OnDestroy { } logOut () { - const currentUrlTree = this.router.createUrlTree([], { queryParams: {} }); + const currentUrlTree = this.router.createUrlTree([], { "queryParams": {} }); this.router.navigateByUrl(currentUrlTree) .then(() => { this.oauthService.logOut(); diff --git a/frontend/src/app/components/check-in-history-dialog/check-in-history-dialog.component.spec.ts b/frontend/src/app/components/check-in-history-dialog/check-in-history-dialog.component.spec.ts index 102e72399f..4ff70d7f11 100644 --- a/frontend/src/app/components/check-in-history-dialog/check-in-history-dialog.component.spec.ts +++ b/frontend/src/app/components/check-in-history-dialog/check-in-history-dialog.component.spec.ts @@ -1,69 +1,73 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { ComponentFixture, TestBed } from "@angular/core/testing"; -import { CheckInHistoryDialogComponent } from './check-in-history-dialog.component'; -import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog'; -import { provideHttpClientTesting } from '@angular/common/http/testing'; -import { checkInMetric, checkInMetricWriteableFalse, keyResult } from '../../shared/testData'; -import { By } from '@angular/platform-browser'; -import { DialogService } from '../../services/dialog.service'; -import { TranslateModule, TranslateService } from '@ngx-translate/core'; -import { MatIconModule } from '@angular/material/icon'; -import { SpinnerComponent } from '../../shared/custom/spinner/spinner.component'; -import { MatProgressSpinner } from '@angular/material/progress-spinner'; -import { provideRouter } from '@angular/router'; -import { provideHttpClient } from '@angular/common/http'; -import { DialogTemplateCoreComponent } from '../../shared/custom/dialog-template-core/dialog-template-core.component'; -import { MatDividerModule } from '@angular/material/divider'; +import { CheckInHistoryDialogComponent } from "./check-in-history-dialog.component"; +import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from "@angular/material/dialog"; +import { provideHttpClientTesting } from "@angular/common/http/testing"; +import { checkInMetric, checkInMetricWriteableFalse, keyResult } from "../../shared/testData"; +import { By } from "@angular/platform-browser"; +import { DialogService } from "../../services/dialog.service"; +import { TranslateModule, TranslateService } from "@ngx-translate/core"; +import { MatIconModule } from "@angular/material/icon"; +import { SpinnerComponent } from "../../shared/custom/spinner/spinner.component"; +import { MatProgressSpinner } from "@angular/material/progress-spinner"; +import { provideRouter } from "@angular/router"; +import { provideHttpClient } from "@angular/common/http"; +import { DialogTemplateCoreComponent } from "../../shared/custom/dialog-template-core/dialog-template-core.component"; +import { MatDividerModule } from "@angular/material/divider"; const checkInService = { - getAllCheckInOfKeyResult: jest.fn() + "getAllCheckInOfKeyResult": jest.fn() }; -describe('CheckInHistoryDialogComponent', () => { +describe("CheckInHistoryDialogComponent", () => { let component: CheckInHistoryDialogComponent; let fixture: ComponentFixture; beforeEach(() => { TestBed.configureTestingModule({ - declarations: [CheckInHistoryDialogComponent, + "declarations": [ + CheckInHistoryDialogComponent, DialogTemplateCoreComponent, - SpinnerComponent], + SpinnerComponent + ], - imports: [ + "imports": [ TranslateModule.forRoot(), MatIconModule, MatProgressSpinner, MatDividerModule, MatDialogModule ], - providers: [ + "providers": [ provideRouter([]), provideHttpClient(), provideHttpClientTesting(), TranslateService, DialogService, - { provide: MAT_DIALOG_DATA, - useValue: { keyResult: keyResult } }, - { provide: MatDialogRef, - useValue: {} } + { "provide": MAT_DIALOG_DATA, + "useValue": { "keyResult": keyResult } }, + { "provide": MatDialogRef, + "useValue": {} } ] }); jest - .spyOn(checkInService, 'getAllCheckInOfKeyResult') - .mockReturnValue([checkInMetric, - checkInMetricWriteableFalse]); + .spyOn(checkInService, "getAllCheckInOfKeyResult") + .mockReturnValue([ + checkInMetric, + checkInMetricWriteableFalse + ]); fixture = TestBed.createComponent(CheckInHistoryDialogComponent); component = fixture.componentInstance; fixture.detectChanges(); }); - it('should create', () => { + it("should create", () => { expect(component) .toBeTruthy(); }); - it.skip('should not display edit check-in button if writeable is false', async () => { - const buttons = fixture.debugElement.queryAll(By.css('button')); + it.skip("should not display edit check-in button if writeable is false", async () => { + const buttons = fixture.debugElement.queryAll(By.css("button")); expect(buttons.length) .toBe(1); }); diff --git a/frontend/src/app/components/check-in-history-dialog/check-in-history-dialog.component.ts b/frontend/src/app/components/check-in-history-dialog/check-in-history-dialog.component.ts index c799128f94..59feb0cb78 100644 --- a/frontend/src/app/components/check-in-history-dialog/check-in-history-dialog.component.ts +++ b/frontend/src/app/components/check-in-history-dialog/check-in-history-dialog.component.ts @@ -1,20 +1,20 @@ -import { Component, Inject, OnInit } from '@angular/core'; -import { CheckInMin } from '../../shared/types/model/CheckInMin'; -import { CheckInService } from '../../services/check-in.service'; -import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; -import { DATE_FORMAT } from '../../shared/constantLibary'; -import { KeyResult } from '../../shared/types/model/KeyResult'; -import { CheckInFormComponent } from '../checkin/check-in-form/check-in-form.component'; -import { Observable, of } from 'rxjs'; -import { KeyResultMetric } from '../../shared/types/model/KeyResultMetric'; -import { RefreshDataService } from '../../services/refresh-data.service'; -import { DialogService } from '../../services/dialog.service'; -import { CheckInMetricMin } from '../../shared/types/model/CheckInMetricMin'; -import { CheckInOrdinalMin } from '../../shared/types/model/CheckInOrdinalMin'; +import { Component, Inject, OnInit } from "@angular/core"; +import { CheckInMin } from "../../shared/types/model/CheckInMin"; +import { CheckInService } from "../../services/check-in.service"; +import { MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog"; +import { DATE_FORMAT } from "../../shared/constantLibary"; +import { KeyResult } from "../../shared/types/model/KeyResult"; +import { CheckInFormComponent } from "../checkin/check-in-form/check-in-form.component"; +import { Observable, of } from "rxjs"; +import { KeyResultMetric } from "../../shared/types/model/KeyResultMetric"; +import { RefreshDataService } from "../../services/refresh-data.service"; +import { DialogService } from "../../services/dialog.service"; +import { CheckInMetricMin } from "../../shared/types/model/CheckInMetricMin"; +import { CheckInOrdinalMin } from "../../shared/types/model/CheckInOrdinalMin"; @Component({ - selector: 'app-check-in-history-dialog', - templateUrl: './check-in-history-dialog.component.html' + "selector": "app-check-in-history-dialog", + "templateUrl": "./check-in-history-dialog.component.html" }) export class CheckInHistoryDialogComponent implements OnInit { keyResult!: KeyResult; @@ -41,9 +41,9 @@ export class CheckInHistoryDialogComponent implements OnInit { openCheckInDialogForm (checkIn: CheckInMin) { const dialogRef = this.dialogService.open(CheckInFormComponent, { - data: { - keyResult: this.keyResult, - checkIn: checkIn + "data": { + "keyResult": this.keyResult, + "checkIn": checkIn } }); dialogRef.afterClosed() diff --git a/frontend/src/app/components/checkin/check-in-form-metric/check-in-form-metric.component.spec.ts b/frontend/src/app/components/checkin/check-in-form-metric/check-in-form-metric.component.spec.ts index 3ca966b7b8..1602a40842 100644 --- a/frontend/src/app/components/checkin/check-in-form-metric/check-in-form-metric.component.spec.ts +++ b/frontend/src/app/components/checkin/check-in-form-metric/check-in-form-metric.component.spec.ts @@ -1,24 +1,24 @@ -import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { ComponentFixture, TestBed, waitForAsync } from "@angular/core/testing"; -import { CheckInFormMetricComponent } from './check-in-form-metric.component'; -import { checkInMetric, keyResultMetric } from '../../../shared/testData'; -import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; -import { MatDialogModule } from '@angular/material/dialog'; -import { NoopAnimationsModule } from '@angular/platform-browser/animations'; -import { MatSelectModule } from '@angular/material/select'; -import { MatInputModule } from '@angular/material/input'; -import { MatRadioModule } from '@angular/material/radio'; -import { Unit } from '../../../shared/types/enums/Unit'; -import { TranslateTestingModule } from 'ngx-translate-testing'; -import * as de from '../../../../assets/i18n/de.json'; +import { CheckInFormMetricComponent } from "./check-in-form-metric.component"; +import { checkInMetric, keyResultMetric } from "../../../shared/testData"; +import { FormControl, FormGroup, ReactiveFormsModule, Validators } from "@angular/forms"; +import { MatDialogModule } from "@angular/material/dialog"; +import { NoopAnimationsModule } from "@angular/platform-browser/animations"; +import { MatSelectModule } from "@angular/material/select"; +import { MatInputModule } from "@angular/material/input"; +import { MatRadioModule } from "@angular/material/radio"; +import { Unit } from "../../../shared/types/enums/Unit"; +import { TranslateTestingModule } from "ngx-translate-testing"; +import * as de from "../../../../assets/i18n/de.json"; -describe('CheckInFormComponent', () => { +describe("CheckInFormComponent", () => { let component: CheckInFormMetricComponent; let fixture: ComponentFixture; beforeEach(() => { TestBed.configureTestingModule({ - imports: [ + "imports": [ MatDialogModule, NoopAnimationsModule, MatSelectModule, @@ -26,61 +26,63 @@ describe('CheckInFormComponent', () => { MatRadioModule, ReactiveFormsModule, TranslateTestingModule.withTranslations({ - de: de + "de": de }) ], - declarations: [CheckInFormMetricComponent] + "declarations": [CheckInFormMetricComponent] }); fixture = TestBed.createComponent(CheckInFormMetricComponent); component = fixture.componentInstance; component.keyResult = keyResultMetric; component.checkIn = checkInMetric; component.dialogForm = new FormGroup({ - value: new FormControl('', [Validators.required]), - confidence: new FormControl(5, [Validators.required, + "value": new FormControl("", [Validators.required]), + "confidence": new FormControl(5, [ + Validators.required, Validators.min(1), - Validators.max(10)]) + Validators.max(10) + ]) }); fixture.detectChanges(); }); - it('should create', () => { + it("should create", () => { expect(component) .toBeTruthy(); }); - it('should format percent correctly', waitForAsync(async () => { + it("should format percent correctly", waitForAsync(async () => { component.keyResult = { ...keyResultMetric, - unit: Unit.PERCENT }; + "unit": Unit.PERCENT }; expect(component.generateUnitLabel()) - .toEqual('%'); + .toEqual("%"); })); - it('should format chf correctly', waitForAsync(async () => { + it("should format chf correctly", waitForAsync(async () => { component.keyResult = { ...keyResultMetric, - unit: Unit.CHF }; + "unit": Unit.CHF }; expect(component.generateUnitLabel()) - .toEqual('CHF'); + .toEqual("CHF"); })); - it('should format eur correctly', waitForAsync(async () => { + it("should format eur correctly", waitForAsync(async () => { component.keyResult = { ...keyResultMetric, - unit: Unit.EUR }; + "unit": Unit.EUR }; expect(component.generateUnitLabel()) - .toEqual('EUR'); + .toEqual("EUR"); })); - it('should format fte correctly', waitForAsync(async () => { + it("should format fte correctly", waitForAsync(async () => { component.keyResult = { ...keyResultMetric, - unit: Unit.FTE }; + "unit": Unit.FTE }; expect(component.generateUnitLabel()) - .toEqual('FTE'); + .toEqual("FTE"); })); - it('should format number correctly', waitForAsync(async () => { + it("should format number correctly", waitForAsync(async () => { component.keyResult = { ...keyResultMetric, - unit: Unit.NUMBER }; + "unit": Unit.NUMBER }; expect(component.generateUnitLabel()) - .toEqual(''); + .toEqual(""); })); }); diff --git a/frontend/src/app/components/checkin/check-in-form-metric/check-in-form-metric.component.ts b/frontend/src/app/components/checkin/check-in-form-metric/check-in-form-metric.component.ts index af87f47d10..f56f9e9ea0 100644 --- a/frontend/src/app/components/checkin/check-in-form-metric/check-in-form-metric.component.ts +++ b/frontend/src/app/components/checkin/check-in-form-metric/check-in-form-metric.component.ts @@ -1,16 +1,16 @@ -import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core'; -import { FormGroup, Validators } from '@angular/forms'; -import { KeyResultMetric } from '../../../shared/types/model/KeyResultMetric'; -import { CheckInMin } from '../../../shared/types/model/CheckInMin'; -import { formInputCheck, hasFormFieldErrors } from '../../../shared/common'; -import { TranslateService } from '@ngx-translate/core'; -import { CheckInMetricMin } from '../../../shared/types/model/CheckInMetricMin'; +import { ChangeDetectionStrategy, Component, Input, OnInit } from "@angular/core"; +import { FormGroup, Validators } from "@angular/forms"; +import { KeyResultMetric } from "../../../shared/types/model/KeyResultMetric"; +import { CheckInMin } from "../../../shared/types/model/CheckInMin"; +import { formInputCheck, hasFormFieldErrors } from "../../../shared/common"; +import { TranslateService } from "@ngx-translate/core"; +import { CheckInMetricMin } from "../../../shared/types/model/CheckInMetricMin"; @Component({ - selector: 'app-check-in-form-metric', - templateUrl: './check-in-form-metric.component.html', - styleUrls: ['./check-in-form-metric.component.scss'], - changeDetection: ChangeDetectionStrategy.OnPush + "selector": "app-check-in-form-metric", + "templateUrl": "./check-in-form-metric.component.html", + "styleUrls": ["./check-in-form-metric.component.scss"], + "changeDetection": ChangeDetectionStrategy.OnPush }) export class CheckInFormMetricComponent implements OnInit { @Input() @@ -29,27 +29,29 @@ export class CheckInFormMetricComponent implements OnInit { constructor (private translate: TranslateService) {} ngOnInit () { - this.dialogForm.controls['value'].setValidators([Validators.required, - Validators.pattern('^-?\\d+\\.?\\d*$')]); + this.dialogForm.controls["value"].setValidators([ + Validators.required, + Validators.pattern("^-?\\d+\\.?\\d*$") + ]); } generateUnitLabel (): string { switch (this.keyResult.unit) { - case 'PERCENT': - return '%'; - case 'CHF': - return 'CHF'; - case 'EUR': - return 'EUR'; - case 'FTE': - return 'FTE'; + case "PERCENT": + return "%"; + case "CHF": + return "CHF"; + case "EUR": + return "EUR"; + case "FTE": + return "FTE"; default: - return ''; + return ""; } } getErrorMessage (error: string, field: string): string { - return field + this.translate.instant('DIALOG_ERRORS.' + error); + return field + this.translate.instant("DIALOG_ERRORS." + error); } getCheckInMetric (): CheckInMetricMin { diff --git a/frontend/src/app/components/checkin/check-in-form-metric/metric-check-in-directive.spec.ts b/frontend/src/app/components/checkin/check-in-form-metric/metric-check-in-directive.spec.ts index 8498b4133d..11d287d6ef 100644 --- a/frontend/src/app/components/checkin/check-in-form-metric/metric-check-in-directive.spec.ts +++ b/frontend/src/app/components/checkin/check-in-form-metric/metric-check-in-directive.spec.ts @@ -1,26 +1,38 @@ -import { MetricCheckInDirective } from './metric-check-in-directive'; +import { MetricCheckInDirective } from "./metric-check-in-directive"; -describe('MetricCheckInDirective', () => { - it('create an instance', () => { +describe("MetricCheckInDirective", () => { + it("create an instance", () => { const directive = new MetricCheckInDirective(); expect(directive) .toBeTruthy(); }); it.each([ - ['HelloWorld200', - 200], - ['200HelloWorld', - 200], - ["200'000", - 200000], - ['1050&%ç*', - 1050], - ['-1', - -1], - ['-ç13&%', - -13] - ])('should parse value %s correctly to %s', (value: string, expected: number) => { + [ + "HelloWorld200", + 200 + ], + [ + "200HelloWorld", + 200 + ], + [ + "200'000", + 200000 + ], + [ + "1050&%ç*", + 1050 + ], + [ + "-1", + -1 + ], + [ + "-ç13&%", + -13 + ] + ])("should parse value %s correctly to %s", (value: string, expected: number) => { const mockOnChange = jest.fn(); const directive = new MetricCheckInDirective(); directive.registerOnChange(mockOnChange); diff --git a/frontend/src/app/components/checkin/check-in-form-metric/metric-check-in-directive.ts b/frontend/src/app/components/checkin/check-in-form-metric/metric-check-in-directive.ts index 73e636daa2..fa8779694f 100644 --- a/frontend/src/app/components/checkin/check-in-form-metric/metric-check-in-directive.ts +++ b/frontend/src/app/components/checkin/check-in-form-metric/metric-check-in-directive.ts @@ -1,13 +1,15 @@ -import { Directive, HostListener, forwardRef } from '@angular/core'; -import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'; +import { Directive, HostListener, forwardRef } from "@angular/core"; +import { ControlValueAccessor, NG_VALUE_ACCESSOR } from "@angular/forms"; @Directive({ - selector: '[metricCheckIn]', - providers: [{ - provide: NG_VALUE_ACCESSOR, - useExisting: forwardRef(() => MetricCheckInDirective), - multi: true - }] + "selector": "[metricCheckIn]", + "providers": [ + { + "provide": NG_VALUE_ACCESSOR, + "useExisting": forwardRef(() => MetricCheckInDirective), + "multi": true + } + ] }) export class MetricCheckInDirective implements ControlValueAccessor { private onChange: (value: number | null) => void = () => {}; @@ -26,16 +28,16 @@ export class MetricCheckInDirective implements ControlValueAccessor { // does not need to be implemented } - @HostListener('input', ['$event.target.value']) + @HostListener("input", ["$event.target.value"]) handleInput (param: string): void { - const value: string = param || '0'; + const value: string = param || "0"; if (value.toString() - .at(0) == '-') { - this.onChange(+('-' + value.toString() - .replace(this.CHAR_REGEX, ''))); + .at(0) == "-") { + this.onChange(+("-" + value.toString() + .replace(this.CHAR_REGEX, ""))); return; } this.onChange(Number(value.toString() - .replace(this.CHAR_REGEX, ''))); + .replace(this.CHAR_REGEX, ""))); } } diff --git a/frontend/src/app/components/checkin/check-in-form-ordinal/check-in-form-ordinal.component.spec.ts b/frontend/src/app/components/checkin/check-in-form-ordinal/check-in-form-ordinal.component.spec.ts index 84931bfa71..1cb5776532 100644 --- a/frontend/src/app/components/checkin/check-in-form-ordinal/check-in-form-ordinal.component.spec.ts +++ b/frontend/src/app/components/checkin/check-in-form-ordinal/check-in-form-ordinal.component.spec.ts @@ -1,27 +1,27 @@ -import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { ComponentFixture, TestBed, waitForAsync } from "@angular/core/testing"; -import { CheckInFormOrdinalComponent } from './check-in-form-ordinal.component'; -import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; -import { keyResultOrdinalMin } from '../../../shared/testData'; -import { KeyResultOrdinal } from '../../../shared/types/model/KeyResultOrdinal'; -import { MatDialogModule } from '@angular/material/dialog'; -import { NoopAnimationsModule } from '@angular/platform-browser/animations'; -import { MatSelectModule } from '@angular/material/select'; -import { MatInputModule } from '@angular/material/input'; -import { MatRadioModule } from '@angular/material/radio'; -import { Zone } from '../../../shared/types/enums/Zone'; -import { MatRadioButtonHarness } from '@angular/material/radio/testing'; -import { HarnessLoader } from '@angular/cdk/testing'; -import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed'; +import { CheckInFormOrdinalComponent } from "./check-in-form-ordinal.component"; +import { FormControl, FormGroup, ReactiveFormsModule, Validators } from "@angular/forms"; +import { keyResultOrdinalMin } from "../../../shared/testData"; +import { KeyResultOrdinal } from "../../../shared/types/model/KeyResultOrdinal"; +import { MatDialogModule } from "@angular/material/dialog"; +import { NoopAnimationsModule } from "@angular/platform-browser/animations"; +import { MatSelectModule } from "@angular/material/select"; +import { MatInputModule } from "@angular/material/input"; +import { MatRadioModule } from "@angular/material/radio"; +import { Zone } from "../../../shared/types/enums/Zone"; +import { MatRadioButtonHarness } from "@angular/material/radio/testing"; +import { HarnessLoader } from "@angular/cdk/testing"; +import { TestbedHarnessEnvironment } from "@angular/cdk/testing/testbed"; -describe('CheckInFormOrdinalComponent', () => { +describe("CheckInFormOrdinalComponent", () => { let component: CheckInFormOrdinalComponent; let fixture: ComponentFixture; let loader: HarnessLoader; beforeEach(() => { TestBed.configureTestingModule({ - imports: [ + "imports": [ MatDialogModule, NoopAnimationsModule, MatSelectModule, @@ -29,64 +29,66 @@ describe('CheckInFormOrdinalComponent', () => { MatRadioModule, ReactiveFormsModule ], - declarations: [CheckInFormOrdinalComponent] + "declarations": [CheckInFormOrdinalComponent] }); fixture = TestBed.createComponent(CheckInFormOrdinalComponent); component = fixture.componentInstance; component.keyResult = keyResultOrdinalMin as unknown as KeyResultOrdinal; component.dialogForm = new FormGroup({ - value: new FormControl('', [Validators.required]), - confidence: new FormControl(5, [Validators.required, + "value": new FormControl("", [Validators.required]), + "confidence": new FormControl(5, [ + Validators.required, Validators.min(1), - Validators.max(10)]) + Validators.max(10) + ]) }); fixture.detectChanges(); loader = TestbedHarnessEnvironment.loader(fixture); }); - it('should create', () => { + it("should create", () => { expect(component) .toBeTruthy(); }); - it('should set zone of check-in to fail if value is empty', waitForAsync(async () => { - expect(component.dialogForm.controls['value'].value) - .toBe(''); + it("should set zone of check-in to fail if value is empty", waitForAsync(async () => { + expect(component.dialogForm.controls["value"].value) + .toBe(""); })); - it('should set zone to Fail', waitForAsync(async () => { + it("should set zone to Fail", waitForAsync(async () => { const radioButtons = await loader.getAllHarnesses(MatRadioButtonHarness); await radioButtons[0].check(); - expect(component.dialogForm.controls['value'].value) + expect(component.dialogForm.controls["value"].value) .toBe(Zone.FAIL); })); - it('should set zone to Commit', waitForAsync(async () => { + it("should set zone to Commit", waitForAsync(async () => { const radioButtons = await loader.getAllHarnesses(MatRadioButtonHarness); await radioButtons[1].check(); - expect(component.dialogForm.controls['value'].value) + expect(component.dialogForm.controls["value"].value) .toBe(Zone.COMMIT); })); - it('should set zone to Target', waitForAsync(async () => { + it("should set zone to Target", waitForAsync(async () => { const radioButtons = await loader.getAllHarnesses(MatRadioButtonHarness); await radioButtons[2].check(); - expect(component.dialogForm.controls['value'].value) + expect(component.dialogForm.controls["value"].value) .toBe(Zone.TARGET); })); - it('should set zone to Stretch', waitForAsync(async () => { + it("should set zone to Stretch", waitForAsync(async () => { const radioButtons = await loader.getAllHarnesses(MatRadioButtonHarness); await radioButtons[3].check(); - expect(component.dialogForm.controls['value'].value) + expect(component.dialogForm.controls["value"].value) .toBe(Zone.STRETCH); })); - it('should be able to switch options ', waitForAsync(async () => { + it("should be able to switch options ", waitForAsync(async () => { const radioButtons = await loader.getAllHarnesses(MatRadioButtonHarness); await radioButtons[3].check(); await radioButtons[1].check(); - expect(component.dialogForm.controls['value'].value) + expect(component.dialogForm.controls["value"].value) .toBe(Zone.COMMIT); })); }); diff --git a/frontend/src/app/components/checkin/check-in-form-ordinal/check-in-form-ordinal.component.ts b/frontend/src/app/components/checkin/check-in-form-ordinal/check-in-form-ordinal.component.ts index ed8354c380..61da93c87b 100644 --- a/frontend/src/app/components/checkin/check-in-form-ordinal/check-in-form-ordinal.component.ts +++ b/frontend/src/app/components/checkin/check-in-form-ordinal/check-in-form-ordinal.component.ts @@ -1,13 +1,13 @@ -import { Component, Input } from '@angular/core'; -import { FormGroup } from '@angular/forms'; -import { KeyResultOrdinal } from '../../../shared/types/model/KeyResultOrdinal'; -import { Zone } from '../../../shared/types/enums/Zone'; -import { CheckInMin } from '../../../shared/types/model/CheckInMin'; +import { Component, Input } from "@angular/core"; +import { FormGroup } from "@angular/forms"; +import { KeyResultOrdinal } from "../../../shared/types/model/KeyResultOrdinal"; +import { Zone } from "../../../shared/types/enums/Zone"; +import { CheckInMin } from "../../../shared/types/model/CheckInMin"; @Component({ - selector: 'app-check-in-form-ordinal', - templateUrl: './check-in-form-ordinal.component.html', - styleUrls: ['./check-in-form-ordinal.component.scss'] + "selector": "app-check-in-form-ordinal", + "templateUrl": "./check-in-form-ordinal.component.html", + "styleUrls": ["./check-in-form-ordinal.component.scss"] }) export class CheckInFormOrdinalComponent { @Input() diff --git a/frontend/src/app/components/checkin/check-in-form/check-in-form.component.spec.ts b/frontend/src/app/components/checkin/check-in-form/check-in-form.component.spec.ts index 78f6cd1501..847611652b 100644 --- a/frontend/src/app/components/checkin/check-in-form/check-in-form.component.spec.ts +++ b/frontend/src/app/components/checkin/check-in-form/check-in-form.component.spec.ts @@ -1,7 +1,7 @@ -import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { ComponentFixture, TestBed, waitForAsync } from "@angular/core/testing"; -import { CheckInFormComponent } from './check-in-form.component'; -import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog'; +import { CheckInFormComponent } from "./check-in-form.component"; +import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from "@angular/material/dialog"; import { action1, action2, @@ -10,47 +10,47 @@ import { keyResultActions, keyResultMetric, keyResultOrdinal -} from '../../../shared/testData'; -import { MatIconModule } from '@angular/material/icon'; -import { MatFormFieldModule } from '@angular/material/form-field'; -import { MatSelectModule } from '@angular/material/select'; -import { FormsModule, ReactiveFormsModule } from '@angular/forms'; -import { MatInputModule } from '@angular/material/input'; -import { NoopAnimationsModule } from '@angular/platform-browser/animations'; -import { MatCheckboxModule } from '@angular/material/checkbox'; -import { CheckInService } from '../../../services/check-in.service'; -import { of } from 'rxjs'; -import { ActionService } from '../../../services/action.service'; +} from "../../../shared/testData"; +import { MatIconModule } from "@angular/material/icon"; +import { MatFormFieldModule } from "@angular/material/form-field"; +import { MatSelectModule } from "@angular/material/select"; +import { FormsModule, ReactiveFormsModule } from "@angular/forms"; +import { MatInputModule } from "@angular/material/input"; +import { NoopAnimationsModule } from "@angular/platform-browser/animations"; +import { MatCheckboxModule } from "@angular/material/checkbox"; +import { CheckInService } from "../../../services/check-in.service"; +import { of } from "rxjs"; +import { ActionService } from "../../../services/action.service"; // @ts-ignore -import * as de from '../../../../assets/i18n/de.json'; -import { TranslateTestingModule } from 'ngx-translate-testing'; -import { ConfidenceComponent } from '../../confidence/confidence.component'; -import { MatSliderModule } from '@angular/material/slider'; -import { provideRouter } from '@angular/router'; -import { provideHttpClient } from '@angular/common/http'; -import { provideHttpClientTesting } from '@angular/common/http/testing'; -import { DialogTemplateCoreComponent } from '../../../shared/custom/dialog-template-core/dialog-template-core.component'; -import { MatDividerModule } from '@angular/material/divider'; +import * as de from "../../../../assets/i18n/de.json"; +import { TranslateTestingModule } from "ngx-translate-testing"; +import { ConfidenceComponent } from "../../confidence/confidence.component"; +import { MatSliderModule } from "@angular/material/slider"; +import { provideRouter } from "@angular/router"; +import { provideHttpClient } from "@angular/common/http"; +import { provideHttpClientTesting } from "@angular/common/http/testing"; +import { DialogTemplateCoreComponent } from "../../../shared/custom/dialog-template-core/dialog-template-core.component"; +import { MatDividerModule } from "@angular/material/divider"; const dialogMock = { - close: jest.fn() + "close": jest.fn() }; const checkInServiceMock = { - saveCheckIn: jest.fn() + "saveCheckIn": jest.fn() }; const actionServiceMock = { - updateActions: jest.fn() + "updateActions": jest.fn() }; -describe('CheckInFormComponent', () => { +describe("CheckInFormComponent", () => { let component: CheckInFormComponent; let fixture: ComponentFixture; beforeEach(() => { TestBed.configureTestingModule({ - imports: [ + "imports": [ MatDialogModule, MatIconModule, MatFormFieldModule, @@ -63,44 +63,46 @@ describe('CheckInFormComponent', () => { FormsModule, ReactiveFormsModule, TranslateTestingModule.withTranslations({ - de: de + "de": de }), MatDividerModule ], - providers: [ + "providers": [ provideRouter([]), provideHttpClient(), provideHttpClientTesting(), - { provide: MAT_DIALOG_DATA, - useValue: { keyResult: {} } }, - { provide: MatDialogRef, - useValue: dialogMock }, - { provide: CheckInService, - useValue: checkInServiceMock }, - { provide: ActionService, - useValue: actionServiceMock } + { "provide": MAT_DIALOG_DATA, + "useValue": { "keyResult": {} } }, + { "provide": MatDialogRef, + "useValue": dialogMock }, + { "provide": CheckInService, + "useValue": checkInServiceMock }, + { "provide": ActionService, + "useValue": actionServiceMock } ], - declarations: [CheckInFormComponent, + "declarations": [ + CheckInFormComponent, DialogTemplateCoreComponent, - ConfidenceComponent] + ConfidenceComponent + ] }); fixture = TestBed.createComponent(CheckInFormComponent); component = fixture.componentInstance; fixture.detectChanges(); }); - it('should create', () => { + it("should create", () => { expect(component) .toBeTruthy(); }); - it('should save check-in correctly if key result is metric', waitForAsync(async () => { + it("should save check-in correctly if key result is metric", waitForAsync(async () => { component.checkIn = checkInMetric; component.keyResult = keyResultMetric; - component.dialogForm.controls['value'].setValue(checkInMetric?.value!.toString()); - component.dialogForm.controls['confidence'].setValue(checkInMetric.confidence); - component.dialogForm.controls['changeInfo'].setValue(checkInMetric.changeInfo); - component.dialogForm.controls['initiatives'].setValue(checkInMetric.initiatives); + component.dialogForm.controls["value"].setValue(checkInMetric?.value!.toString()); + component.dialogForm.controls["confidence"].setValue(checkInMetric.confidence); + component.dialogForm.controls["changeInfo"].setValue(checkInMetric.changeInfo); + component.dialogForm.controls["initiatives"].setValue(checkInMetric.initiatives); checkInServiceMock.saveCheckIn.mockReturnValue(of(checkInMetric)); actionServiceMock.updateActions.mockReturnValue(of(action2)); @@ -108,25 +110,25 @@ describe('CheckInFormComponent', () => { expect(checkInServiceMock.saveCheckIn) .toHaveBeenCalledWith({ - id: checkInMetric.id, - version: checkInMetric.version, - confidence: checkInMetric.confidence, - value: checkInMetric.value!.toString(), - changeInfo: checkInMetric.changeInfo, - initiatives: checkInMetric.initiatives, - keyResultId: keyResultMetric.id + "id": checkInMetric.id, + "version": checkInMetric.version, + "confidence": checkInMetric.confidence, + "value": checkInMetric.value!.toString(), + "changeInfo": checkInMetric.changeInfo, + "initiatives": checkInMetric.initiatives, + "keyResultId": keyResultMetric.id }); expect(actionServiceMock.updateActions) .toHaveBeenCalled(); })); - it('should save check-in correctly if key result is ordinal', waitForAsync(async () => { + it("should save check-in correctly if key result is ordinal", waitForAsync(async () => { component.checkIn = checkInOrdinal; component.keyResult = keyResultOrdinal; - component.dialogForm.controls['value'].setValue(checkInOrdinal?.zone!.toString()); - component.dialogForm.controls['confidence'].setValue(checkInOrdinal.confidence); - component.dialogForm.controls['changeInfo'].setValue(checkInOrdinal.changeInfo); - component.dialogForm.controls['initiatives'].setValue(checkInOrdinal.initiatives); + component.dialogForm.controls["value"].setValue(checkInOrdinal?.zone!.toString()); + component.dialogForm.controls["confidence"].setValue(checkInOrdinal.confidence); + component.dialogForm.controls["changeInfo"].setValue(checkInOrdinal.changeInfo); + component.dialogForm.controls["initiatives"].setValue(checkInOrdinal.initiatives); checkInServiceMock.saveCheckIn.mockReturnValue(of(checkInOrdinal)); actionServiceMock.updateActions.mockReturnValue(of(action2)); @@ -134,59 +136,61 @@ describe('CheckInFormComponent', () => { expect(checkInServiceMock.saveCheckIn) .toHaveBeenCalledWith({ - id: checkInOrdinal.id, - version: checkInOrdinal.version, - confidence: checkInOrdinal.confidence, - zone: checkInOrdinal.zone, - changeInfo: checkInOrdinal.changeInfo, - initiatives: checkInOrdinal.initiatives, - keyResultId: keyResultOrdinal.id + "id": checkInOrdinal.id, + "version": checkInOrdinal.version, + "confidence": checkInOrdinal.confidence, + "zone": checkInOrdinal.zone, + "changeInfo": checkInOrdinal.changeInfo, + "initiatives": checkInOrdinal.initiatives, + "keyResultId": keyResultOrdinal.id }); })); - it('should set default values if form check-in input is not null', waitForAsync(async () => { + it("should set default values if form check-in input is not null", waitForAsync(async () => { component.data.checkIn = checkInMetric; component.setDefaultValues(); expect(component.dialogForm.value) .toStrictEqual({ - confidence: checkInMetric.confidence, - value: checkInMetric.value!.toString(), - changeInfo: checkInMetric.changeInfo, - initiatives: checkInMetric.initiatives, - actionList: undefined + "confidence": checkInMetric.confidence, + "value": checkInMetric.value!.toString(), + "changeInfo": checkInMetric.changeInfo, + "initiatives": checkInMetric.initiatives, + "actionList": undefined }); })); - it('should set default values if last check-in of key result is not null', waitForAsync(async () => { + it("should set default values if last check-in of key result is not null", waitForAsync(async () => { component.keyResult = keyResultOrdinal; component.ngOnInit(); component.setDefaultValues(); expect(component.dialogForm.value) .toStrictEqual({ - confidence: keyResultOrdinal.lastCheckIn!.confidence, - value: '', - changeInfo: '', - initiatives: '', - actionList: [] + "confidence": keyResultOrdinal.lastCheckIn!.confidence, + "value": "", + "changeInfo": "", + "initiatives": "", + "actionList": [] }); })); - it('should set default values with actionList on KeyResult', waitForAsync(async () => { + it("should set default values with actionList on KeyResult", waitForAsync(async () => { component.keyResult = keyResultActions; component.ngOnInit(); component.setDefaultValues(); expect(component.dialogForm.value) .toStrictEqual({ - confidence: keyResultActions.lastCheckIn!.confidence, - value: '', - changeInfo: '', - initiatives: '', - actionList: [action1, - action2] + "confidence": keyResultActions.lastCheckIn!.confidence, + "value": "", + "changeInfo": "", + "initiatives": "", + "actionList": [ + action1, + action2 + ] }); })); - it('should call actionService when saving CheckIn', waitForAsync(async () => { + it("should call actionService when saving CheckIn", waitForAsync(async () => { checkInServiceMock.saveCheckIn.mockReturnValue(of(true)); actionServiceMock.updateActions.mockReturnValue(of(true)); diff --git a/frontend/src/app/components/checkin/check-in-form/check-in-form.component.ts b/frontend/src/app/components/checkin/check-in-form/check-in-form.component.ts index 6db471b7d1..fcef649f55 100644 --- a/frontend/src/app/components/checkin/check-in-form/check-in-form.component.ts +++ b/frontend/src/app/components/checkin/check-in-form/check-in-form.component.ts @@ -1,24 +1,24 @@ -import { ChangeDetectionStrategy, Component, Inject, OnInit } from '@angular/core'; -import { KeyResultMetric } from '../../../shared/types/model/KeyResultMetric'; -import { FormControl, FormGroup, Validators } from '@angular/forms'; -import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; -import { KeyResult } from '../../../shared/types/model/KeyResult'; -import { KeyResultOrdinal } from '../../../shared/types/model/KeyResultOrdinal'; -import { CheckInMin } from '../../../shared/types/model/CheckInMin'; -import { CheckInService } from '../../../services/check-in.service'; -import { Action } from '../../../shared/types/model/Action'; -import { ActionService } from '../../../services/action.service'; -import { formInputCheck, hasFormFieldErrors } from '../../../shared/common'; -import { TranslateService } from '@ngx-translate/core'; -import { CheckIn } from '../../../shared/types/model/CheckIn'; -import { CheckInMetricMin } from '../../../shared/types/model/CheckInMetricMin'; -import { CheckInOrdinalMin } from '../../../shared/types/model/CheckInOrdinalMin'; +import { ChangeDetectionStrategy, Component, Inject, OnInit } from "@angular/core"; +import { KeyResultMetric } from "../../../shared/types/model/KeyResultMetric"; +import { FormControl, FormGroup, Validators } from "@angular/forms"; +import { MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog"; +import { KeyResult } from "../../../shared/types/model/KeyResult"; +import { KeyResultOrdinal } from "../../../shared/types/model/KeyResultOrdinal"; +import { CheckInMin } from "../../../shared/types/model/CheckInMin"; +import { CheckInService } from "../../../services/check-in.service"; +import { Action } from "../../../shared/types/model/Action"; +import { ActionService } from "../../../services/action.service"; +import { formInputCheck, hasFormFieldErrors } from "../../../shared/common"; +import { TranslateService } from "@ngx-translate/core"; +import { CheckIn } from "../../../shared/types/model/CheckIn"; +import { CheckInMetricMin } from "../../../shared/types/model/CheckInMetricMin"; +import { CheckInOrdinalMin } from "../../../shared/types/model/CheckInOrdinalMin"; @Component({ - selector: 'app-check-in-form', - templateUrl: './check-in-form.component.html', - styleUrls: ['./check-in-form.component.scss'], - changeDetection: ChangeDetectionStrategy.OnPush + "selector": "app-check-in-form", + "templateUrl": "./check-in-form.component.html", + "styleUrls": ["./check-in-form.component.scss"], + "changeDetection": ChangeDetectionStrategy.OnPush }) export class CheckInFormComponent implements OnInit { keyResult: KeyResult; @@ -30,13 +30,15 @@ export class CheckInFormComponent implements OnInit { continued = false; dialogForm = new FormGroup({ - value: new FormControl('', [Validators.required]), - confidence: new FormControl(5, [Validators.required, + "value": new FormControl("", [Validators.required]), + "confidence": new FormControl(5, [ + Validators.required, Validators.min(0), - Validators.max(10)]), - changeInfo: new FormControl('', [Validators.maxLength(4096)]), - initiatives: new FormControl('', [Validators.maxLength(4096)]), - actionList: new FormControl([]) + Validators.max(10) + ]), + "changeInfo": new FormControl("", [Validators.maxLength(4096)]), + "initiatives": new FormControl("", [Validators.maxLength(4096)]), + "actionList": new FormControl([]) }); protected readonly formInputCheck = formInputCheck; @@ -56,11 +58,11 @@ export class CheckInFormComponent implements OnInit { } ngOnInit () { - this.dialogForm.patchValue({ actionList: this.keyResult.actionList }); + this.dialogForm.patchValue({ "actionList": this.keyResult.actionList }); } getErrorMessage (error: string, field: string, maxLength: number): string { - return field + this.translate.instant('DIALOG_ERRORS.' + error) + return field + this.translate.instant("DIALOG_ERRORS." + error) .format(maxLength); } @@ -74,17 +76,19 @@ export class CheckInFormComponent implements OnInit { this.dialogForm.controls.initiatives.setValue(this.checkIn.initiatives); return; } + /* If KeyResult has lastCheckIn set checkIn to this value */ if ((this.keyResult as KeyResultMetric | KeyResultOrdinal).lastCheckIn != null) { this.checkIn = { ...(this.keyResult as KeyResultMetric | KeyResultOrdinal).lastCheckIn, - id: undefined + "id": undefined } as CheckInMin; this.dialogForm.controls.confidence.setValue(this.checkIn.confidence); return; } + /* If Check-in is null set as object with confidence 5 default value */ - this.checkIn = { confidence: 5 } as CheckInMin; + this.checkIn = { "confidence": 5 } as CheckInMin; } calculateTarget (keyResult: KeyResultMetric): number { @@ -94,17 +98,17 @@ export class CheckInFormComponent implements OnInit { saveCheckIn () { this.dialogForm.controls.confidence.setValue(this.checkIn.confidence); const baseCheckIn: any = { - id: this.checkIn.id, - version: this.checkIn.version, - keyResultId: this.keyResult.id, - confidence: this.dialogForm.controls.confidence.value, - changeInfo: this.dialogForm.controls.changeInfo.value, - initiatives: this.dialogForm.controls.initiatives.value, - actionList: this.dialogForm.controls.actionList.value + "id": this.checkIn.id, + "version": this.checkIn.version, + "keyResultId": this.keyResult.id, + "confidence": this.dialogForm.controls.confidence.value, + "changeInfo": this.dialogForm.controls.changeInfo.value, + "initiatives": this.dialogForm.controls.initiatives.value, + "actionList": this.dialogForm.controls.actionList.value }; const checkIn: CheckIn = { ...baseCheckIn, - [this.keyResult.keyResultType === 'ordinal' ? 'zone' : 'value']: this.dialogForm.controls.value.value + [this.keyResult.keyResultType === "ordinal" ? "zone" : "value"]: this.dialogForm.controls.value.value }; this.checkInService.saveCheckIn(checkIn) @@ -133,17 +137,17 @@ export class CheckInFormComponent implements OnInit { } getActions (): Action[] { - return this.dialogForm.controls['actionList'].value || []; + return this.dialogForm.controls["actionList"].value || []; } changeIsChecked (event: any, index: number) { const actions = this.dialogForm.value.actionList!; actions[index] = { ...actions[index], - isChecked: event.checked }; - this.dialogForm.patchValue({ actionList: actions }); + "isChecked": event.checked }; + this.dialogForm.patchValue({ "actionList": actions }); } getDialogTitle (): string { - return this.checkIn.id ? 'Check-in bearbeiten' : 'Check-in erfassen'; + return this.checkIn.id ? "Check-in bearbeiten" : "Check-in erfassen"; } } diff --git a/frontend/src/app/components/confidence/confidence.component.spec.ts b/frontend/src/app/components/confidence/confidence.component.spec.ts index e1b42cc605..bcf2852b32 100644 --- a/frontend/src/app/components/confidence/confidence.component.spec.ts +++ b/frontend/src/app/components/confidence/confidence.component.spec.ts @@ -1,25 +1,27 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { ComponentFixture, TestBed } from "@angular/core/testing"; -import { ConfidenceComponent } from './confidence.component'; -import { HarnessLoader } from '@angular/cdk/testing'; -import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed'; -import { checkInMetric } from '../../shared/testData'; -import { MatSliderModule } from '@angular/material/slider'; -import { CheckInMin } from '../../shared/types/model/CheckInMin'; -import { FormsModule } from '@angular/forms'; -import { SimpleChange } from '@angular/core'; -import { By } from '@angular/platform-browser'; +import { ConfidenceComponent } from "./confidence.component"; +import { HarnessLoader } from "@angular/cdk/testing"; +import { TestbedHarnessEnvironment } from "@angular/cdk/testing/testbed"; +import { checkInMetric } from "../../shared/testData"; +import { MatSliderModule } from "@angular/material/slider"; +import { CheckInMin } from "../../shared/types/model/CheckInMin"; +import { FormsModule } from "@angular/forms"; +import { SimpleChange } from "@angular/core"; +import { By } from "@angular/platform-browser"; -describe('ConfidenceComponent', () => { +describe("ConfidenceComponent", () => { let component: ConfidenceComponent; let fixture: ComponentFixture; let loader: HarnessLoader; beforeEach(() => { TestBed.configureTestingModule({ - declarations: [ConfidenceComponent], - imports: [MatSliderModule, - FormsModule] + "declarations": [ConfidenceComponent], + "imports": [ + MatSliderModule, + FormsModule + ] }) .compileComponents(); @@ -30,24 +32,30 @@ describe('ConfidenceComponent', () => { component.edit = true; }); - it('should create', () => { + it("should create", () => { expect(component) .toBeTruthy(); }); - it.each([[{ confidence: 8 } as CheckInMin, - '8'], - [null, - '5']])('should set confidence of component with right value', async (checkIn: CheckInMin | null, expected: string) => { + it.each([ + [ + { "confidence": 8 } as CheckInMin, + "8" + ], + [ + null, + "5" + ] + ])("should set confidence of component with right value", async (checkIn: CheckInMin | null, expected: string) => { component.checkIn = checkIn!; component.ngOnChanges({ - checkIn: new SimpleChange(null, component.checkIn, true) + "checkIn": new SimpleChange(null, component.checkIn, true) }); fixture.detectChanges(); await fixture.whenStable(); const textField = fixture.debugElement.query(By.css("[data-testid='confidence']")); - const expectedLabel = expected + '/' + component.max; - const sliderInputField = fixture.debugElement.query(By.css('mat-slider > input ')); + const expectedLabel = expected + "/" + component.max; + const sliderInputField = fixture.debugElement.query(By.css("mat-slider > input ")); expect(await sliderInputField.nativeElement.value) .toBe(expected); @@ -55,11 +63,13 @@ describe('ConfidenceComponent', () => { .toContain(expectedLabel); }); - it.each([[true], - [false]])('should show slider on based on input var', async (editable) => { + it.each([ + [true], + [false] + ])("should show slider on based on input var", async (editable) => { component.edit = editable; fixture.detectChanges(); - const slider = fixture.debugElement.query(By.css('mat-slider')); + const slider = fixture.debugElement.query(By.css("mat-slider")); expect(!!slider) .toBe(editable); diff --git a/frontend/src/app/components/confidence/confidence.component.ts b/frontend/src/app/components/confidence/confidence.component.ts index 4bd48a4d46..f2d9362e2a 100644 --- a/frontend/src/app/components/confidence/confidence.component.ts +++ b/frontend/src/app/components/confidence/confidence.component.ts @@ -1,11 +1,11 @@ -import { ChangeDetectionStrategy, Component, Input, OnChanges, SimpleChanges } from '@angular/core'; -import { CheckInMin } from '../../shared/types/model/CheckInMin'; +import { ChangeDetectionStrategy, Component, Input, OnChanges, SimpleChanges } from "@angular/core"; +import { CheckInMin } from "../../shared/types/model/CheckInMin"; @Component({ - selector: 'app-confidence', - templateUrl: './confidence.component.html', - styleUrls: ['./confidence.component.scss'], - changeDetection: ChangeDetectionStrategy.OnPush + "selector": "app-confidence", + "templateUrl": "./confidence.component.html", + "styleUrls": ["./confidence.component.scss"], + "changeDetection": ChangeDetectionStrategy.OnPush }) export class ConfidenceComponent implements OnChanges { min = 0; @@ -19,8 +19,8 @@ export class ConfidenceComponent implements OnChanges { @Input() checkIn!: CheckInMin; ngOnChanges (changes: SimpleChanges) { - if (!changes['checkIn']?.currentValue) { - this.checkIn = { confidence: 5 } as CheckInMin; + if (!changes["checkIn"]?.currentValue) { + this.checkIn = { "confidence": 5 } as CheckInMin; } } } diff --git a/frontend/src/app/components/key-result-form/key-result-form.component.spec.ts b/frontend/src/app/components/key-result-form/key-result-form.component.spec.ts index 43ce3f75cc..f9d0db73ab 100644 --- a/frontend/src/app/components/key-result-form/key-result-form.component.spec.ts +++ b/frontend/src/app/components/key-result-form/key-result-form.component.spec.ts @@ -1,44 +1,44 @@ -import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; -import { KeyresultService } from '../../services/keyresult.service'; -import { MatDialogModule, MatDialogRef } from '@angular/material/dialog'; -import { NoopAnimationsModule } from '@angular/platform-browser/animations'; -import { MatInputModule } from '@angular/material/input'; -import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; -import { provideHttpClientTesting } from '@angular/common/http/testing'; -import { MatIconModule } from '@angular/material/icon'; -import { keyResultOrdinal, testUser, users } from '../../shared/testData'; -import { State } from '../../shared/types/enums/State'; -import { Observable, of } from 'rxjs'; -import { MatAutocompleteModule } from '@angular/material/autocomplete'; -import { MatSelectModule } from '@angular/material/select'; -import { MatRadioModule } from '@angular/material/radio'; -import { KeyResultObjective } from '../../shared/types/model/KeyResultObjective'; -import { User } from '../../shared/types/model/User'; -import { OAuthService } from 'angular-oauth2-oidc'; -import { KeyresultTypeComponent } from '../keyresult-type/keyresult-type.component'; -import { ActionPlanComponent } from '../action-plan/action-plan.component'; -import { TranslateModule, TranslateService } from '@ngx-translate/core'; -import { DragDropModule } from '@angular/cdk/drag-drop'; -import { UserService } from '../../services/user.service'; -import { KeyResultFormComponent } from './key-result-form.component'; -import { Action } from '../../shared/types/model/Action'; -import { KeyResultMetric } from '../../shared/types/model/KeyResultMetric'; -import { KeyResultOrdinal } from '../../shared/types/model/KeyResultOrdinal'; -import { TranslateTestingModule } from 'ngx-translate-testing'; +import { ComponentFixture, TestBed, waitForAsync } from "@angular/core/testing"; +import { KeyresultService } from "../../services/keyresult.service"; +import { MatDialogModule, MatDialogRef } from "@angular/material/dialog"; +import { NoopAnimationsModule } from "@angular/platform-browser/animations"; +import { MatInputModule } from "@angular/material/input"; +import { FormControl, FormGroup, ReactiveFormsModule, Validators } from "@angular/forms"; +import { provideHttpClientTesting } from "@angular/common/http/testing"; +import { MatIconModule } from "@angular/material/icon"; +import { keyResultOrdinal, testUser, users } from "../../shared/testData"; +import { State } from "../../shared/types/enums/State"; +import { Observable, of } from "rxjs"; +import { MatAutocompleteModule } from "@angular/material/autocomplete"; +import { MatSelectModule } from "@angular/material/select"; +import { MatRadioModule } from "@angular/material/radio"; +import { KeyResultObjective } from "../../shared/types/model/KeyResultObjective"; +import { User } from "../../shared/types/model/User"; +import { OAuthService } from "angular-oauth2-oidc"; +import { KeyresultTypeComponent } from "../keyresult-type/keyresult-type.component"; +import { ActionPlanComponent } from "../action-plan/action-plan.component"; +import { TranslateModule, TranslateService } from "@ngx-translate/core"; +import { DragDropModule } from "@angular/cdk/drag-drop"; +import { UserService } from "../../services/user.service"; +import { KeyResultFormComponent } from "./key-result-form.component"; +import { Action } from "../../shared/types/model/Action"; +import { KeyResultMetric } from "../../shared/types/model/KeyResultMetric"; +import { KeyResultOrdinal } from "../../shared/types/model/KeyResultOrdinal"; +import { TranslateTestingModule } from "ngx-translate-testing"; // @ts-ignore -import * as de from '../../../assets/i18n/de.json'; -import { provideRouter } from '@angular/router'; -import { provideHttpClient } from '@angular/common/http'; -import { DialogTemplateCoreComponent } from '../../shared/custom/dialog-template-core/dialog-template-core.component'; -import { Quarter } from '../../shared/types/model/Quarter'; +import * as de from "../../../assets/i18n/de.json"; +import { provideRouter } from "@angular/router"; +import { provideHttpClient } from "@angular/common/http"; +import { DialogTemplateCoreComponent } from "../../shared/custom/dialog-template-core/dialog-template-core.component"; +import { Quarter } from "../../shared/types/model/Quarter"; -describe('KeyResultFormComponent', () => { +describe("KeyResultFormComponent", () => { let component: KeyResultFormComponent; let fixture: ComponentFixture; const oauthMockService = { getIdentityClaims () { - return { name: users[1].firstname + ' ' + users[1].lastname }; + return { "name": users[1].firstname + " " + users[1].lastname }; } }; @@ -46,61 +46,63 @@ describe('KeyResultFormComponent', () => { getUsers () { return of(users); }, - getCurrentUser: jest.fn() + "getCurrentUser": jest.fn() }; const matDialogRefMock = { - close: jest.fn() + "close": jest.fn() }; const mockUserService = { - getUsers: jest.fn() + "getUsers": jest.fn() }; const keyResultForm = { - owner: null, - actionList: [], - title: 'Title', - baseline: 0, - stretchZone: null, - targetZone: null, - commitZone: null, - unit: 'FTE', - description: null, - stretchGoal: 0, - keyResultType: 'metric' + "owner": null, + "actionList": [], + "title": "Title", + "baseline": 0, + "stretchZone": null, + "targetZone": null, + "commitZone": null, + "unit": "FTE", + "description": null, + "stretchGoal": 0, + "keyResultType": "metric" }; const keyResultObjective: KeyResultObjective = { - id: 2, - state: State.ONGOING, - quarter: new Quarter( - 1, 'GJ 22/23-Q2', new Date(), new Date() - ) + "id": 2, + "state": State.ONGOING, + "quarter": new Quarter(1, "GJ 22/23-Q2", new Date(), new Date()) }; const keyResultFormGroup = new FormGroup({ - title: new FormControl('', [Validators.required, + "title": new FormControl("", [ + Validators.required, Validators.minLength(2), - Validators.maxLength(250)]), - description: new FormControl('', [Validators.maxLength(4096)]), - owner: new FormControl(null, [Validators.required, - Validators.nullValidator]), - actionList: new FormControl([]), - unit: new FormControl(null), - baseline: new FormControl(null), - stretchGoal: new FormControl(null), - commitZone: new FormControl(null), - targetZone: new FormControl(null), - stretchZone: new FormControl(null), - keyResultType: new FormControl('metric') + Validators.maxLength(250) + ]), + "description": new FormControl("", [Validators.maxLength(4096)]), + "owner": new FormControl(null, [ + Validators.required, + Validators.nullValidator + ]), + "actionList": new FormControl([]), + "unit": new FormControl(null), + "baseline": new FormControl(null), + "stretchGoal": new FormControl(null), + "commitZone": new FormControl(null), + "targetZone": new FormControl(null), + "stretchZone": new FormControl(null), + "keyResultType": new FormControl("metric") }); - describe('New KeyResult', () => { + describe("New KeyResult", () => { beforeEach(() => { mockUserService.getUsers.mockReturnValue(users); TestBed.configureTestingModule({ - imports: [ + "imports": [ MatDialogModule, NoopAnimationsModule, MatSelectModule, @@ -112,27 +114,27 @@ describe('KeyResultFormComponent', () => { TranslateModule.forRoot(), DragDropModule, TranslateTestingModule.withTranslations({ - de: de + "de": de }) ], - providers: [ + "providers": [ KeyresultService, TranslateService, - { provide: UserService, - useValue: userService }, + { "provide": UserService, + "useValue": userService }, { - provide: MatDialogRef, - useValue: matDialogRefMock + "provide": MatDialogRef, + "useValue": matDialogRefMock }, { - provide: OAuthService, - useValue: oauthMockService + "provide": OAuthService, + "useValue": oauthMockService }, provideRouter([]), provideHttpClient(), provideHttpClientTesting() ], - declarations: [ + "declarations": [ KeyResultFormComponent, DialogTemplateCoreComponent, KeyresultTypeComponent, @@ -148,38 +150,38 @@ describe('KeyResultFormComponent', () => { fixture.detectChanges(); }); - it('should create', () => { + it("should create", () => { expect(component) .toBeTruthy(); }); - it('should have logged in user as owner', waitForAsync(async () => { - const userServiceSpy = jest.spyOn(userService, 'getUsers'); + it("should have logged in user as owner", waitForAsync(async () => { + const userServiceSpy = jest.spyOn(userService, "getUsers"); component.keyResultForm.setValue(keyResultForm); component.ngOnInit(); fixture.detectChanges(); const formObject = component.keyResultForm.value; expect(formObject.title) - .toBe('Title'); + .toBe("Title"); expect(formObject.description) .toBe(null); expect(userServiceSpy) .toHaveBeenCalled(); - expect(component.keyResultForm.controls['owner'].value) + expect(component.keyResultForm.controls["owner"].value) .toBe(testUser); expect(component.keyResultForm.invalid) .toBeFalsy(); })); - it('should return right filtered user', () => { - let userObservable: Observable = component.filter('baum'); + it("should return right filtered user", () => { + let userObservable: Observable = component.filter("baum"); userObservable.subscribe((userList) => { expect(userList.length) .toEqual(1); }); - userObservable = component.filter('ob'); + userObservable = component.filter("ob"); userObservable.subscribe((userList) => { expect(userList.length) @@ -187,85 +189,85 @@ describe('KeyResultFormComponent', () => { }); }); - it('should return label from user', () => { + it("should return label from user", () => { const userName: string = component.getUserNameFromUser(testUser); expect(userName) - .toEqual('Bob Baumeister'); + .toEqual("Bob Baumeister"); }); - it('should set metric values', () => { + it("should set metric values", () => { const fullKeyResultMetric: KeyResultMetric = { - id: 3, - version: 2, - title: 'Der Titel ist hier', - description: 'Die Beschreibung', - owner: testUser, - objective: keyResultObjective, - baseline: 3, - keyResultType: 'metric', - lastCheckIn: null, - actionList: null, - stretchGoal: 25, - unit: 'CHF', - createdOn: new Date(), - modifiedOn: new Date(), - writeable: true + "id": 3, + "version": 2, + "title": "Der Titel ist hier", + "description": "Die Beschreibung", + "owner": testUser, + "objective": keyResultObjective, + "baseline": 3, + "keyResultType": "metric", + "lastCheckIn": null, + "actionList": null, + "stretchGoal": 25, + "unit": "CHF", + "createdOn": new Date(), + "modifiedOn": new Date(), + "writeable": true }; component.setMetricValuesInForm(fullKeyResultMetric); - expect(component.keyResultForm.controls['baseline'].value) + expect(component.keyResultForm.controls["baseline"].value) .toEqual(3); - expect(component.keyResultForm.controls['stretchGoal'].value) + expect(component.keyResultForm.controls["stretchGoal"].value) .toEqual(25); - expect(component.keyResultForm.controls['unit'].value) - .toEqual('CHF'); + expect(component.keyResultForm.controls["unit"].value) + .toEqual("CHF"); }); - it('should set ordinal values', () => { + it("should set ordinal values", () => { const fullKeyResultOrdinal: KeyResultOrdinal = { - id: 3, - version: 2, - title: 'Der Titel ist hier', - description: 'Die Beschreibung', - owner: testUser, - objective: keyResultObjective, - commitZone: 'Eine Kuh', - keyResultType: 'metric', - lastCheckIn: null, - actionList: null, - targetZone: 'Ein Schaf', - stretchZone: 'Eine Ziege', - createdOn: new Date(), - modifiedOn: new Date(), - writeable: true + "id": 3, + "version": 2, + "title": "Der Titel ist hier", + "description": "Die Beschreibung", + "owner": testUser, + "objective": keyResultObjective, + "commitZone": "Eine Kuh", + "keyResultType": "metric", + "lastCheckIn": null, + "actionList": null, + "targetZone": "Ein Schaf", + "stretchZone": "Eine Ziege", + "createdOn": new Date(), + "modifiedOn": new Date(), + "writeable": true }; component.setOrdinalValuesInForm(fullKeyResultOrdinal); - expect(component.keyResultForm.controls['commitZone'].value) - .toEqual('Eine Kuh'); - expect(component.keyResultForm.controls['targetZone'].value) - .toEqual('Ein Schaf'); - expect(component.keyResultForm.controls['stretchZone'].value) - .toEqual('Eine Ziege'); + expect(component.keyResultForm.controls["commitZone"].value) + .toEqual("Eine Kuh"); + expect(component.keyResultForm.controls["targetZone"].value) + .toEqual("Ein Schaf"); + expect(component.keyResultForm.controls["stretchZone"].value) + .toEqual("Eine Ziege"); }); - it('should get metric value right', () => { + it("should get metric value right", () => { expect(component.isMetricKeyResult()) .toBeTruthy(); - component.keyResultForm.patchValue({ keyResultType: 'ordinal' }); + component.keyResultForm.patchValue({ "keyResultType": "ordinal" }); expect(component.isMetricKeyResult()) .toBeFalsy(); }); - it('should get username from user right', () => { + it("should get username from user right", () => { const user = users[0]; expect(component.getUserNameFromUser(user)) - .toEqual('Bob Baumeister'); + .toEqual("Bob Baumeister"); expect(component.getUserNameFromUser(null!)) - .toEqual(''); + .toEqual(""); }); - it('should get keyresult id right', () => { + it("should get keyresult id right", () => { expect(component.getKeyResultId()) .toEqual(null); component.keyResult = keyResultOrdinal; @@ -273,9 +275,9 @@ describe('KeyResultFormComponent', () => { .toEqual(101); }); - it('should get username from oauthService right', () => { + it("should get username from oauthService right", () => { expect(component.getLoggedInUserName()) - .toEqual(testUser.firstname + ' ' + testUser.lastname); + .toEqual(testUser.firstname + " " + testUser.lastname); }); }); }); diff --git a/frontend/src/app/components/key-result-form/key-result-form.component.ts b/frontend/src/app/components/key-result-form/key-result-form.component.ts index 1595fdb4f3..36fa78ee21 100644 --- a/frontend/src/app/components/key-result-form/key-result-form.component.ts +++ b/frontend/src/app/components/key-result-form/key-result-form.component.ts @@ -1,21 +1,21 @@ -import { ChangeDetectionStrategy, Component, Input, OnDestroy, OnInit } from '@angular/core'; -import { FormGroup } from '@angular/forms'; -import { getFullNameFromUser, User } from '../../shared/types/model/User'; -import { KeyResult } from '../../shared/types/model/KeyResult'; -import { KeyResultMetric } from '../../shared/types/model/KeyResultMetric'; -import { KeyResultOrdinal } from '../../shared/types/model/KeyResultOrdinal'; -import { BehaviorSubject, filter, map, Observable, of, startWith, Subject, switchMap, takeUntil } from 'rxjs'; -import { UserService } from '../../services/user.service'; -import { Action } from '../../shared/types/model/Action'; -import { formInputCheck, hasFormFieldErrors } from '../../shared/common'; -import { OAuthService } from 'angular-oauth2-oidc'; -import { TranslateService } from '@ngx-translate/core'; +import { ChangeDetectionStrategy, Component, Input, OnDestroy, OnInit } from "@angular/core"; +import { FormGroup } from "@angular/forms"; +import { getFullNameFromUser, User } from "../../shared/types/model/User"; +import { KeyResult } from "../../shared/types/model/KeyResult"; +import { KeyResultMetric } from "../../shared/types/model/KeyResultMetric"; +import { KeyResultOrdinal } from "../../shared/types/model/KeyResultOrdinal"; +import { BehaviorSubject, filter, map, Observable, of, startWith, Subject, switchMap, takeUntil } from "rxjs"; +import { UserService } from "../../services/user.service"; +import { Action } from "../../shared/types/model/Action"; +import { formInputCheck, hasFormFieldErrors } from "../../shared/common"; +import { OAuthService } from "angular-oauth2-oidc"; +import { TranslateService } from "@ngx-translate/core"; @Component({ - selector: 'app-key-result-form', - templateUrl: './key-result-form.component.html', - styleUrls: ['./key-result-form.component.scss'], - changeDetection: ChangeDetectionStrategy.OnPush + "selector": "app-key-result-form", + "templateUrl": "./key-result-form.component.html", + "styleUrls": ["./key-result-form.component.scss"], + "changeDetection": ChangeDetectionStrategy.OnPush }) export class KeyResultFormComponent implements OnInit, OnDestroy { users$!: Observable; @@ -36,21 +36,21 @@ export class KeyResultFormComponent implements OnInit, OnDestroy { @Input() keyResult!: KeyResult | null; - constructor (public userService: UserService, + constructor ( + public userService: UserService, private oauthService: OAuthService, - private translate: TranslateService) {} + private translate: TranslateService + ) {} ngOnInit (): void { this.users$ = this.userService.getUsers(); - this.filteredUsers$ = this.keyResultForm.get('owner')?.valueChanges.pipe(startWith(''), - filter((value) => typeof value === 'string'), - switchMap((value) => this.filter(value as string))); + this.filteredUsers$ = this.keyResultForm.get("owner")?.valueChanges.pipe(startWith(""), filter((value) => typeof value === "string"), switchMap((value) => this.filter(value as string))); if (this.keyResult) { - this.keyResultForm.patchValue({ actionList: this.keyResult.actionList }); - this.keyResultForm.controls['title'].setValue(this.keyResult.title); - this.keyResultForm.controls['description'].setValue(this.keyResult.description); - this.keyResultForm.controls['owner'].setValue(this.keyResult.owner); - this.keyResultForm.controls['keyResultType'].setValue(this.keyResult.keyResultType); + this.keyResultForm.patchValue({ "actionList": this.keyResult.actionList }); + this.keyResultForm.controls["title"].setValue(this.keyResult.title); + this.keyResultForm.controls["description"].setValue(this.keyResult.description); + this.keyResultForm.controls["owner"].setValue(this.keyResult.owner); + this.keyResultForm.controls["keyResultType"].setValue(this.keyResult.keyResultType); this.isMetricKeyResult() ? this.setMetricValuesInForm(this.keyResult as KeyResultMetric) : this.setOrdinalValuesInForm(this.keyResult as KeyResultOrdinal); @@ -58,38 +58,40 @@ export class KeyResultFormComponent implements OnInit, OnDestroy { this.actionList$ = new BehaviorSubject(this.keyResult.actionList); } if (!this.keyResult) { - this.actionList$ = new BehaviorSubject([{ id: null, - version: 1, - action: '', - priority: 0, - keyResultId: null, - isChecked: false }, - { id: null, - version: 1, - action: '', - priority: 1, - keyResultId: null, - isChecked: false }, - { id: null, - version: 1, - action: '', - priority: 2, - keyResultId: null, - isChecked: false }]); + this.actionList$ = new BehaviorSubject([ + { "id": null, + "version": 1, + "action": "", + "priority": 0, + "keyResultId": null, + "isChecked": false }, + { "id": null, + "version": 1, + "action": "", + "priority": 1, + "keyResultId": null, + "isChecked": false }, + { "id": null, + "version": 1, + "action": "", + "priority": 2, + "keyResultId": null, + "isChecked": false } + ]); this.users$.pipe(takeUntil(this.unsubscribe$)) .subscribe((users) => { const loggedInUser = this.getLoggedInUserName(); users.forEach((user) => { if (getFullNameFromUser(user) === loggedInUser) { - this.keyResultForm.controls['owner'].setValue(user); + this.keyResultForm.controls["owner"].setValue(user); } }); }); } this.actionList$.subscribe((value) => { - this.keyResultForm.patchValue({ actionList: value }); + this.keyResultForm.patchValue({ "actionList": value }); }); } @@ -99,29 +101,27 @@ export class KeyResultFormComponent implements OnInit, OnDestroy { } isMetricKeyResult () { - return this.keyResultForm.controls['keyResultType'].value === 'metric'; + return this.keyResultForm.controls["keyResultType"].value === "metric"; } setMetricValuesInForm (keyResultMetric: KeyResultMetric) { - this.keyResultForm.controls['unit'].setValue(keyResultMetric.unit); - this.keyResultForm.controls['baseline'].setValue(keyResultMetric.baseline); - this.keyResultForm.controls['stretchGoal'].setValue(keyResultMetric.stretchGoal); + this.keyResultForm.controls["unit"].setValue(keyResultMetric.unit); + this.keyResultForm.controls["baseline"].setValue(keyResultMetric.baseline); + this.keyResultForm.controls["stretchGoal"].setValue(keyResultMetric.stretchGoal); } setOrdinalValuesInForm (keyResultOrdinal: KeyResultOrdinal) { - this.keyResultForm.controls['commitZone'].setValue(keyResultOrdinal.commitZone); - this.keyResultForm.controls['targetZone'].setValue(keyResultOrdinal.targetZone); - this.keyResultForm.controls['stretchZone'].setValue(keyResultOrdinal.stretchZone); + this.keyResultForm.controls["commitZone"].setValue(keyResultOrdinal.commitZone); + this.keyResultForm.controls["targetZone"].setValue(keyResultOrdinal.targetZone); + this.keyResultForm.controls["stretchZone"].setValue(keyResultOrdinal.stretchZone); } isTouchedOrDirty (name: string) { return this.keyResultForm.get(name)?.dirty || this.keyResultForm.get(name)?.touched; } - getErrorMessage ( - error: string, field: string, firstNumber: number | null, secondNumber: number | null - ): string { - return field + this.translate.instant('DIALOG_ERRORS.' + error) + getErrorMessage (error: string, field: string, firstNumber: number | null, secondNumber: number | null): string { + return field + this.translate.instant("DIALOG_ERRORS." + error) .format(firstNumber, secondNumber); } @@ -134,13 +134,13 @@ export class KeyResultFormComponent implements OnInit, OnDestroy { invalidOwner (): boolean { return ( - !!this.isTouchedOrDirty('owner') && - (typeof this.keyResultForm.value.owner === 'string' || !this.keyResultForm.value.owner) + !!this.isTouchedOrDirty("owner") && + (typeof this.keyResultForm.value.owner === "string" || !this.keyResultForm.value.owner) ); } getUserNameFromUser (user: User): string { - return user ? getFullNameFromUser(user) : ''; + return user ? getFullNameFromUser(user) : ""; } getKeyResultId (): number | null { diff --git a/frontend/src/app/components/keyresult-detail/keyresult-detail.component.html b/frontend/src/app/components/keyresult-detail/keyresult-detail.component.html index f0d14bda8a..67e37a0f76 100644 --- a/frontend/src/app/components/keyresult-detail/keyresult-detail.component.html +++ b/frontend/src/app/components/keyresult-detail/keyresult-detail.component.html @@ -52,7 +52,7 @@

Confidence

- +

Baseline: {{ keyResultMetric.baseline | unitTransformation: keyResultMetric.unit }} @@ -76,7 +76,7 @@

Confidence

 - +

Commit

diff --git a/frontend/src/app/components/keyresult-detail/keyresult-detail.component.spec.ts b/frontend/src/app/components/keyresult-detail/keyresult-detail.component.spec.ts index 072357901b..dcada23c7d 100644 --- a/frontend/src/app/components/keyresult-detail/keyresult-detail.component.spec.ts +++ b/frontend/src/app/components/keyresult-detail/keyresult-detail.component.spec.ts @@ -1,58 +1,62 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; - -import { KeyresultDetailComponent } from './keyresult-detail.component'; -import { HttpClientTestingModule } from '@angular/common/http/testing'; -import { MatDialogModule } from '@angular/material/dialog'; -import { TranslateModule } from '@ngx-translate/core'; -import { of } from 'rxjs'; -import { keyResult, keyResultWriteableFalse } from '../../shared/testData'; -import { By } from '@angular/platform-browser'; -import { KeyresultService } from '../../services/keyresult.service'; -import { MatIconModule } from '@angular/material/icon'; -import { ActivatedRoute } from '@angular/router'; -import { ScoringComponent } from '../../shared/custom/scoring/scoring.component'; -import { ConfidenceComponent } from '../confidence/confidence.component'; -import { RefreshDataService } from '../../services/refresh-data.service'; +import { ComponentFixture, TestBed } from "@angular/core/testing"; + +import { KeyresultDetailComponent } from "./keyresult-detail.component"; +import { HttpClientTestingModule } from "@angular/common/http/testing"; +import { MatDialogModule } from "@angular/material/dialog"; +import { TranslateModule } from "@ngx-translate/core"; +import { of } from "rxjs"; +import { keyResult, keyResultWriteableFalse } from "../../shared/testData"; +import { By } from "@angular/platform-browser"; +import { KeyresultService } from "../../services/keyresult.service"; +import { MatIconModule } from "@angular/material/icon"; +import { ActivatedRoute } from "@angular/router"; +import { ScoringComponent } from "../../shared/custom/scoring/scoring.component"; +import { ConfidenceComponent } from "../confidence/confidence.component"; +import { RefreshDataService } from "../../services/refresh-data.service"; const keyResultServiceMock = { - getFullKeyResult: jest.fn() + "getFullKeyResult": jest.fn() }; const activatedRouteMock = { - snapshot: { - paramMap: { - get: jest.fn() + "snapshot": { + "paramMap": { + "get": jest.fn() } } }; -describe('KeyresultDetailComponent', () => { +describe("KeyresultDetailComponent", () => { let component: KeyresultDetailComponent; let fixture: ComponentFixture; beforeEach(async () => { await TestBed.configureTestingModule({ - imports: [ + "imports": [ HttpClientTestingModule, MatDialogModule, MatIconModule, TranslateModule.forRoot() ], - declarations: [KeyresultDetailComponent, + "declarations": [ + KeyresultDetailComponent, ScoringComponent, - ConfidenceComponent], - providers: [{ - provide: KeyresultService, - useValue: keyResultServiceMock - }, - { - provide: ActivatedRoute, - useValue: activatedRouteMock - }] + ConfidenceComponent + ], + "providers": [ + { + "provide": KeyresultService, + "useValue": keyResultServiceMock + }, + { + "provide": ActivatedRoute, + "useValue": activatedRouteMock + } + ] }) .compileComponents(); - jest.spyOn(keyResultServiceMock, 'getFullKeyResult') + jest.spyOn(keyResultServiceMock, "getFullKeyResult") .mockReturnValue(of(keyResult)); activatedRouteMock.snapshot.paramMap.get.mockReturnValue(of(1)); @@ -61,60 +65,60 @@ describe('KeyresultDetailComponent', () => { fixture.detectChanges(); }); - it('should create', () => { + it("should create", () => { expect(component) .toBeTruthy(); }); - it('should throw error when id is undefined', () => { + it("should throw error when id is undefined", () => { activatedRouteMock.snapshot.paramMap.get.mockReturnValue(undefined); expect(() => component.ngOnInit()) - .toThrowError('keyresult id is undefined'); + .toThrowError("keyresult id is undefined"); }); - it('should display edit keyresult button if writeable is true', async () => { - const button = fixture.debugElement.query(By.css('[data-testId="edit-keyResult"]')); + it("should display edit keyresult button if writeable is true", async () => { + const button = fixture.debugElement.query(By.css("[data-testId=\"edit-keyResult\"]")); expect(button) .toBeTruthy(); }); - it('should not display edit keyresult button if writeable is false', async () => { - jest.spyOn(keyResultServiceMock, 'getFullKeyResult') + it("should not display edit keyresult button if writeable is false", async () => { + jest.spyOn(keyResultServiceMock, "getFullKeyResult") .mockReturnValue(of(keyResultWriteableFalse)); component.ngOnInit(); fixture.detectChanges(); - const button = fixture.debugElement.query(By.css('[data-testId="edit-keyResult"]')); + const button = fixture.debugElement.query(By.css("[data-testId=\"edit-keyResult\"]")); expect(button) .toBeFalsy(); }); - it('should display add check-in button if writeable is true', async () => { - const button = fixture.debugElement.query(By.css('[data-testId="add-check-in"]')); + it("should display add check-in button if writeable is true", async () => { + const button = fixture.debugElement.query(By.css("[data-testId=\"add-check-in\"]")); expect(button) .toBeTruthy(); }); - it('should not display add check-in button if writeable is false', async () => { - jest.spyOn(keyResultServiceMock, 'getFullKeyResult') + it("should not display add check-in button if writeable is false", async () => { + jest.spyOn(keyResultServiceMock, "getFullKeyResult") .mockReturnValue(of(keyResultWriteableFalse)); component.ngOnInit(); fixture.detectChanges(); - const button = fixture.debugElement.query(By.css('[data-testId="add-check-in"]')); + const button = fixture.debugElement.query(By.css("[data-testId=\"add-check-in\"]")); expect(button) .toBeFalsy(); }); - it('should trigger observable when subject gets next value', () => { - const spy = jest.spyOn(component, 'loadKeyResult'); + it("should trigger observable when subject gets next value", () => { + const spy = jest.spyOn(component, "loadKeyResult"); const refreshDataService = TestBed.inject(RefreshDataService); refreshDataService.reloadKeyResultSubject.next(); expect(spy) .toHaveBeenCalled(); }); - it('should close subscription on destroy', () => { - const spyNext = jest.spyOn(component.ngDestroy$, 'next'); - const spyComplete = jest.spyOn(component.ngDestroy$, 'complete'); + it("should close subscription on destroy", () => { + const spyNext = jest.spyOn(component.ngDestroy$, "next"); + const spyComplete = jest.spyOn(component.ngDestroy$, "complete"); component.ngOnDestroy(); diff --git a/frontend/src/app/components/keyresult-detail/keyresult-detail.component.ts b/frontend/src/app/components/keyresult-detail/keyresult-detail.component.ts index 382f239a3f..0184dea8bb 100644 --- a/frontend/src/app/components/keyresult-detail/keyresult-detail.component.ts +++ b/frontend/src/app/components/keyresult-detail/keyresult-detail.component.ts @@ -1,28 +1,28 @@ -import { ChangeDetectionStrategy, Component, Input, OnDestroy, OnInit } from '@angular/core'; -import { KeyResult } from '../../shared/types/model/KeyResult'; -import { KeyresultService } from '../../services/keyresult.service'; -import { KeyResultMetric } from '../../shared/types/model/KeyResultMetric'; -import { KeyResultOrdinal } from '../../shared/types/model/KeyResultOrdinal'; -import { CheckInHistoryDialogComponent } from '../check-in-history-dialog/check-in-history-dialog.component'; -import { BehaviorSubject, catchError, EMPTY, Subject, takeUntil } from 'rxjs'; -import { ActivatedRoute, Router } from '@angular/router'; -import { RefreshDataService } from '../../services/refresh-data.service'; -import { CloseState } from '../../shared/types/enums/CloseState'; -import { CheckInFormComponent } from '../checkin/check-in-form/check-in-form.component'; -import { State } from '../../shared/types/enums/State'; -import { DATE_FORMAT } from '../../shared/constantLibary'; -import { calculateCurrentPercentage, isLastCheckInNegative } from '../../shared/common'; -import { KeyresultDialogComponent } from '../keyresult-dialog/keyresult-dialog.component'; -import { DialogService } from '../../services/dialog.service'; -import { KeyresultMin } from '../../shared/types/model/KeyresultMin'; -import { KeyResultMetricMin } from '../../shared/types/model/KeyResultMetricMin'; -import { KeyResultOrdinalMin } from '../../shared/types/model/KeyResultOrdinalMin'; +import { ChangeDetectionStrategy, Component, Input, OnDestroy, OnInit } from "@angular/core"; +import { KeyResult } from "../../shared/types/model/KeyResult"; +import { KeyresultService } from "../../services/keyresult.service"; +import { KeyResultMetric } from "../../shared/types/model/KeyResultMetric"; +import { KeyResultOrdinal } from "../../shared/types/model/KeyResultOrdinal"; +import { CheckInHistoryDialogComponent } from "../check-in-history-dialog/check-in-history-dialog.component"; +import { BehaviorSubject, catchError, EMPTY, Subject, takeUntil } from "rxjs"; +import { ActivatedRoute, Router } from "@angular/router"; +import { RefreshDataService } from "../../services/refresh-data.service"; +import { CloseState } from "../../shared/types/enums/CloseState"; +import { CheckInFormComponent } from "../checkin/check-in-form/check-in-form.component"; +import { State } from "../../shared/types/enums/State"; +import { DATE_FORMAT } from "../../shared/constantLibary"; +import { calculateCurrentPercentage, isLastCheckInNegative } from "../../shared/common"; +import { KeyresultDialogComponent } from "../keyresult-dialog/keyresult-dialog.component"; +import { DialogService } from "../../services/dialog.service"; +import { KeyresultMin } from "../../shared/types/model/KeyresultMin"; +import { KeyResultMetricMin } from "../../shared/types/model/KeyResultMetricMin"; +import { KeyResultOrdinalMin } from "../../shared/types/model/KeyResultOrdinalMin"; @Component({ - selector: 'app-keyresult-detail', - templateUrl: './keyresult-detail.component.html', - styleUrls: ['./keyresult-detail.component.scss'], - changeDetection: ChangeDetectionStrategy.OnPush + "selector": "app-keyresult-detail", + "templateUrl": "./keyresult-detail.component.html", + "styleUrls": ["./keyresult-detail.component.scss"], + "changeDetection": ChangeDetectionStrategy.OnPush }) export class KeyresultDetailComponent implements OnInit, OnDestroy { @Input() keyResultId!: number; @@ -60,9 +60,9 @@ export class KeyresultDetailComponent implements OnInit, OnDestroy { } private getIdFromParams (): number { - const id = this.route.snapshot.paramMap.get('id'); + const id = this.route.snapshot.paramMap.get("id"); if (!id) { - throw Error('keyresult id is undefined'); + throw Error("keyresult id is undefined"); } return parseInt(id); } @@ -74,7 +74,7 @@ export class KeyresultDetailComponent implements OnInit, OnDestroy { .subscribe((keyResult) => { this.keyResult$.next(keyResult); const state = keyResult.objective.state; - this.isComplete = state === ('SUCCESSFUL' as State) || state === ('NOTSUCCESSFUL' as State); + this.isComplete = state === ("SUCCESSFUL" as State) || state === ("NOTSUCCESSFUL" as State); }); } @@ -88,9 +88,9 @@ export class KeyresultDetailComponent implements OnInit, OnDestroy { checkInHistory () { const dialogRef = this.dialogService.open(CheckInHistoryDialogComponent, { - data: { - keyResult: this.keyResult$.getValue(), - isComplete: this.isComplete + "data": { + "keyResult": this.keyResult$.getValue(), + "isComplete": this.isComplete } }); dialogRef.afterClosed() @@ -102,9 +102,9 @@ export class KeyresultDetailComponent implements OnInit, OnDestroy { openEditKeyResultDialog (keyResult: KeyResult) { this.dialogService .open(KeyresultDialogComponent, { - data: { - objective: keyResult.objective, - keyResult: keyResult + "data": { + "objective": keyResult.objective, + "keyResult": keyResult } }) .afterClosed() @@ -113,7 +113,7 @@ export class KeyresultDetailComponent implements OnInit, OnDestroy { this.loadKeyResult(result.id); this.refreshDataService.markDataRefresh(); } else if (result?.closeState === CloseState.DELETED) { - this.router.navigate(['']) + this.router.navigate([""]) .then(() => this.refreshDataService.markDataRefresh()); } else { this.loadKeyResult(this.keyResult$.getValue().id); @@ -122,9 +122,9 @@ export class KeyresultDetailComponent implements OnInit, OnDestroy { } checkForDraftState (keyResult: KeyResult) { - if (keyResult.objective.state.toUpperCase() === 'DRAFT') { + if (keyResult.objective.state.toUpperCase() === "DRAFT") { this.dialogService - .openConfirmDialog('CONFIRMATION.DRAFT_CREATE') + .openConfirmDialog("CONFIRMATION.DRAFT_CREATE") .afterClosed() .subscribe((result) => { if (result) { @@ -138,8 +138,8 @@ export class KeyresultDetailComponent implements OnInit, OnDestroy { openCheckInForm () { const dialogRef = this.dialogService.open(CheckInFormComponent, { - data: { - keyResult: this.keyResult$.getValue() + "data": { + "keyResult": this.keyResult$.getValue() } }); dialogRef.afterClosed() @@ -150,11 +150,11 @@ export class KeyresultDetailComponent implements OnInit, OnDestroy { } backToOverview () { - this.router.navigate(['']); + this.router.navigate([""]); } getKeyResultWithCorrectType (keyResult: KeyResult): KeyResultOrdinalMin | KeyResultMetricMin { - if (keyResult.keyResultType === 'metric') { + if (keyResult.keyResultType === "metric") { return keyResult as KeyresultMin as KeyResultMetricMin; } else { return keyResult as KeyresultMin as KeyResultOrdinalMin; diff --git a/frontend/src/app/components/keyresult-dialog/keyresult-dialog.component.spec.ts b/frontend/src/app/components/keyresult-dialog/keyresult-dialog.component.spec.ts index fffc4a399c..4133b18da1 100644 --- a/frontend/src/app/components/keyresult-dialog/keyresult-dialog.component.spec.ts +++ b/frontend/src/app/components/keyresult-dialog/keyresult-dialog.component.spec.ts @@ -1,42 +1,42 @@ -import { KeyresultDialogComponent } from './keyresult-dialog.component'; -import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; -import { KeyresultService } from '../../services/keyresult.service'; -import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog'; -import { NoopAnimationsModule } from '@angular/platform-browser/animations'; -import { MatInputModule } from '@angular/material/input'; -import { ReactiveFormsModule } from '@angular/forms'; -import { MatIconModule } from '@angular/material/icon'; -import { By } from '@angular/platform-browser'; -import { testUser, users } from '../../shared/testData'; -import { State } from '../../shared/types/enums/State'; -import { KeyResult } from '../../shared/types/model/KeyResult'; -import { of } from 'rxjs'; -import { MatAutocompleteModule } from '@angular/material/autocomplete'; -import { MatSelectModule } from '@angular/material/select'; -import { MatRadioModule } from '@angular/material/radio'; -import { KeyResultObjective } from '../../shared/types/model/KeyResultObjective'; -import { OAuthService } from 'angular-oauth2-oidc'; -import { KeyresultTypeComponent } from '../keyresult-type/keyresult-type.component'; -import { ActionPlanComponent } from '../action-plan/action-plan.component'; -import { TranslateModule, TranslateService } from '@ngx-translate/core'; -import { DragDropModule } from '@angular/cdk/drag-drop'; -import { UserService } from '../../services/user.service'; -import { KeyResultFormComponent } from '../key-result-form/key-result-form.component'; -import { provideRouter } from '@angular/router'; -import { provideHttpClient } from '@angular/common/http'; -import { provideHttpClientTesting } from '@angular/common/http/testing'; -import { MatDividerModule } from '@angular/material/divider'; -import { DialogTemplateCoreComponent } from '../../shared/custom/dialog-template-core/dialog-template-core.component'; -import { Quarter } from '../../shared/types/model/Quarter'; - -describe('KeyresultDialogComponent', () => { +import { KeyresultDialogComponent } from "./keyresult-dialog.component"; +import { ComponentFixture, TestBed, waitForAsync } from "@angular/core/testing"; +import { KeyresultService } from "../../services/keyresult.service"; +import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from "@angular/material/dialog"; +import { NoopAnimationsModule } from "@angular/platform-browser/animations"; +import { MatInputModule } from "@angular/material/input"; +import { ReactiveFormsModule } from "@angular/forms"; +import { MatIconModule } from "@angular/material/icon"; +import { By } from "@angular/platform-browser"; +import { testUser, users } from "../../shared/testData"; +import { State } from "../../shared/types/enums/State"; +import { KeyResult } from "../../shared/types/model/KeyResult"; +import { of } from "rxjs"; +import { MatAutocompleteModule } from "@angular/material/autocomplete"; +import { MatSelectModule } from "@angular/material/select"; +import { MatRadioModule } from "@angular/material/radio"; +import { KeyResultObjective } from "../../shared/types/model/KeyResultObjective"; +import { OAuthService } from "angular-oauth2-oidc"; +import { KeyresultTypeComponent } from "../keyresult-type/keyresult-type.component"; +import { ActionPlanComponent } from "../action-plan/action-plan.component"; +import { TranslateModule, TranslateService } from "@ngx-translate/core"; +import { DragDropModule } from "@angular/cdk/drag-drop"; +import { UserService } from "../../services/user.service"; +import { KeyResultFormComponent } from "../key-result-form/key-result-form.component"; +import { provideRouter } from "@angular/router"; +import { provideHttpClient } from "@angular/common/http"; +import { provideHttpClientTesting } from "@angular/common/http/testing"; +import { MatDividerModule } from "@angular/material/divider"; +import { DialogTemplateCoreComponent } from "../../shared/custom/dialog-template-core/dialog-template-core.component"; +import { Quarter } from "../../shared/types/model/Quarter"; + +describe("KeyresultDialogComponent", () => { let component: KeyresultDialogComponent; let fixture: ComponentFixture; let keyResultService: KeyresultService; const oauthMockService = { getIdentityClaims () { - return { name: users[1].firstname + ' ' + users[1].lastname }; + return { "name": users[1].firstname + " " + users[1].lastname }; } }; @@ -44,215 +44,221 @@ describe('KeyresultDialogComponent', () => { getUsers () { return of(users); }, - getCurrentUser: jest.fn() + "getCurrentUser": jest.fn() }; const fullObjective = { - id: 1, - title: 'Das ist ein Objective', - description: 'Das ist die Beschreibung', - state: State.ONGOING, - team: { id: 1, - name: 'Das Puzzle Team' }, - quarter: { id: 1, - label: 'GJ 22/23-Q2' } + "id": 1, + "title": "Das ist ein Objective", + "description": "Das ist die Beschreibung", + "state": State.ONGOING, + "team": { "id": 1, + "name": "Das Puzzle Team" }, + "quarter": { "id": 1, + "label": "GJ 22/23-Q2" } }; const keyResultObjective: KeyResultObjective = { - id: 2, - state: State.ONGOING, - quarter: new Quarter( - 1, 'GJ 22/23-Q2', new Date(), new Date() - ) + "id": 2, + "state": State.ONGOING, + "quarter": new Quarter(1, "GJ 22/23-Q2", new Date(), new Date()) }; const fullKeyResultMetric = { - id: 3, - version: 2, - actionList: [{ - id: 1, - action: 'Test', - isChecked: false, - keyResultId: 3, - priority: 0 - }, - { - id: 2, - action: 'Katze', - isChecked: false, - keyResultId: 3, - priority: 1 - }, - { - id: 3, - action: 'Hund', - isChecked: true, - keyResultId: 3, - priority: 2 - }], - title: 'Der Titel ist hier', - description: 'Die Beschreibung', - owner: testUser, - objective: keyResultObjective, - baseline: 3, - keyResultType: 'metric', - stretchGoal: 25, - unit: 'CHF' + "id": 3, + "version": 2, + "actionList": [ + { + "id": 1, + "action": "Test", + "isChecked": false, + "keyResultId": 3, + "priority": 0 + }, + { + "id": 2, + "action": "Katze", + "isChecked": false, + "keyResultId": 3, + "priority": 1 + }, + { + "id": 3, + "action": "Hund", + "isChecked": true, + "keyResultId": 3, + "priority": 2 + } + ], + "title": "Der Titel ist hier", + "description": "Die Beschreibung", + "owner": testUser, + "objective": keyResultObjective, + "baseline": 3, + "keyResultType": "metric", + "stretchGoal": 25, + "unit": "CHF" }; const receivedKeyResultMetric = { - id: 3, - version: 2, - actionList: [{ - id: 1, - action: 'Test', - isChecked: false, - keyResultId: 3, - priority: 0 - }, - { - id: 2, - action: 'Katze', - isChecked: false, - keyResultId: 3, - priority: 1 - }, - { - id: 3, - action: 'Hund', - isChecked: true, - keyResultId: 3, - priority: 2 - }], - title: 'Der Titel ist hier', - description: 'Die Beschreibung', - owner: testUser, - objective: keyResultObjective, - baseline: 3, - keyResultType: 'metric', - stretchGoal: 25, - unit: 'CHF', - commitZone: null, - targetZone: null, - stretchZone: null + "id": 3, + "version": 2, + "actionList": [ + { + "id": 1, + "action": "Test", + "isChecked": false, + "keyResultId": 3, + "priority": 0 + }, + { + "id": 2, + "action": "Katze", + "isChecked": false, + "keyResultId": 3, + "priority": 1 + }, + { + "id": 3, + "action": "Hund", + "isChecked": true, + "keyResultId": 3, + "priority": 2 + } + ], + "title": "Der Titel ist hier", + "description": "Die Beschreibung", + "owner": testUser, + "objective": keyResultObjective, + "baseline": 3, + "keyResultType": "metric", + "stretchGoal": 25, + "unit": "CHF", + "commitZone": null, + "targetZone": null, + "stretchZone": null }; const fullKeyResultOrdinal = { - id: 6, - version: 2, - actionList: [{ - id: 1, - action: 'Test', - isChecked: false, - keyResultId: 3, - priority: 0 - }, - { - id: 2, - action: 'Katze', - isChecked: false, - keyResultId: 3, - priority: 1 - }, - { - id: 3, - action: 'Hund', - isChecked: true, - keyResultId: 3, - priority: 2 - }], - title: 'Der Titel ist hier', - description: 'Die Beschreibung', - owner: testUser, - objective: keyResultObjective, - keyResultType: 'ordinal', - commitZone: 'Commit zone', - targetZone: 'Target zone', - stretchZone: 'Stretch goal' + "id": 6, + "version": 2, + "actionList": [ + { + "id": 1, + "action": "Test", + "isChecked": false, + "keyResultId": 3, + "priority": 0 + }, + { + "id": 2, + "action": "Katze", + "isChecked": false, + "keyResultId": 3, + "priority": 1 + }, + { + "id": 3, + "action": "Hund", + "isChecked": true, + "keyResultId": 3, + "priority": 2 + } + ], + "title": "Der Titel ist hier", + "description": "Die Beschreibung", + "owner": testUser, + "objective": keyResultObjective, + "keyResultType": "ordinal", + "commitZone": "Commit zone", + "targetZone": "Target zone", + "stretchZone": "Stretch goal" }; const receivedKeyResultOrdinal = { - id: 6, - version: 2, - actionList: [{ - id: 1, - action: 'Test', - isChecked: false, - keyResultId: 3, - priority: 0 - }, - { - id: 2, - action: 'Katze', - isChecked: false, - keyResultId: 3, - priority: 1 - }, - { - id: 3, - action: 'Hund', - isChecked: true, - keyResultId: 3, - priority: 2 - }], - title: 'Der Titel ist hier', - description: 'Die Beschreibung', - owner: testUser, - objective: keyResultObjective, - keyResultType: 'ordinal', - commitZone: 'Commit zone', - targetZone: 'Target zone', - stretchZone: 'Stretch goal', - baseline: null, - stretchGoal: null, - unit: null + "id": 6, + "version": 2, + "actionList": [ + { + "id": 1, + "action": "Test", + "isChecked": false, + "keyResultId": 3, + "priority": 0 + }, + { + "id": 2, + "action": "Katze", + "isChecked": false, + "keyResultId": 3, + "priority": 1 + }, + { + "id": 3, + "action": "Hund", + "isChecked": true, + "keyResultId": 3, + "priority": 2 + } + ], + "title": "Der Titel ist hier", + "description": "Die Beschreibung", + "owner": testUser, + "objective": keyResultObjective, + "keyResultType": "ordinal", + "commitZone": "Commit zone", + "targetZone": "Target zone", + "stretchZone": "Stretch goal", + "baseline": null, + "stretchGoal": null, + "unit": null }; const initKeyResult = { - id: undefined, - title: '', - description: '', - owner: testUser, - objective: fullObjective, - baseline: 3, - keyResultType: 'metric', - stretchGoal: 25, - unit: 'CHF', - commitZone: null, - targetZone: null, - stretchZone: null, - actionList: [] + "id": undefined, + "title": "", + "description": "", + "owner": testUser, + "objective": fullObjective, + "baseline": 3, + "keyResultType": "metric", + "stretchGoal": 25, + "unit": "CHF", + "commitZone": null, + "targetZone": null, + "stretchZone": null, + "actionList": [] }; const savedKeyResult = { - id: undefined, - version: undefined, - title: 'Neuer Titel', - description: 'Description', - owner: testUser, - objective: fullObjective, - baseline: 3, - keyResultType: 'metric', - stretchGoal: 25, - unit: 'CHF', - commitZone: null, - targetZone: null, - stretchZone: null, - actionList: [] + "id": undefined, + "version": undefined, + "title": "Neuer Titel", + "description": "Description", + "owner": testUser, + "objective": fullObjective, + "baseline": 3, + "keyResultType": "metric", + "stretchGoal": 25, + "unit": "CHF", + "commitZone": null, + "targetZone": null, + "stretchZone": null, + "actionList": [] }; const matDialogRefMock = { - close: jest.fn() + "close": jest.fn() }; const mockUserService = { - getUsers: jest.fn() + "getUsers": jest.fn() }; - describe('New KeyResult', () => { + describe("New KeyResult", () => { beforeEach(() => { TestBed.configureTestingModule({ - imports: [ + "imports": [ MatDialogModule, NoopAnimationsModule, MatSelectModule, @@ -265,29 +271,29 @@ describe('KeyresultDialogComponent', () => { DragDropModule, MatDividerModule ], - providers: [ + "providers": [ provideRouter([]), provideHttpClient(), provideHttpClientTesting(), KeyresultService, TranslateService, - { provide: UserService, - useValue: userService }, + { "provide": UserService, + "useValue": userService }, { - provide: MatDialogRef, - useValue: matDialogRefMock + "provide": MatDialogRef, + "useValue": matDialogRefMock }, { - provide: MAT_DIALOG_DATA, - useValue: { objective: fullObjective, - keyResult: undefined } + "provide": MAT_DIALOG_DATA, + "useValue": { "objective": fullObjective, + "keyResult": undefined } }, { - provide: OAuthService, - useValue: oauthMockService + "provide": OAuthService, + "useValue": oauthMockService } ], - declarations: [ + "declarations": [ KeyresultDialogComponent, KeyResultFormComponent, KeyresultTypeComponent, @@ -306,107 +312,107 @@ describe('KeyresultDialogComponent', () => { keyResultService = TestBed.inject(KeyresultService); }); - it('should create', () => { + it("should create", () => { expect(component) .toBeTruthy(); }); - it('should be able to set title', waitForAsync(async () => { + it("should be able to set title", waitForAsync(async () => { component.keyResultForm.setValue({ - owner: null, - actionList: [], - title: 'Title', - baseline: 0, - stretchZone: null, - targetZone: null, - commitZone: null, - unit: 'FTE', - description: null, - stretchGoal: 0, - keyResultType: 'metric' + "owner": null, + "actionList": [], + "title": "Title", + "baseline": 0, + "stretchZone": null, + "targetZone": null, + "commitZone": null, + "unit": "FTE", + "description": null, + "stretchGoal": 0, + "keyResultType": "metric" }); fixture.detectChanges(); - const submitButton = fixture.debugElement.query(By.css('[data-testId="submit"]')); - expect(await submitButton.nativeElement.getAttribute('disabled')) + const submitButton = fixture.debugElement.query(By.css("[data-testId=\"submit\"]")); + expect(await submitButton.nativeElement.getAttribute("disabled")) .toBeFalsy(); const formObject = component.keyResultForm.value; expect(formObject.title) - .toBe('Title'); + .toBe("Title"); expect(formObject.description) .toBe(null); })); - it('should display error message of too short input', waitForAsync(async () => { + it("should display error message of too short input", waitForAsync(async () => { component.keyResultForm.setValue({ - owner: testUser, - actionList: [], - title: 'T', - baseline: null, - stretchZone: null, - targetZone: null, - commitZone: null, - unit: null, - description: '', - stretchGoal: null, - keyResultType: null + "owner": testUser, + "actionList": [], + "title": "T", + "baseline": null, + "stretchZone": null, + "targetZone": null, + "commitZone": null, + "unit": null, + "description": "", + "stretchGoal": null, + "keyResultType": null }); fixture.detectChanges(); - const submitButton = fixture.debugElement.query(By.css('[data-testId="submit"]')); - expect(await submitButton.nativeElement.getAttribute('disabled')) - .toEqual(''); + const submitButton = fixture.debugElement.query(By.css("[data-testId=\"submit\"]")); + expect(await submitButton.nativeElement.getAttribute("disabled")) + .toEqual(""); expect(component.keyResultForm.invalid) .toBeTruthy(); - expect(component.keyResultForm.get('title')!.errors?.['minlength']) + expect(component.keyResultForm.get("title")!.errors?.["minlength"]) .toBeTruthy(); })); - it('should display error message of required', waitForAsync(async () => { + it("should display error message of required", waitForAsync(async () => { component.keyResultForm.setValue({ - owner: testUser, - actionList: [], - title: null, - baseline: null, - stretchZone: null, - targetZone: null, - commitZone: null, - unit: null, - description: '', - stretchGoal: null, - keyResultType: null + "owner": testUser, + "actionList": [], + "title": null, + "baseline": null, + "stretchZone": null, + "targetZone": null, + "commitZone": null, + "unit": null, + "description": "", + "stretchGoal": null, + "keyResultType": null }); fixture.detectChanges(); - const submitButton = fixture.debugElement.query(By.css('[data-testId="submit"]')); - expect(await submitButton.nativeElement.getAttribute('disabled')) - .toEqual(''); + const submitButton = fixture.debugElement.query(By.css("[data-testId=\"submit\"]")); + expect(await submitButton.nativeElement.getAttribute("disabled")) + .toEqual(""); expect(component.keyResultForm.invalid) .toBeTruthy(); - expect(component.keyResultForm.get('title')!.errors?.['required']) + expect(component.keyResultForm.get("title")!.errors?.["required"]) .toBeTruthy(); })); - it('should call service save method', waitForAsync(() => { - const spy = jest.spyOn(keyResultService, 'saveKeyResult'); - spy.mockImplementation(() => of({ id: 2 } as KeyResult)); + it("should call service save method", waitForAsync(() => { + const spy = jest.spyOn(keyResultService, "saveKeyResult"); + spy.mockImplementation(() => of({ "id": 2 } as KeyResult)); component.keyResultForm.setValue({ - owner: testUser, - actionList: [], - title: 'Neuer Titel', - baseline: 3, - stretchZone: null, - targetZone: null, - commitZone: null, - unit: 'CHF', - description: 'Description', - stretchGoal: 25, - keyResultType: 'metric' + "owner": testUser, + "actionList": [], + "title": "Neuer Titel", + "baseline": 3, + "stretchZone": null, + "targetZone": null, + "commitZone": null, + "unit": "CHF", + "description": "Description", + "stretchGoal": 25, + "keyResultType": "metric" }); - initKeyResult.title = 'Neuer Titel'; - initKeyResult.description = 'Description'; + initKeyResult.title = "Neuer Titel"; + initKeyResult.description = "Description"; component.saveKeyResult(); @@ -417,11 +423,11 @@ describe('KeyresultDialogComponent', () => { })); }); - describe('Edit KeyResult Metric', () => { + describe("Edit KeyResult Metric", () => { beforeEach(() => { mockUserService.getUsers.mockReturnValue(users); TestBed.configureTestingModule({ - imports: [ + "imports": [ MatDialogModule, NoopAnimationsModule, MatInputModule, @@ -432,28 +438,28 @@ describe('KeyresultDialogComponent', () => { TranslateModule.forRoot(), MatDividerModule ], - providers: [ + "providers": [ provideRouter([]), provideHttpClient(), provideHttpClientTesting(), KeyresultService, { - provide: MatDialogRef, - useValue: { - close: () => {} + "provide": MatDialogRef, + "useValue": { + "close": () => {} } }, { - provide: OAuthService, - useValue: oauthMockService + "provide": OAuthService, + "useValue": oauthMockService }, { - provide: MAT_DIALOG_DATA, - useValue: { keyResult: fullKeyResultMetric, - objective: keyResultObjective } + "provide": MAT_DIALOG_DATA, + "useValue": { "keyResult": fullKeyResultMetric, + "objective": keyResultObjective } } ], - declarations: [ + "declarations": [ KeyresultDialogComponent, KeyResultFormComponent, DialogTemplateCoreComponent, @@ -474,96 +480,96 @@ describe('KeyresultDialogComponent', () => { mockUserService.getUsers.mockReset(); }); - it('should use KeyResult value from data input', waitForAsync(() => { + it("should use KeyResult value from data input", waitForAsync(() => { const formObject = fixture.componentInstance.keyResultForm.value; expect(formObject.title) - .toBe('Der Titel ist hier'); + .toBe("Der Titel ist hier"); expect(formObject.description) - .toBe('Die Beschreibung'); + .toBe("Die Beschreibung"); expect(formObject.owner) .toBe(testUser); })); - it('should be able to set title and description', waitForAsync(async () => { + it("should be able to set title and description", waitForAsync(async () => { expect(component.keyResultForm.value.title) - .toEqual('Der Titel ist hier'); + .toEqual("Der Titel ist hier"); expect(component.keyResultForm.value.description) - .toEqual('Die Beschreibung'); + .toEqual("Die Beschreibung"); component.keyResultForm.setValue({ - owner: testUser, - actionList: [], - title: 'Title', - baseline: 0, - stretchZone: '', - targetZone: '', - commitZone: '', - unit: 'FTE', - description: 'Description', - stretchGoal: 0, - keyResultType: 'metric' + "owner": testUser, + "actionList": [], + "title": "Title", + "baseline": 0, + "stretchZone": "", + "targetZone": "", + "commitZone": "", + "unit": "FTE", + "description": "Description", + "stretchGoal": 0, + "keyResultType": "metric" }); fixture.detectChanges(); - const submitButton = fixture.debugElement.query(By.css('[data-testId="submit"]')); - expect(await submitButton.nativeElement.getAttribute('disabled')) + const submitButton = fixture.debugElement.query(By.css("[data-testId=\"submit\"]")); + expect(await submitButton.nativeElement.getAttribute("disabled")) .toBeFalsy(); const formObject = fixture.componentInstance.keyResultForm.value; expect(formObject.title) - .toBe('Title'); + .toBe("Title"); expect(formObject.description) - .toBe('Description'); + .toBe("Description"); expect(component.keyResultForm.invalid) .toBeFalsy(); })); - it('should display error message of too short input', waitForAsync(async () => { + it("should display error message of too short input", waitForAsync(async () => { component.keyResultForm.setValue({ - owner: testUser, - actionList: [], - title: 'T', - baseline: null, - stretchZone: null, - targetZone: null, - commitZone: null, - unit: null, - description: '', - stretchGoal: null, - keyResultType: null + "owner": testUser, + "actionList": [], + "title": "T", + "baseline": null, + "stretchZone": null, + "targetZone": null, + "commitZone": null, + "unit": null, + "description": "", + "stretchGoal": null, + "keyResultType": null }); fixture.detectChanges(); expect(component.keyResultForm.invalid) .toBeTruthy(); - expect(component.keyResultForm.get('title')!.errors?.['minlength']) + expect(component.keyResultForm.get("title")!.errors?.["minlength"]) .toBeTruthy(); })); - it('should display error message of required', waitForAsync(async () => { + it("should display error message of required", waitForAsync(async () => { component.keyResultForm.setValue({ - owner: testUser, - actionList: [], - title: null, - baseline: null, - stretchZone: null, - targetZone: null, - commitZone: null, - unit: null, - description: '', - stretchGoal: null, - keyResultType: null + "owner": testUser, + "actionList": [], + "title": null, + "baseline": null, + "stretchZone": null, + "targetZone": null, + "commitZone": null, + "unit": null, + "description": "", + "stretchGoal": null, + "keyResultType": null }); fixture.detectChanges(); expect(component.keyResultForm.invalid) .toBeTruthy(); - expect(component.keyResultForm.get('title')!.errors?.['required']) + expect(component.keyResultForm.get("title")!.errors?.["required"]) .toBeTruthy(); })); - it('should call service save method', waitForAsync(() => { - const spy = jest.spyOn(keyResultService, 'saveKeyResult'); - spy.mockImplementation(() => of({ id: 2 } as KeyResult)); + it("should call service save method", waitForAsync(() => { + const spy = jest.spyOn(keyResultService, "saveKeyResult"); + spy.mockImplementation(() => of({ "id": 2 } as KeyResult)); component.saveKeyResult(); @@ -573,9 +579,9 @@ describe('KeyresultDialogComponent', () => { .toHaveBeenCalledWith(receivedKeyResultMetric); })); - it('should not display logged in user when editing', waitForAsync(() => { + it("should not display logged in user when editing", waitForAsync(() => { jest.resetAllMocks(); - const userServiceSpy = jest.spyOn(userService, 'getUsers'); + const userServiceSpy = jest.spyOn(userService, "getUsers"); fixture.detectChanges(); expect(userServiceSpy) .toHaveBeenCalledTimes(0); @@ -584,11 +590,11 @@ describe('KeyresultDialogComponent', () => { })); }); - describe('Edit KeyResult Ordinal', () => { + describe("Edit KeyResult Ordinal", () => { beforeEach(() => { mockUserService.getUsers.mockReturnValue(users); TestBed.configureTestingModule({ - imports: [ + "imports": [ MatDialogModule, NoopAnimationsModule, MatInputModule, @@ -599,26 +605,26 @@ describe('KeyresultDialogComponent', () => { TranslateModule.forRoot(), MatDividerModule ], - providers: [ + "providers": [ provideRouter([]), provideHttpClient(), provideHttpClientTesting(), KeyresultService, { - provide: MatDialogRef, - useValue: matDialogRefMock + "provide": MatDialogRef, + "useValue": matDialogRefMock }, { - provide: OAuthService, - useValue: oauthMockService + "provide": OAuthService, + "useValue": oauthMockService }, { - provide: MAT_DIALOG_DATA, - useValue: { keyResult: fullKeyResultOrdinal, - objective: keyResultObjective } + "provide": MAT_DIALOG_DATA, + "useValue": { "keyResult": fullKeyResultOrdinal, + "objective": keyResultObjective } } ], - declarations: [ + "declarations": [ KeyresultDialogComponent, KeyResultFormComponent, DialogTemplateCoreComponent, @@ -638,96 +644,96 @@ describe('KeyresultDialogComponent', () => { mockUserService.getUsers.mockReset(); }); - it('should use KeyResult value from data input', waitForAsync(() => { + it("should use KeyResult value from data input", waitForAsync(() => { const formObject = fixture.componentInstance.keyResultForm.value; expect(formObject.title) - .toBe('Der Titel ist hier'); + .toBe("Der Titel ist hier"); expect(formObject.description) - .toBe('Die Beschreibung'); + .toBe("Die Beschreibung"); expect(formObject.owner) .toBe(testUser); })); - it('should be able to set title and description', waitForAsync(async () => { + it("should be able to set title and description", waitForAsync(async () => { expect(component.keyResultForm.value.title) - .toEqual('Der Titel ist hier'); + .toEqual("Der Titel ist hier"); expect(component.keyResultForm.value.description) - .toEqual('Die Beschreibung'); + .toEqual("Die Beschreibung"); component.keyResultForm.setValue({ - owner: testUser, - actionList: [], - title: 'Title', - baseline: 0, - stretchZone: 'stretchZone', - targetZone: 'targetZone', - commitZone: 'commitZone', - unit: 'FTE', - description: 'Description', - stretchGoal: 0, - keyResultType: 'ordinal' + "owner": testUser, + "actionList": [], + "title": "Title", + "baseline": 0, + "stretchZone": "stretchZone", + "targetZone": "targetZone", + "commitZone": "commitZone", + "unit": "FTE", + "description": "Description", + "stretchGoal": 0, + "keyResultType": "ordinal" }); fixture.detectChanges(); - const submitButton = fixture.debugElement.query(By.css('[data-testId="submit"]')); - expect(await submitButton.nativeElement.getAttribute('disabled')) + const submitButton = fixture.debugElement.query(By.css("[data-testId=\"submit\"]")); + expect(await submitButton.nativeElement.getAttribute("disabled")) .toBeFalsy(); const formObject = fixture.componentInstance.keyResultForm.value; expect(formObject.title) - .toBe('Title'); + .toBe("Title"); expect(formObject.description) - .toBe('Description'); + .toBe("Description"); expect(component.keyResultForm.invalid) .toBeFalsy(); })); - it('should display error message of too short input', waitForAsync(async () => { + it("should display error message of too short input", waitForAsync(async () => { component.keyResultForm.setValue({ - owner: testUser, - actionList: [], - title: 'T', - baseline: 0, - stretchZone: '', - targetZone: '', - commitZone: '', - unit: 'FTE', - description: 'Description', - stretchGoal: 0, - keyResultType: 'metric' + "owner": testUser, + "actionList": [], + "title": "T", + "baseline": 0, + "stretchZone": "", + "targetZone": "", + "commitZone": "", + "unit": "FTE", + "description": "Description", + "stretchGoal": 0, + "keyResultType": "metric" }); fixture.detectChanges(); expect(component.keyResultForm.invalid) .toBeTruthy(); - expect(component.keyResultForm.get('title')!.errors?.['minlength']) + expect(component.keyResultForm.get("title")!.errors?.["minlength"]) .toBeTruthy(); })); - it('should display error message of required', waitForAsync(async () => { + it("should display error message of required", waitForAsync(async () => { component.keyResultForm.setValue({ - owner: testUser, - actionList: [], - title: null, - baseline: null, - stretchZone: null, - targetZone: null, - commitZone: null, - unit: null, - description: '', - stretchGoal: null, - keyResultType: null + "owner": testUser, + "actionList": [], + "title": null, + "baseline": null, + "stretchZone": null, + "targetZone": null, + "commitZone": null, + "unit": null, + "description": "", + "stretchGoal": null, + "keyResultType": null }); fixture.detectChanges(); expect(component.keyResultForm.invalid) .toBeTruthy(); - expect(component.keyResultForm.get('title')!.errors?.['required']) + expect(component.keyResultForm.get("title")!.errors?.["required"]) .toBeTruthy(); })); - it('should call service save method', waitForAsync(() => { - const spy = jest.spyOn(keyResultService, 'saveKeyResult'); - spy.mockImplementation(() => of({ id: 2 } as KeyResult)); + it("should call service save method", waitForAsync(() => { + const spy = jest.spyOn(keyResultService, "saveKeyResult"); + spy.mockImplementation(() => of({ "id": 2 } as KeyResult)); component.saveKeyResult(); diff --git a/frontend/src/app/components/keyresult-dialog/keyresult-dialog.component.ts b/frontend/src/app/components/keyresult-dialog/keyresult-dialog.component.ts index 3abb87855d..82c9ab1521 100644 --- a/frontend/src/app/components/keyresult-dialog/keyresult-dialog.component.ts +++ b/frontend/src/app/components/keyresult-dialog/keyresult-dialog.component.ts @@ -1,82 +1,86 @@ -import { Component, Inject } from '@angular/core'; -import { FormControl, FormGroup, Validators } from '@angular/forms'; -import { User } from '../../shared/types/model/User'; -import { Action } from '../../shared/types/model/Action'; -import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; -import { Objective } from '../../shared/types/model/Objective'; -import { KeyResult } from '../../shared/types/model/KeyResult'; -import { KeyResultMetricDTO } from '../../shared/types/DTOs/KeyResultMetricDTO'; -import { KeyResultOrdinalDTO } from '../../shared/types/DTOs/KeyResultOrdinalDTO'; -import { CloseState } from '../../shared/types/enums/CloseState'; -import { KeyresultService } from '../../services/keyresult.service'; -import { DialogService } from '../../services/dialog.service'; +import { Component, Inject } from "@angular/core"; +import { FormControl, FormGroup, Validators } from "@angular/forms"; +import { User } from "../../shared/types/model/User"; +import { Action } from "../../shared/types/model/Action"; +import { MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog"; +import { Objective } from "../../shared/types/model/Objective"; +import { KeyResult } from "../../shared/types/model/KeyResult"; +import { KeyResultMetricDTO } from "../../shared/types/DTOs/KeyResultMetricDTO"; +import { KeyResultOrdinalDTO } from "../../shared/types/DTOs/KeyResultOrdinalDTO"; +import { CloseState } from "../../shared/types/enums/CloseState"; +import { KeyresultService } from "../../services/keyresult.service"; +import { DialogService } from "../../services/dialog.service"; @Component({ - selector: 'app-keyresult-dialog', - templateUrl: './keyresult-dialog.component.html', - styleUrls: ['./keyresult-dialog.component.scss'] + "selector": "app-keyresult-dialog", + "templateUrl": "./keyresult-dialog.component.html", + "styleUrls": ["./keyresult-dialog.component.scss"] }) export class KeyresultDialogComponent { keyResultForm = new FormGroup({ - title: new FormControl('', [Validators.required, + "title": new FormControl("", [ + Validators.required, Validators.minLength(2), - Validators.maxLength(250)]), - description: new FormControl('', [Validators.maxLength(4096)]), - owner: new FormControl(null, [Validators.required, - Validators.nullValidator]), - actionList: new FormControl([]), - unit: new FormControl(null), - baseline: new FormControl(null), - stretchGoal: new FormControl(null), - commitZone: new FormControl(null), - targetZone: new FormControl(null), - stretchZone: new FormControl(null), - keyResultType: new FormControl('metric') + Validators.maxLength(250) + ]), + "description": new FormControl("", [Validators.maxLength(4096)]), + "owner": new FormControl(null, [ + Validators.required, + Validators.nullValidator + ]), + "actionList": new FormControl([]), + "unit": new FormControl(null), + "baseline": new FormControl(null), + "stretchGoal": new FormControl(null), + "commitZone": new FormControl(null), + "targetZone": new FormControl(null), + "stretchZone": new FormControl(null), + "keyResultType": new FormControl("metric") }); constructor ( - @Inject(MAT_DIALOG_DATA) public data: { objective: Objective; - keyResult: KeyResult; }, + @Inject(MAT_DIALOG_DATA) public data: { "objective": Objective; + "keyResult": KeyResult; }, private keyResultService: KeyresultService, public dialogService: DialogService, public dialogRef: MatDialogRef ) {} isMetricKeyResult () { - return this.keyResultForm.controls['keyResultType'].value === 'metric'; + return this.keyResultForm.controls["keyResultType"].value === "metric"; } saveKeyResult (openNewDialog = false) { const value = this.keyResultForm.value; const keyResult = this.isMetricKeyResult() ? ({ ...value, - objective: this.data.objective } as KeyResultMetricDTO) + "objective": this.data.objective } as KeyResultMetricDTO) : ({ ...value, - objective: this.data.objective, - id: this.data.keyResult?.id } as KeyResultOrdinalDTO); + "objective": this.data.objective, + "id": this.data.keyResult?.id } as KeyResultOrdinalDTO); keyResult.id = this.data.keyResult?.id; keyResult.version = this.data.keyResult?.version!; - keyResult.actionList = keyResult.actionList!.filter((action: Action) => action.action !== ''); + keyResult.actionList = keyResult.actionList!.filter((action: Action) => action.action !== ""); this.keyResultService.saveKeyResult(keyResult) .subscribe((returnValue) => { this.dialogRef.close({ - id: returnValue.id, - version: returnValue.version, - closeState: CloseState.SAVED, - openNew: openNewDialog + "id": returnValue.id, + "version": returnValue.version, + "closeState": CloseState.SAVED, + "openNew": openNewDialog }); }); } deleteKeyResult () { this.dialogService - .openConfirmDialog('CONFIRMATION.DELETE.KEYRESULT') + .openConfirmDialog("CONFIRMATION.DELETE.KEYRESULT") .afterClosed() .subscribe((result) => { if (result) { this.keyResultService .deleteKeyResult(this.data.keyResult.id) - .subscribe(() => this.dialogRef.close({ closeState: CloseState.DELETED })); + .subscribe(() => this.dialogRef.close({ "closeState": CloseState.DELETED })); } }); } @@ -91,12 +95,12 @@ export class KeyresultDialogComponent { invalidOwner (): boolean { return ( - !!this.isTouchedOrDirty('owner') && - (typeof this.keyResultForm.value.owner === 'string' || !this.keyResultForm.value.owner) + !!this.isTouchedOrDirty("owner") && + (typeof this.keyResultForm.value.owner === "string" || !this.keyResultForm.value.owner) ); } getDialogTitle (): string { - return this.data.keyResult ? 'Key Result bearbeiten' : 'Key Result erfassen'; + return this.data.keyResult ? "Key Result bearbeiten" : "Key Result erfassen"; } } diff --git a/frontend/src/app/components/keyresult-type/keyresult-type.component.spec.ts b/frontend/src/app/components/keyresult-type/keyresult-type.component.spec.ts index e42bef5c18..4f6b0bca7f 100644 --- a/frontend/src/app/components/keyresult-type/keyresult-type.component.spec.ts +++ b/frontend/src/app/components/keyresult-type/keyresult-type.component.spec.ts @@ -1,15 +1,15 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; -import * as de from '../../../assets/i18n/de.json'; - -import { KeyresultTypeComponent } from './keyresult-type.component'; -import { KeyResult } from '../../shared/types/model/KeyResult'; -import { keyResultMetric, keyResultOrdinal, testUser } from '../../shared/testData'; -import { TranslateTestingModule } from 'ngx-translate-testing'; -import { By } from '@angular/platform-browser'; -import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms'; -import { User } from '../../shared/types/model/User'; - -describe('KeyresultTypeComponent', () => { +import { ComponentFixture, TestBed } from "@angular/core/testing"; +import * as de from "../../../assets/i18n/de.json"; + +import { KeyresultTypeComponent } from "./keyresult-type.component"; +import { KeyResult } from "../../shared/types/model/KeyResult"; +import { keyResultMetric, keyResultOrdinal, testUser } from "../../shared/testData"; +import { TranslateTestingModule } from "ngx-translate-testing"; +import { By } from "@angular/platform-browser"; +import { FormControl, FormGroup, ReactiveFormsModule, Validators } from "@angular/forms"; +import { User } from "../../shared/types/model/User"; + +describe("KeyresultTypeComponent", () => { let component: KeyresultTypeComponent; let fixture: ComponentFixture; @@ -17,61 +17,75 @@ describe('KeyresultTypeComponent', () => { const ordinalKeyResult: KeyResult = keyResultOrdinal; const metricKeyResultForm = new FormGroup({ - title: new FormControl('100% aller Schweizer Kunden betreuen', [Validators.required, + "title": new FormControl("100% aller Schweizer Kunden betreuen", [ + Validators.required, Validators.minLength(2), - Validators.maxLength(250)]), - description: new FormControl('Puzzle ITC erledigt die IT-Aufträge für 100% aller Unternehmen.', [Validators.maxLength(4096)]), - owner: new FormControl(testUser, [Validators.required, - Validators.nullValidator]), - unit: new FormControl('PERCENT'), - baseline: new FormControl(30), - stretchGoal: new FormControl(100), - commitZone: new FormControl(null), - targetZone: new FormControl(null), - stretchZone: new FormControl(null), - keyResultType: new FormControl('metric') + Validators.maxLength(250) + ]), + "description": new FormControl("Puzzle ITC erledigt die IT-Aufträge für 100% aller Unternehmen.", [Validators.maxLength(4096)]), + "owner": new FormControl(testUser, [ + Validators.required, + Validators.nullValidator + ]), + "unit": new FormControl("PERCENT"), + "baseline": new FormControl(30), + "stretchGoal": new FormControl(100), + "commitZone": new FormControl(null), + "targetZone": new FormControl(null), + "stretchZone": new FormControl(null), + "keyResultType": new FormControl("metric") }); const ordinalKeyResultForm = new FormGroup({ - title: new FormControl('100% aller Schweizer Kunden betreuen', [Validators.required, + "title": new FormControl("100% aller Schweizer Kunden betreuen", [ + Validators.required, Validators.minLength(2), - Validators.maxLength(250)]), - description: new FormControl('Puzzle ITC erledigt die IT-Aufträge für 100% aller Unternehmen.', [Validators.maxLength(4096)]), - owner: new FormControl(testUser, [Validators.required, - Validators.nullValidator]), - unit: new FormControl(null), - baseline: new FormControl(null), - stretchGoal: new FormControl(null), - commitZone: new FormControl('Commit'), - targetZone: new FormControl('Target'), - stretchZone: new FormControl('Stretch'), - keyResultType: new FormControl('metric') + Validators.maxLength(250) + ]), + "description": new FormControl("Puzzle ITC erledigt die IT-Aufträge für 100% aller Unternehmen.", [Validators.maxLength(4096)]), + "owner": new FormControl(testUser, [ + Validators.required, + Validators.nullValidator + ]), + "unit": new FormControl(null), + "baseline": new FormControl(null), + "stretchGoal": new FormControl(null), + "commitZone": new FormControl("Commit"), + "targetZone": new FormControl("Target"), + "stretchZone": new FormControl("Stretch"), + "keyResultType": new FormControl("metric") }); const emptyKeyResultForm = new FormGroup({ - title: new FormControl('100% aller Schweizer Kunden betreuen', [Validators.required, + "title": new FormControl("100% aller Schweizer Kunden betreuen", [ + Validators.required, Validators.minLength(2), - Validators.maxLength(250)]), - description: new FormControl('Puzzle ITC erledigt die IT-Aufträge für 100% aller Unternehmen.', [Validators.maxLength(4096)]), - owner: new FormControl(testUser, [Validators.required, - Validators.nullValidator]), - unit: new FormControl(null), - baseline: new FormControl(null), - stretchGoal: new FormControl(null), - commitZone: new FormControl(null), - targetZone: new FormControl(null), - stretchZone: new FormControl(null), - keyResultType: new FormControl('metric') + Validators.maxLength(250) + ]), + "description": new FormControl("Puzzle ITC erledigt die IT-Aufträge für 100% aller Unternehmen.", [Validators.maxLength(4096)]), + "owner": new FormControl(testUser, [ + Validators.required, + Validators.nullValidator + ]), + "unit": new FormControl(null), + "baseline": new FormControl(null), + "stretchGoal": new FormControl(null), + "commitZone": new FormControl(null), + "targetZone": new FormControl(null), + "stretchZone": new FormControl(null), + "keyResultType": new FormControl("metric") }); - describe('Edit Metric', () => { + describe("Edit Metric", () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [KeyresultTypeComponent], - imports: [TranslateTestingModule.withTranslations({ - de: de - }), - ReactiveFormsModule] + "declarations": [KeyresultTypeComponent], + "imports": [ + TranslateTestingModule.withTranslations({ + "de": de + }), + ReactiveFormsModule + ] }); fixture = TestBed.createComponent(KeyresultTypeComponent); component = fixture.componentInstance; @@ -81,18 +95,18 @@ describe('KeyresultTypeComponent', () => { fixture.detectChanges(); }); - it('should create', () => { + it("should create", () => { expect(component) .toBeTruthy(); }); - it('should use values from input', () => { + it("should use values from input", () => { expect(component.typeChangeAllowed) .toBeTruthy(); expect(component.isMetric) .toBeTruthy(); expect(component.keyResultForm.value.unit) - .toEqual('PERCENT'); + .toEqual("PERCENT"); expect(component.keyResultForm.value.baseline) .toEqual(30); expect(component.keyResultForm.value.stretchGoal) @@ -105,51 +119,53 @@ describe('KeyresultTypeComponent', () => { .toBeNull(); }); - it('should switch type of KeyResult', () => { + it("should switch type of KeyResult", () => { component.isMetric = true; component.typeChangeAllowed = true; - component.switchKeyResultType('metric'); + component.switchKeyResultType("metric"); expect(component.isMetric) .toBeTruthy(); - component.switchKeyResultType('ordinal'); + component.switchKeyResultType("ordinal"); expect(component.isMetric) .toBeFalsy(); component.typeChangeAllowed = false; - component.switchKeyResultType('metric'); + component.switchKeyResultType("metric"); expect(component.isMetric) .toBeFalsy(); }); - it('should select metric tab', () => { + it("should select metric tab", () => { component.isMetric = true; - const activeTab = document.getElementsByClassName('active')[0]; + const activeTab = document.getElementsByClassName("active")[0]; expect(activeTab.innerHTML) - .toContain('Metrisch'); + .toContain("Metrisch"); }); - it('should change to ordinal from html click', () => { + it("should change to ordinal from html click", () => { component.typeChangeAllowed = true; expect(component.isMetric) .toBeTruthy(); - const ordinalTab = fixture.debugElement.query(By.css('[data-testId="ordinalTab"]')); + const ordinalTab = fixture.debugElement.query(By.css("[data-testId=\"ordinalTab\"]")); ordinalTab.nativeElement.click(); expect(component.isMetric) .toBeFalsy(); }); }); - describe('Edit Ordinal', () => { + describe("Edit Ordinal", () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [KeyresultTypeComponent], - imports: [TranslateTestingModule.withTranslations({ - de: de - }), - ReactiveFormsModule] + "declarations": [KeyresultTypeComponent], + "imports": [ + TranslateTestingModule.withTranslations({ + "de": de + }), + ReactiveFormsModule + ] }); fixture = TestBed.createComponent(KeyresultTypeComponent); component = fixture.componentInstance; @@ -159,12 +175,12 @@ describe('KeyresultTypeComponent', () => { fixture.detectChanges(); }); - it('should create', () => { + it("should create", () => { expect(component) .toBeTruthy(); }); - it('should use values from input', () => { + it("should use values from input", () => { expect(component.typeChangeAllowed) .toBeTruthy(); expect(component.keyResultForm.value.unit) @@ -174,60 +190,62 @@ describe('KeyresultTypeComponent', () => { expect(component.keyResultForm.value.stretchGoal) .toBeNull(); expect(component.keyResultForm.value.commitZone) - .toEqual('Commit'); + .toEqual("Commit"); expect(component.keyResultForm.value.targetZone) - .toEqual('Target'); + .toEqual("Target"); expect(component.keyResultForm.value.stretchZone) - .toEqual('Stretch'); + .toEqual("Stretch"); }); - it('should switch type of KeyResult', () => { + it("should switch type of KeyResult", () => { component.isMetric = true; component.typeChangeAllowed = true; - component.switchKeyResultType('metric'); + component.switchKeyResultType("metric"); expect(component.isMetric) .toBeTruthy(); - component.switchKeyResultType('ordinal'); + component.switchKeyResultType("ordinal"); expect(component.isMetric) .toBeFalsy(); component.typeChangeAllowed = false; - component.switchKeyResultType('metric'); + component.switchKeyResultType("metric"); expect(component.isMetric) .toBeFalsy(); }); - it('should select ordinal tab', () => { + it("should select ordinal tab", () => { component.isMetric = false; fixture.detectChanges(); - const activeTab = document.getElementsByClassName('active')[0]; + const activeTab = document.getElementsByClassName("active")[0]; expect(activeTab.innerHTML) - .toContain('Ordinal'); + .toContain("Ordinal"); }); - it('should change to metric from html click', () => { + it("should change to metric from html click", () => { component.typeChangeAllowed = true; component.isMetric = false; expect(component.isMetric) .toBeFalsy(); - const metricTab = fixture.debugElement.query(By.css('[data-testId="metricTab"]')); + const metricTab = fixture.debugElement.query(By.css("[data-testId=\"metricTab\"]")); metricTab.nativeElement.click(); expect(component.isMetric) .toBeTruthy(); }); }); - describe('Create', () => { + describe("Create", () => { beforeEach(() => { TestBed.configureTestingModule({ - declarations: [KeyresultTypeComponent], - imports: [TranslateTestingModule.withTranslations({ - de: de - }), - ReactiveFormsModule] + "declarations": [KeyresultTypeComponent], + "imports": [ + TranslateTestingModule.withTranslations({ + "de": de + }), + ReactiveFormsModule + ] }); fixture = TestBed.createComponent(KeyresultTypeComponent); component = fixture.componentInstance; @@ -237,12 +255,12 @@ describe('KeyresultTypeComponent', () => { fixture.detectChanges(); }); - it('should create', () => { + it("should create", () => { expect(component) .toBeTruthy(); }); - it('should use default values', () => { + it("should use default values", () => { expect(component.keyResultForm.value.unit) .toBeNull(); expect(component.keyResultForm.value.baseline) @@ -257,37 +275,37 @@ describe('KeyresultTypeComponent', () => { .toBeNull(); }); - it('should switch type of KeyResult', () => { + it("should switch type of KeyResult", () => { component.isMetric = true; component.typeChangeAllowed = true; - component.switchKeyResultType('metric'); + component.switchKeyResultType("metric"); expect(component.isMetric) .toBeTruthy(); - component.switchKeyResultType('ordinal'); + component.switchKeyResultType("ordinal"); expect(component.isMetric) .toBeFalsy(); component.typeChangeAllowed = false; - component.switchKeyResultType('metric'); + component.switchKeyResultType("metric"); expect(component.isMetric) .toBeFalsy(); }); - it('should select metric tab', () => { + it("should select metric tab", () => { component.isMetric = true; - const activeTab = document.getElementsByClassName('active')[0]; + const activeTab = document.getElementsByClassName("active")[0]; expect(activeTab.innerHTML) - .toContain('Metrisch'); + .toContain("Metrisch"); }); - it('should change to ordinal from html click', () => { + it("should change to ordinal from html click", () => { component.typeChangeAllowed = true; expect(component.isMetric) .toBeTruthy(); - const ordinalTab = fixture.debugElement.query(By.css('[data-testId="ordinalTab"]')); + const ordinalTab = fixture.debugElement.query(By.css("[data-testId=\"ordinalTab\"]")); ordinalTab.nativeElement.click(); expect(component.isMetric) .toBeFalsy(); diff --git a/frontend/src/app/components/keyresult-type/keyresult-type.component.ts b/frontend/src/app/components/keyresult-type/keyresult-type.component.ts index a5663560cc..87a87fd42f 100644 --- a/frontend/src/app/components/keyresult-type/keyresult-type.component.ts +++ b/frontend/src/app/components/keyresult-type/keyresult-type.component.ts @@ -1,16 +1,16 @@ -import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; -import { KeyResult } from '../../shared/types/model/KeyResult'; -import { FormGroup, Validators } from '@angular/forms'; -import { KeyResultMetric } from '../../shared/types/model/KeyResultMetric'; -import { KeyResultOrdinal } from '../../shared/types/model/KeyResultOrdinal'; -import { Unit } from '../../shared/types/enums/Unit'; -import { formInputCheck, hasFormFieldErrors } from '../../shared/common'; -import { TranslateService } from '@ngx-translate/core'; +import { Component, EventEmitter, Input, OnInit, Output } from "@angular/core"; +import { KeyResult } from "../../shared/types/model/KeyResult"; +import { FormGroup, Validators } from "@angular/forms"; +import { KeyResultMetric } from "../../shared/types/model/KeyResultMetric"; +import { KeyResultOrdinal } from "../../shared/types/model/KeyResultOrdinal"; +import { Unit } from "../../shared/types/enums/Unit"; +import { formInputCheck, hasFormFieldErrors } from "../../shared/common"; +import { TranslateService } from "@ngx-translate/core"; @Component({ - selector: 'app-keyresult-type', - templateUrl: './keyresult-type.component.html', - styleUrls: ['./keyresult-type.component.scss'] + "selector": "app-keyresult-type", + "templateUrl": "./keyresult-type.component.html", + "styleUrls": ["./keyresult-type.component.scss"] }) export class KeyresultTypeComponent implements OnInit { @Input() keyResultForm!: FormGroup; @@ -34,7 +34,7 @@ export class KeyresultTypeComponent implements OnInit { ngOnInit (): void { if (this.keyresult) { this.typeChangeAllowed = (this.keyresult as KeyResultMetric | KeyResultOrdinal).lastCheckIn?.id == null; - this.isMetric = this.keyresult.keyResultType == 'metric'; + this.isMetric = this.keyresult.keyResultType == "metric"; this.isMetric ? this.keyResultForm.patchValue({ ...this.castToMetric(this.keyresult) }) : this.keyResultForm.patchValue({ ...this.castToOrdinal(this.keyresult) }); @@ -69,47 +69,55 @@ export class KeyresultTypeComponent implements OnInit { } setValidatorsMetric () { - this.keyResultForm.controls['unit'].setValidators([Validators.required]); - this.keyResultForm.controls['baseline'].setValidators([Validators.required, - Validators.pattern('^-?\\d+\\.?\\d*$')]); - this.keyResultForm.controls['stretchGoal'].setValidators([Validators.required, - Validators.pattern('^-?\\d+\\.?\\d*$')]); + this.keyResultForm.controls["unit"].setValidators([Validators.required]); + this.keyResultForm.controls["baseline"].setValidators([ + Validators.required, + Validators.pattern("^-?\\d+\\.?\\d*$") + ]); + this.keyResultForm.controls["stretchGoal"].setValidators([ + Validators.required, + Validators.pattern("^-?\\d+\\.?\\d*$") + ]); } setValidatorsOrdinal () { - this.keyResultForm.controls['commitZone'].setValidators([Validators.required, - Validators.maxLength(400)]); - this.keyResultForm.controls['targetZone'].setValidators([Validators.required, - Validators.maxLength(400)]); - this.keyResultForm.controls['stretchZone'].setValidators([Validators.required, - Validators.maxLength(400)]); + this.keyResultForm.controls["commitZone"].setValidators([ + Validators.required, + Validators.maxLength(400) + ]); + this.keyResultForm.controls["targetZone"].setValidators([ + Validators.required, + Validators.maxLength(400) + ]); + this.keyResultForm.controls["stretchZone"].setValidators([ + Validators.required, + Validators.maxLength(400) + ]); } clearValidatorsMetric () { - this.keyResultForm.controls['unit'].clearValidators(); - this.keyResultForm.controls['baseline'].clearValidators(); - this.keyResultForm.controls['stretchGoal'].clearValidators(); + this.keyResultForm.controls["unit"].clearValidators(); + this.keyResultForm.controls["baseline"].clearValidators(); + this.keyResultForm.controls["stretchGoal"].clearValidators(); } clearValidatorsOrdinal () { - this.keyResultForm.controls['commitZone'].clearValidators(); - this.keyResultForm.controls['targetZone'].clearValidators(); - this.keyResultForm.controls['stretchZone'].clearValidators(); + this.keyResultForm.controls["commitZone"].clearValidators(); + this.keyResultForm.controls["targetZone"].clearValidators(); + this.keyResultForm.controls["stretchZone"].clearValidators(); } switchKeyResultType (type: string) { - if (((type == 'metric' && !this.isMetric) || (type == 'ordinal' && this.isMetric)) && this.typeChangeAllowed) { + if ((type == "metric" && !this.isMetric || type == "ordinal" && this.isMetric) && this.typeChangeAllowed) { this.isMetric = !this.isMetric; - const keyResultType = this.isMetric ? 'metric' : 'ordinal'; - this.keyResultForm.controls['keyResultType'].setValue(keyResultType); + const keyResultType = this.isMetric ? "metric" : "ordinal"; + this.keyResultForm.controls["keyResultType"].setValue(keyResultType); this.switchValidators(); } } - getErrorMessage ( - error: string, field: string, firstNumber: number | null, secondNumber: number | null - ): string { - return field + this.translate.instant('DIALOG_ERRORS.' + error) + getErrorMessage (error: string, field: string, firstNumber: number | null, secondNumber: number | null): string { + return field + this.translate.instant("DIALOG_ERRORS." + error) .format(firstNumber, secondNumber); } } diff --git a/frontend/src/app/components/keyresult/keyresult.component.spec.ts b/frontend/src/app/components/keyresult/keyresult.component.spec.ts index 332a60dd38..d4ad5fb5bf 100644 --- a/frontend/src/app/components/keyresult/keyresult.component.spec.ts +++ b/frontend/src/app/components/keyresult/keyresult.component.spec.ts @@ -1,22 +1,24 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { KeyresultComponent } from './keyresult.component'; -import { keyResultMetricMin } from '../../shared/testData'; -import { MatDialogModule } from '@angular/material/dialog'; -import { ScoringComponent } from '../../shared/custom/scoring/scoring.component'; -import { ConfidenceComponent } from '../confidence/confidence.component'; -import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http'; +import { ComponentFixture, TestBed } from "@angular/core/testing"; +import { KeyresultComponent } from "./keyresult.component"; +import { keyResultMetricMin } from "../../shared/testData"; +import { MatDialogModule } from "@angular/material/dialog"; +import { ScoringComponent } from "../../shared/custom/scoring/scoring.component"; +import { ConfidenceComponent } from "../confidence/confidence.component"; +import { provideHttpClient, withInterceptorsFromDi } from "@angular/common/http"; -describe('KeyresultComponent', () => { +describe("KeyresultComponent", () => { let component: KeyresultComponent; let fixture: ComponentFixture; beforeEach(async () => { await TestBed.configureTestingModule({ - declarations: [KeyresultComponent, + "declarations": [ + KeyresultComponent, ScoringComponent, - ConfidenceComponent], - imports: [MatDialogModule], - providers: [provideHttpClient(withInterceptorsFromDi())] + ConfidenceComponent + ], + "imports": [MatDialogModule], + "providers": [provideHttpClient(withInterceptorsFromDi())] }) .compileComponents(); @@ -26,7 +28,7 @@ describe('KeyresultComponent', () => { fixture.detectChanges(); }); - it('should create', () => { + it("should create", () => { expect(component) .toBeTruthy(); }); diff --git a/frontend/src/app/components/keyresult/keyresult.component.ts b/frontend/src/app/components/keyresult/keyresult.component.ts index 7822690a95..6e045dec1e 100644 --- a/frontend/src/app/components/keyresult/keyresult.component.ts +++ b/frontend/src/app/components/keyresult/keyresult.component.ts @@ -1,15 +1,15 @@ -import { ChangeDetectionStrategy, Component, Input } from '@angular/core'; -import { KeyresultMin } from '../../shared/types/model/KeyresultMin'; -import { Router } from '@angular/router'; -import { DATE_FORMAT } from '../../shared/constantLibary'; -import { KeyResultMetricMin } from '../../shared/types/model/KeyResultMetricMin'; -import { KeyResultOrdinalMin } from '../../shared/types/model/KeyResultOrdinalMin'; +import { ChangeDetectionStrategy, Component, Input } from "@angular/core"; +import { KeyresultMin } from "../../shared/types/model/KeyresultMin"; +import { Router } from "@angular/router"; +import { DATE_FORMAT } from "../../shared/constantLibary"; +import { KeyResultMetricMin } from "../../shared/types/model/KeyResultMetricMin"; +import { KeyResultOrdinalMin } from "../../shared/types/model/KeyResultOrdinalMin"; @Component({ - selector: 'app-keyresult', - templateUrl: './keyresult.component.html', - styleUrls: ['./keyresult.component.scss'], - changeDetection: ChangeDetectionStrategy.OnPush + "selector": "app-keyresult", + "templateUrl": "./keyresult.component.html", + "styleUrls": ["./keyresult.component.scss"], + "changeDetection": ChangeDetectionStrategy.OnPush }) export class KeyresultComponent { @Input() keyResult!: KeyresultMin; @@ -19,12 +19,14 @@ export class KeyresultComponent { constructor (private router: Router) {} openDrawer () { - this.router.navigate(['details/keyresult', - this.keyResult.id]); + this.router.navigate([ + "details/keyresult", + this.keyResult.id + ]); } getKeyResultWithCorrectType (): KeyResultOrdinalMin | KeyResultMetricMin { - if (this.keyResult.keyResultType === 'metric') { + if (this.keyResult.keyResultType === "metric") { return this.keyResult as KeyResultMetricMin; } else { return this.keyResult as KeyResultOrdinalMin; diff --git a/frontend/src/app/components/objective-detail/objective-detail.component.html b/frontend/src/app/components/objective-detail/objective-detail.component.html index d571c2477d..f5ab9e9b1b 100644 --- a/frontend/src/app/components/objective-detail/objective-detail.component.html +++ b/frontend/src/app/components/objective-detail/objective-detail.component.html @@ -28,7 +28,7 @@

Beschrieb

{{ objective.description }}

-
+
-
+