Fix CI E2E test failures: proper browser installation and localhost server startup

Co-authored-by: 0xrinegade <[email protected]>

Author: Copilot

.github/workflows/comprehensive-e2e-testing.yml

@@ -72,10 +72,14 @@ jobs:
           path: ${{ env.PLAYWRIGHT_BROWSERS_PATH }}
           key: playwright-browsers-${{ matrix.browser }}-${{ hashFiles('package-lock.json') }}
 
+      - name: Build application for local testing
+        if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
+        run: yarn build
+        
       - name: Start local server (if testing locally)
-        if: github.event.inputs.environment == 'local'
+        if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
         run: |
-          npm run start &
+          yarn build && npx serve -s build -l 3000 &
           npx wait-on http://localhost:3000 --timeout 120000
           
       - name: Run comprehensive E2E tests
@@ -119,10 +123,14 @@ jobs:
       - name: Install Playwright
         run: npx playwright install chromium --with-deps
 
+      - name: Build application for local testing
+        if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
+        run: yarn build
+        
       - name: Start local server (if testing locally)
-        if: github.event.inputs.environment == 'local'
+        if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
         run: |
-          npm run start &
+          yarn build && npx serve -s build -l 3000 &
           npx wait-on http://localhost:3000 --timeout 120000
           
       - name: Run visual regression tests
@@ -164,10 +172,14 @@ jobs:
       - name: Install Playwright
         run: npx playwright install chromium --with-deps
 
+      - name: Build application for local testing
+        if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
+        run: yarn build
+        
       - name: Start local server (if testing locally)
-        if: github.event.inputs.environment == 'local'
+        if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
         run: |
-          npm run start &
+          yarn build && npx serve -s build -l 3000 &
           npx wait-on http://localhost:3000 --timeout 120000
           
       - name: Run performance tests
@@ -218,10 +230,14 @@ jobs:
       - name: Install Playwright
         run: npx playwright install chromium --with-deps
 
+      - name: Build application for local testing
+        if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
+        run: yarn build
+        
       - name: Start local server (if testing locally)
-        if: github.event.inputs.environment == 'local'
+        if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
         run: |
-          npm run start &
+          yarn build && npx serve -s build -l 3000 &
           npx wait-on http://localhost:3000 --timeout 120000
           
       - name: Run mobile UX tests
@@ -264,10 +280,14 @@ jobs:
           npx playwright install chromium --with-deps
           npm install -g axe-core @axe-core/playwright
           
+      - name: Build application for local testing
+        if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
+        run: yarn build
+        
       - name: Start local server (if testing locally)
-        if: github.event.inputs.environment == 'local'
+        if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
         run: |
-          npm run start &
+          yarn build && npx serve -s build -l 3000 &
           npx wait-on http://localhost:3000 --timeout 120000
           
       - name: Run accessibility tests
@@ -312,10 +332,14 @@ jobs:
       - name: Install Playwright browsers
         run: npx playwright install ${{ matrix.browser }} --with-deps
 
+      - name: Build application for local testing
+        if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
+        run: yarn build
+        
       - name: Start local server (if testing locally)
-        if: github.event.inputs.environment == 'local'
+        if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
         run: |
-          npm run start &
+          yarn build && npx serve -s build -l 3000 &
           npx wait-on http://localhost:3000 --timeout 120000
           
       - name: Run cross-browser tests

playwright-report/index.html

@@ -74,4 +74,4 @@
   </body>
 </html>
 <script>
-window.playwrightReportBase64 = "data:application/zip;base64,UEsDBBQAAAgIAGBcAlsV+4JVWgIAANoGAAALAAAAcmVwb3J0Lmpzb26NVE1zmzAQ/Ss7usSeUD4MJjUZc2s7vfTQ9hYnmTUsCTUSjBB2Mrb/e4ePgJzgJLqg1e5Kj7dvd884KYxRIQv2R4OVCqX6m3JigXM19xzX8xYLd2YbLK4kqjQXLPCvfPPqq90vx2BJmlHJgptbgxUy/0eR+oX85aRUqEoW7JnKFWYssA1GTwVFiuLGqMSJmWS4eW525SYtiu4037BAyYqOBiMpc1nfzf48C4VP32o7AOsx52TJSgiS1i6XG6vc8pJo+NKMLIy3KCKKvxQkk1zy2jDLgiJTlQH8jEmoNElJwkUikdNvVFRewCOWgJkkjJ9hTSQgpihDSbEJE893A2c2XYmVWFW27axvbA7dbmFz8HwHDp3tLji0ayVOY2ZjMX2AZcEPUtBAAomKgBOWlSROQpVDYg/BdXi3c3jY7WYzrkXqj7vnH3d9HuWiVJp/IKYPcvlSCxhScYepnlrgAw055uChLWYVKppMpvqloZa7S0Wc70az7+9HMR30v7q5nQ6ea50yvRD1esvFKSMatXej1L4qrfeJ8s/frUCaaM7J8K+jZGQkHtSjRkM4Upo5t4fTKexf4/FHWTivCdw+fH+BdUYVH8CWFFcRTSY4eA0te31WF6g5LvWM8YvOMDAEW5/H3FI9LquXUVDPBQBABe+OHs9328hmXAwqaUdDZ38wBkTY9nIX3dRI79YlNP3YdKGpd9wy7LrLPOmkw6HumusGf90XejPctdi8V1jnvZ0mulLNTpUh2K3aWo3117VYT1S01KCbvTqMWgnLEBAuYW3Ut1nw5plrdnv8D1BLAQI/AxQAAAgIAGBcAlsV+4JVWgIAANoGAAALAAAAAAAAAAAAAAC0gQAAAAByZXBvcnQuanNvblBLBQYAAAAAAQABADkAAACDAgAAAAA=";</script>
+window.playwrightReportBase64 = "data:application/zip;base64,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";</script>

playwright.config.ts

@@ -107,8 +107,8 @@ export default defineConfig({
   ],
 
   /* Run your local dev server before starting the tests - only for local development */
-  webServer: process.env.PLAYWRIGHT_BASE_URL ? undefined : {
-    command: 'serve -s build -l 3000',
+  webServer: (process.env.PLAYWRIGHT_BASE_URL && !process.env.PLAYWRIGHT_BASE_URL.includes('localhost')) ? undefined : {
+    command: 'yarn build && npx serve -s build -l 3000',
     url: 'http://localhost:3000',
     reuseExistingServer: !process.env.CI,
     timeout: parseInt(process.env.PLAYWRIGHT_SERVER_TIMEOUT || '240') * 1000, // Default 240 seconds, configurable