chore: re-re-enable scorecard e2e tests (#4224)

Signed-off-by: Christoph Jerolimov <jerolimov+git@redhat.com>
Co-authored-by: Christoph Jerolimov <jerolimov+git@redhat.com>
Co-authored-by: Kim Tsao <84398375+kim-tsao@users.noreply.github.com>

Author: 3 people

e2e-tests/playwright/e2e/plugins/scorecard/scorecard.spec.ts

@@ -46,6 +46,15 @@ test.describe.serial("Scorecard Plugin Tests", () => {
     importPage = new ComponentImportPage(page);
     scorecardPage = new ScorecardPage(page);
     await new Common(page).loginAsKeycloakUser();
+
+    // Import the component here instead of the first tests so that they can re-run.
+    // It would be great if this would detect if the component is already imported.
+    await catalog.go();
+    await importPage.startComponentImport();
+    await importPage.analyzeComponent(
+      "https://github.com/rhdh-pai-qe/backstage-catalog/blob/main/catalog-info.yaml",
+    );
+    await importPage.viewImportedComponent();
   });
 
   test.afterAll(async () => {
@@ -56,11 +65,7 @@ test.describe.serial("Scorecard Plugin Tests", () => {
     await mockScorecardResponse(page, CUSTOM_SCORECARD_RESPONSE);
 
     await catalog.go();
-    await importPage.startComponentImport();
-    await importPage.analyzeComponent(
-      "https://github.com/rhdh-pai-qe/backstage-catalog/blob/main/catalog-info.yaml",
-    );
-    await importPage.viewImportedComponent();
+    await catalog.goToByName("rhdh-app");
     await scorecardPage.openTab();
 
     await scorecardPage.verifyScorecardValues({

e2e-tests/playwright/support/page-objects/scorecard/component-import-page.ts

@@ -40,6 +40,10 @@ export class ComponentImportPage {
 
   async viewImportedComponent() {
     await this.uiHelper.clickButton("View Component");
-    await this.uiHelper.verifyText("Overview");
+    // After a component is imported, wait for the Overview tab to be visible
+    // This could take sometime more time depending on the environment performance.
+    // We saw API calls taking round about 10 seconds in some cases on our CI.
+    const tabLocator = this.page.getByRole("tab", { name: "Overview" });
+    await tabLocator.waitFor({ state: "visible", timeout: 20000 });
   }
 }