Replace Cypress with Playwright in deploy-and-test workflow

.github/workflows/deploy-and-test.yml

@@ -11,7 +11,7 @@
 permissions: {}
 
 env:
-  CYPRESS_TEST_PATH: tests/cypress/integration/help.cy.js
+  PLAYWRIGHT_TEST_SPEC: tests/playwright/specs/help.spec.js
 
 jobs:
   deploy:
@@ -111,15 +111,21 @@
           done
           echo "Server not ready after 5 minutes" && exit 1
 
-      - name: Run Specific Cypress Tests
-        uses: cypress-io/github-action@4c06c48f3ffea349b7189aa06dfcda47a9fa7b92 # v7.1.8
-        with:
-          install: true
-          start: npm start
-          wait-on: ${{ vars.SITE_URL }}
-          config: baseUrl=${{ vars.SITE_URL }}
-          command: npx cypress run --spec ${{ env.CYPRESS_TEST_PATH }}
+      - name: Install Playwright Browsers
+        run: npx playwright install --with-deps chromium
+
+      - name: Run Playwright Tests
+        run: npx playwright test ${{ env.PLAYWRIGHT_TEST_SPEC }} --reporter=line
         env:
+          CI: true
           BASE_URL: ${{ vars.SITE_URL }}
           WP_ADMIN_USERNAME: ${{ secrets.WP_ADMIN_USERNAME }}
           WP_ADMIN_PASSWORD: ${{ secrets.WP_ADMIN_PASSWORD }}
+
+      - name: Store Playwright test results
+        if: always()
+        uses: actions/upload-artifact@b7c566a772e6b6bfb58ed0dc250532a479d7789f # v6.0.0
+        with:
+          name: playwright-report-${{ matrix.environment }}
+          path: tests/playwright/test-results/
+          retention-days: 10

playwright.config.mjs

@@ -61,7 +61,7 @@ process.env.WP_VERSION = process.env.WP_VERSION || wpVersion;
 process.env.PHP_VERSION = process.env.PHP_VERSION || phpVersion;
 
 export default defineConfig({
-  globalSetup: resolve(__dirname, './tests/playwright/global-setup.js'),
+  globalSetup: process.env.BASE_URL ? undefined : resolve(__dirname, './tests/playwright/global-setup.js'),
   projects: projects,
   testIgnore: [
     // Don't ignore anything - we want to include gitignored files that playwright needs to find
@@ -71,7 +71,7 @@ export default defineConfig({
     ...devices['Desktop Chrome'],
     headless: true,
     viewport: { width: 1200, height: 800 },
-    baseURL: `http://localhost:${_port}`, // Use port from wp-env.json
+    baseURL: process.env.BASE_URL || `http://localhost:${_port}`,
     ignoreHTTPSErrors: true,
     // WordPress-optimized settings
     locale: 'en-US',

tests/playwright/global-setup.js

@@ -3,24 +3,24 @@ import utils from './helpers/utils.mjs';
 
 async function globalSetup(config) {
   utils.fancyLog('Running global setup...', 55, 'gray', '');
-  
+
   try {
     // Set permalink structure via WP-CLI (runs before browser is created)
     const permalinkStructure = '/%postname%/';
     utils.fancyLog(`🔗 Setting permalink structure to: ${permalinkStructure}`, 55, 'gray', '');
-    
+
     execSync(`npx wp-env run cli wp option update permalink_structure '${permalinkStructure}'`, {
       stdio: 'inherit',
       encoding: 'utf-8',
     });
-    
+
     // Flush rewrite rules to apply the new permalink structure
-    utils.fancyLog('🔄 Flushing rewrite rules...', 55, 'gray', '');
-    execSync('npx wp-env run cli wp rewrite flush', {
+    console.log('🔄 Flushing rewrite rules with hard mode...');
+    execSync('npx wp-env run cli wp rewrite flush --hard', {
       stdio: 'inherit',
       encoding: 'utf-8',
     });
-    
+
     utils.fancyLog('✔ Global setup completed successfully', 55, 'green', '');
   } catch (error) {
     utils.fancyLog(`✘ Global setup failed: ${error.message}`, 55, 'red', '');