Me 18059 esm tests over preview build

.github/workflows/e2e_pr.yml

@@ -26,8 +26,17 @@ jobs:
       - name: NPM Install
         run: npm install
 
+      - name: Extract PR Number
+        id: extract_pr_number
+        run: echo "PR_NUMBER=${{ github.event.pull_request.number }}" >> $GITHUB_ENV
+
+      - name: Set Deploy Preview URL
+        run: echo "PREVIEW_URL=https://deploy-preview-${{ env.PR_NUMBER }}--cld-vp-esm-pages.netlify.app" >> $GITHUB_ENV
+
       - name: E2E tests
         run: npm run test:e2e
+        env:
+          PREVIEW_URL: ${{ env.PREVIEW_URL }}
 
       - name: Upload report to artifact
         uses: actions/upload-artifact@v4

test/e2e/playwright.config.ts

@@ -6,7 +6,7 @@ import { defineConfig, devices } from '@playwright/test';
 export default defineConfig({
     testMatch: /test\/e2e\/specs\/.*(\.spec.ts)/,
 
-    timeout: 45000,
+    timeout: 150000,
     /* Run tests in files in parallel */
     fullyParallel: true,
     /* Fail the build on CI if you accidentally left test.only in the source code. */

test/e2e/specs/linksConsoleErrorsEsmPage.spec.ts

@@ -1,19 +1,26 @@
-import { ConsoleMessage, expect } from '@playwright/test';
+import { ConsoleMessage, expect, Page } from '@playwright/test';
 import { vpTest } from '../fixtures/vpTest';
 import { ESM_LINKS } from '../testData/esmPageLinksData';
 import { waitForPageToLoadWithTimeout } from '../src/helpers/waitForPageToLoadWithTimeout';
 import { validatePageErrors } from '../src/helpers/validatePageErrors';
+import { ExampleLinkType } from '../types/exampleLinkType';
+
+const EDGE_ESM_URL = 'https://cld-vp-esm-pages.netlify.app/';
+// On PR level it will use the preview deploy URL and locally it will use the latest EDGE.
+const ESM_URL = process.env.PREVIEW_URL || EDGE_ESM_URL;
+// Flag to indicate if the deploy preview URL is ready
+let PREVIEW_URL_LOADED = false;
 
-const ESM_URL = 'https://cld-vp-esm-pages.netlify.app/';
 /**
  * Console error test generated by LINKS object array data.
  */
 for (const link of ESM_LINKS) {
     vpTest(`Test console errors on link ${link.name}`, async ({ page, consoleErrors, vpExamples }) => {
         vpTest.skip(link.name === 'Adaptive Streaming', 'Flaky on CI');
-        /**
-         * Navigate to ESM Imports examples page
-         */
+        //Wait for deploy URL to be available if PREVIEW_URL is set, and it is not available yet
+        if (process.env.PREVIEW_URL && !PREVIEW_URL_LOADED) {
+            await waitForDeployPreviewUrl(link, page);
+        }
         await page.goto(ESM_URL);
         await vpExamples.clickLinkByName(link.name);
         await waitForPageToLoadWithTimeout(page, 5000);
@@ -50,3 +57,16 @@ function handleCommonEsmBrowsersErrors(linkName: string, consoleErrors: ConsoleM
             validatePageErrors(consoleErrors, [], ['the server responded with a status of 404']);
     }
 }
+
+/**
+ * Waits for a deploy preview URL to become available by making repeated requests and check that link is visible.
+ */
+async function waitForDeployPreviewUrl(link: ExampleLinkType, page: Page): Promise<void> {
+    console.log('Waiting for deploy preview to be ready...');
+    await expect(async () => {
+        await page.goto(process.env.PREVIEW_URL);
+        const linkLocator = page.getByRole('link', { name: link.name, exact: true });
+        await expect(linkLocator).toBeVisible({ timeout: 10000 });
+        PREVIEW_URL_LOADED = true;
+    }).toPass({ intervals: [1_000], timeout: 120000 });
+}