Implementing changes to fix 2 broken Playwright tests (#12253)

frontend/testing/playwright/pages/DashboardPage.ts

@@ -113,7 +113,6 @@ export class DashboardPage extends BasePage {
     await this.page
       .getByRole('menuitem', {
         name: this.textMock('dashboard.edit_app', { appName }),
-        exact: true,
       })
       .click();
   }

frontend/testing/playwright/tests/dashboard/dashboard.spec.ts

@@ -7,20 +7,25 @@ import { DashboardPage } from 'testing/playwright/pages/DashboardPage';
 import { OverviewPage } from 'testing/playwright/pages/OverviewPage';
 import { Gitea } from '../../helpers/Gitea';
 
+const getExtraAppName = (appName: string): string => `extra-app-${appName}`;
+
 // Before the tests starts, we need to create the dashboard app
 test.beforeAll(async ({ testAppName, request, storageState }) => {
   // Create 2 apps
-  const testAppName2: string = `${testAppName}2`;
   const firstApp = await createApp(testAppName, request, storageState as StorageState);
-  const secondApp = await createApp(testAppName2, request, storageState as StorageState);
+  const secondApp = await createApp(
+    getExtraAppName(testAppName),
+    request,
+    storageState as StorageState,
+  );
 
   expect(firstApp.ok()).toBeTruthy();
   expect(secondApp.ok()).toBeTruthy();
 });
 
 test.afterAll(async ({ request, testAppName }) => {
   const gitea = new Gitea();
-  const appsToDelete: string[] = [testAppName, `${testAppName}2`];
+  const appsToDelete: string[] = [testAppName, getExtraAppName(testAppName)];
 
   for (const app of appsToDelete) {
     const response = await request.delete(gitea.getDeleteAppEndpoint({ app }));

frontend/testing/playwright/tests/main-navigation-between-sub-apps/main-navigation-between-sub-apps.spec.ts

@@ -131,14 +131,20 @@ test('That it is possible to navigate from overview to the preview page and back
   await uiEditor.verifyUiEditorPage(null);
 });
 
-test.skip('That it is possible to navigate from overview to the deploy page and back again', async ({
+test('That it is possible to navigate from overview to the deploy page and back again', async ({
   page,
   testAppName,
   request,
   storageState,
 }) => {
+  const testDepartmentOrg: string = 'ttd';
+
   const designerApi = new DesignerApi({ app: testAppName });
-  const response = await designerApi.createApp(request, storageState as StorageState, 'ttd');
+  const response = await designerApi.createApp(
+    request,
+    storageState as StorageState,
+    testDepartmentOrg,
+  );
   expect(response.ok()).toBeTruthy();
 
   const dashboardPage = new DashboardPage(page, { app: testAppName });
@@ -149,13 +155,12 @@ test.skip('That it is possible to navigate from overview to the deploy page and
   await dashboardPage.loadDashboardPage();
   await dashboardPage.verifyDashboardPage();
 
-  const testDepartmentOrg: string = 'ttd';
-
-  // Change org to TTD
   await dashboardPage.clickOnHeaderAvatar();
   await dashboardPage.clickOnOrgApplications();
   dashboardPage.updateOrgNameEnv(testDepartmentOrg);
   await dashboardPage.checkThatTTDApplicationsHeaderIsVisible();
+
+  expect(dashboardPage.org).toEqual('ttd');
   await dashboardPage.clickOnTestAppEditButton(testAppName);
 
   // As we have changed env.org to 'ttd', we need to update the org of the new classes to make sure it works.

frontend/testing/playwright/tests/settings-modal/settings-modal.spec.ts

@@ -77,7 +77,7 @@ test('That it is possible to change tab to "Policy editor" tab', async ({ page,
   await settingsModal.verifyThatTabIsVisible('policy');
 });
 
-test.skip('That it is possible to edit security level on "Policy editor" tab, and that changes are saved', async ({
+test('That it is possible to edit security level on "Policy editor" tab, and that changes are saved', async ({
   page,
   testAppName,
 }) => {
@@ -88,21 +88,27 @@ test.skip('That it is possible to edit security level on "Policy editor" tab, an
 
   const securityLevel2 = 2;
   const securityLevel2Text = policyEditor.getSecurityLevelByTextByLevel(securityLevel2);
-  expect(await policyEditor.getSelectedSecurityLevel()).toEqual(securityLevel2Text);
+
+  const securityValueInitial = await policyEditor.getSelectedSecurityLevel();
+  expect(securityValueInitial).toBe(securityLevel2Text);
 
   await policyEditor.clickOnSecurityLevelSelect();
   await policyEditor.clickOnSecurityLevelSelectOption(3);
 
   const securityLevel3 = 3;
   const securityLevel3Text = policyEditor.getSecurityLevelByTextByLevel(securityLevel3);
-  expect(await policyEditor.getSelectedSecurityLevel()).toEqual(securityLevel3Text);
+
+  const securityValueAfterChange = await policyEditor.getSelectedSecurityLevel();
+  expect(securityValueAfterChange).toBe(securityLevel3Text);
 
   await settingsModal.navigateToTab('about');
   await settingsModal.verifyThatTabIsVisible('about');
   await settingsModal.verifyThatTabIsHidden('policy');
 
   await settingsModal.navigateToTab('policy');
-  expect(await policyEditor.getSelectedSecurityLevel()).toEqual(securityLevel3Text);
+
+  const securityValueAfterNavigation = await policyEditor.getSelectedSecurityLevel();
+  expect(securityValueAfterNavigation).toBe(securityLevel3Text);
 });
 
 test('That it is possible to change tab to "Access control" tab', async ({ page, testAppName }) => {