Fix Playwright project configuration and implement comprehensive CI/Pipeline improvements

- Fixed Playwright "Pixel" project error by correctly mapping device names to project names in mobile-ux-tests matrix
- Exposed retry parameters as environment variables (DEPENDENCY_INSTALL_RETRIES, DEPENDENCY_INSTALL_TIMEOUT, RETRY_DELAY_SECONDS) for better CI tuning
- Enhanced cache configuration to include both package-lock.json and yarn.lock for better cache invalidation
- Optimized build process by removing duplicate yarn build commands from server startup steps
- Fixed deprecated conditional syntax in PLAYWRIGHT_BASE_URL environment variable
- Added comprehensive feature flag system (src/utils/featureFlags.ts) for controlling global patches with environment variable support
- Enhanced GLOBAL_PATCHES.md documentation with feature flag information and safer defaults
- Updated polyfills to use conditional loading based on feature flags
- Integrated SafeEventListenerUtility with feature flag control in index.tsx
- Increased wallet restore test timeout from 5s to 45s with enhanced error handling (30s timeout for wallet interface)
- Improved error logging and made all global patches opt-in for better security

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

Author: Copilot

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

@@ -36,7 +36,12 @@ on:
 env:
   # Test configuration
   PLAYWRIGHT_BROWSERS_PATH: ${{ github.workspace }}/playwright-browsers
-  PLAYWRIGHT_BASE_URL: ${{ github.event.inputs.environment == 'production' && 'https://svmseek.com' || github.event.inputs.environment == 'staging' && 'https://staging.svmseek.com' || 'http://localhost:3000' }}
+  PLAYWRIGHT_BASE_URL: ${{ (github.event.inputs.environment == 'production') && 'https://svmseek.com' || (github.event.inputs.environment == 'staging') && 'https://staging.svmseek.com' || 'http://localhost:3000' }}
+  
+  # CI retry configuration - expose as environment variables for better tuning
+  DEPENDENCY_INSTALL_RETRIES: ${{ vars.DEPENDENCY_INSTALL_RETRIES || '3' }}
+  DEPENDENCY_INSTALL_TIMEOUT: ${{ vars.DEPENDENCY_INSTALL_TIMEOUT || '300000' }}
+  RETRY_DELAY_SECONDS: ${{ vars.RETRY_DELAY_SECONDS || '10' }}
 
 jobs:
   # Comprehensive test matrix for thorough coverage
@@ -63,17 +68,17 @@ jobs:
       - name: Install dependencies with retry logic
         run: |
           # Retry yarn install up to 3 times for flaky network issues
-          for i in {1..3}; do
+          for i in $(seq 1 $DEPENDENCY_INSTALL_RETRIES); do
             echo "Attempt $i: Installing dependencies..."
-            if yarn install --frozen-lockfile --network-timeout 300000; then
+            if yarn install --frozen-lockfile --network-timeout $DEPENDENCY_INSTALL_TIMEOUT; then
               echo "Dependencies installed successfully on attempt $i"
               break
-            elif [ $i -eq 3 ]; then
-              echo "Failed to install dependencies after 3 attempts"
+            elif [ $i -eq $DEPENDENCY_INSTALL_RETRIES ]; then
+              echo "Failed to install dependencies after $DEPENDENCY_INSTALL_RETRIES attempts"
               exit 1
             else
-              echo "Attempt $i failed, retrying in 10 seconds..."
-              sleep 10
+              echo "Attempt $i failed, retrying in $RETRY_DELAY_SECONDS seconds..."
+              sleep $RETRY_DELAY_SECONDS
             fi
           done
         
@@ -84,7 +89,7 @@ jobs:
         uses: actions/cache@v4
         with:
           path: ${{ env.PLAYWRIGHT_BROWSERS_PATH }}
-          key: playwright-browsers-${{ matrix.browser }}-${{ hashFiles('package-lock.json') }}
+          key: playwright-browsers-${{ matrix.browser }}-${{ hashFiles('package-lock.json', 'yarn.lock') }}
 
       - name: Build application for local testing
         if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
@@ -93,7 +98,7 @@ jobs:
       - name: Start local server (if testing locally)
         if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
         run: |
-          yarn build && npx serve -s build -l 3000 &
+          npx serve -s build -l 3000 &
           npx wait-on http://localhost:3000 --timeout 120000
           
       - name: Run comprehensive E2E tests
@@ -134,17 +139,17 @@ jobs:
       - name: Install dependencies with retry logic
         run: |
           # Retry yarn install up to 3 times for flaky network issues
-          for i in {1..3}; do
+          for i in $(seq 1 $DEPENDENCY_INSTALL_RETRIES); do
             echo "Attempt $i: Installing dependencies..."
-            if yarn install --frozen-lockfile --network-timeout 300000; then
+            if yarn install --frozen-lockfile --network-timeout $DEPENDENCY_INSTALL_TIMEOUT; then
               echo "Dependencies installed successfully on attempt $i"
               break
-            elif [ $i -eq 3 ]; then
-              echo "Failed to install dependencies after 3 attempts"
+            elif [ $i -eq $DEPENDENCY_INSTALL_RETRIES ]; then
+              echo "Failed to install dependencies after $DEPENDENCY_INSTALL_RETRIES attempts"
               exit 1
             else
-              echo "Attempt $i failed, retrying in 10 seconds..."
-              sleep 10
+              echo "Attempt $i failed, retrying in $RETRY_DELAY_SECONDS seconds..."
+              sleep $RETRY_DELAY_SECONDS
             fi
           done
         
@@ -158,7 +163,7 @@ jobs:
       - name: Start local server (if testing locally)
         if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
         run: |
-          yarn build && npx serve -s build -l 3000 &
+          npx serve -s build -l 3000 &
           npx wait-on http://localhost:3000 --timeout 120000
           
       - name: Run visual regression tests
@@ -197,17 +202,17 @@ jobs:
       - name: Install dependencies with retry logic
         run: |
           # Retry yarn install up to 3 times for flaky network issues
-          for i in {1..3}; do
+          for i in $(seq 1 $DEPENDENCY_INSTALL_RETRIES); do
             echo "Attempt $i: Installing dependencies..."
-            if yarn install --frozen-lockfile --network-timeout 300000; then
+            if yarn install --frozen-lockfile --network-timeout $DEPENDENCY_INSTALL_TIMEOUT; then
               echo "Dependencies installed successfully on attempt $i"
               break
-            elif [ $i -eq 3 ]; then
-              echo "Failed to install dependencies after 3 attempts"
+            elif [ $i -eq $DEPENDENCY_INSTALL_RETRIES ]; then
+              echo "Failed to install dependencies after $DEPENDENCY_INSTALL_RETRIES attempts"
               exit 1
             else
-              echo "Attempt $i failed, retrying in 10 seconds..."
-              sleep 10
+              echo "Attempt $i failed, retrying in $RETRY_DELAY_SECONDS seconds..."
+              sleep $RETRY_DELAY_SECONDS
             fi
           done
         
@@ -221,7 +226,7 @@ jobs:
       - name: Start local server (if testing locally)
         if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
         run: |
-          yarn build && npx serve -s build -l 3000 &
+          npx serve -s build -l 3000 &
           npx wait-on http://localhost:3000 --timeout 120000
           
       - name: Run performance tests
@@ -254,7 +259,14 @@ jobs:
     if: github.event.inputs.test_suite == 'all' || github.event.inputs.test_suite == 'mobile-ux' || github.event.inputs.test_suite == ''
     strategy:
       matrix:
-        device: ['iPhone 12', 'Pixel 5', 'iPad Pro']
+        project: ['Mobile Safari', 'Mobile Chrome', 'iPad']
+        include:
+          - project: 'Mobile Safari'
+            device: 'iPhone 12'
+          - project: 'Mobile Chrome' 
+            device: 'Pixel 5'
+          - project: 'iPad'
+            device: 'iPad Pro'
 
     steps:
       - name: Checkout code
@@ -269,17 +281,17 @@ jobs:
       - name: Install dependencies with retry logic
         run: |
           # Retry yarn install up to 3 times for flaky network issues
-          for i in {1..3}; do
+          for i in $(seq 1 $DEPENDENCY_INSTALL_RETRIES); do
             echo "Attempt $i: Installing dependencies..."
-            if yarn install --frozen-lockfile --network-timeout 300000; then
+            if yarn install --frozen-lockfile --network-timeout $DEPENDENCY_INSTALL_TIMEOUT; then
               echo "Dependencies installed successfully on attempt $i"
               break
-            elif [ $i -eq 3 ]; then
-              echo "Failed to install dependencies after 3 attempts"
+            elif [ $i -eq $DEPENDENCY_INSTALL_RETRIES ]; then
+              echo "Failed to install dependencies after $DEPENDENCY_INSTALL_RETRIES attempts"
               exit 1
             else
-              echo "Attempt $i failed, retrying in 10 seconds..."
-              sleep 10
+              echo "Attempt $i failed, retrying in $RETRY_DELAY_SECONDS seconds..."
+              sleep $RETRY_DELAY_SECONDS
             fi
           done
         
@@ -293,19 +305,19 @@ jobs:
       - name: Start local server (if testing locally)
         if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
         run: |
-          yarn build && npx serve -s build -l 3000 &
+          npx serve -s build -l 3000 &
           npx wait-on http://localhost:3000 --timeout 120000
           
       - name: Run mobile UX tests
-        run: npx playwright test e2e/mobile-ux-enhancement.spec.ts --project=${{ matrix.device }}
+        run: npx playwright test e2e/mobile-ux-enhancement.spec.ts --project="${{ matrix.project }}"
         env:
           PLAYWRIGHT_BASE_URL: ${{ env.PLAYWRIGHT_BASE_URL }}
 
       - name: Upload mobile test results
         if: always()
         uses: actions/upload-artifact@v4
         with:
-          name: mobile-ux-${{ matrix.device }}
+          name: mobile-ux-${{ matrix.project }}-${{ matrix.device }}
           path: |
             playwright-report/
             test-results/
@@ -331,17 +343,17 @@ jobs:
       - name: Install dependencies with retry logic
         run: |
           # Retry yarn install up to 3 times for flaky network issues
-          for i in {1..3}; do
+          for i in $(seq 1 $DEPENDENCY_INSTALL_RETRIES); do
             echo "Attempt $i: Installing dependencies..."
-            if yarn install --frozen-lockfile --network-timeout 300000; then
+            if yarn install --frozen-lockfile --network-timeout $DEPENDENCY_INSTALL_TIMEOUT; then
               echo "Dependencies installed successfully on attempt $i"
               break
-            elif [ $i -eq 3 ]; then
-              echo "Failed to install dependencies after 3 attempts"
+            elif [ $i -eq $DEPENDENCY_INSTALL_RETRIES ]; then
+              echo "Failed to install dependencies after $DEPENDENCY_INSTALL_RETRIES attempts"
               exit 1
             else
-              echo "Attempt $i failed, retrying in 10 seconds..."
-              sleep 10
+              echo "Attempt $i failed, retrying in $RETRY_DELAY_SECONDS seconds..."
+              sleep $RETRY_DELAY_SECONDS
             fi
           done
         
@@ -357,7 +369,7 @@ jobs:
       - name: Start local server (if testing locally)
         if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
         run: |
-          yarn build && npx serve -s build -l 3000 &
+          npx serve -s build -l 3000 &
           npx wait-on http://localhost:3000 --timeout 120000
           
       - name: Run accessibility tests
@@ -399,17 +411,17 @@ jobs:
       - name: Install dependencies with retry logic
         run: |
           # Retry yarn install up to 3 times for flaky network issues
-          for i in {1..3}; do
+          for i in $(seq 1 $DEPENDENCY_INSTALL_RETRIES); do
             echo "Attempt $i: Installing dependencies..."
-            if yarn install --frozen-lockfile --network-timeout 300000; then
+            if yarn install --frozen-lockfile --network-timeout $DEPENDENCY_INSTALL_TIMEOUT; then
               echo "Dependencies installed successfully on attempt $i"
               break
-            elif [ $i -eq 3 ]; then
-              echo "Failed to install dependencies after 3 attempts"
+            elif [ $i -eq $DEPENDENCY_INSTALL_RETRIES ]; then
+              echo "Failed to install dependencies after $DEPENDENCY_INSTALL_RETRIES attempts"
               exit 1
             else
-              echo "Attempt $i failed, retrying in 10 seconds..."
-              sleep 10
+              echo "Attempt $i failed, retrying in $RETRY_DELAY_SECONDS seconds..."
+              sleep $RETRY_DELAY_SECONDS
             fi
           done
         
@@ -423,7 +435,7 @@ jobs:
       - name: Start local server (if testing locally)
         if: github.event.inputs.environment == 'local' || env.PLAYWRIGHT_BASE_URL == 'http://localhost:3000'
         run: |
-          yarn build && npx serve -s build -l 3000 &
+          npx serve -s build -l 3000 &
           npx wait-on http://localhost:3000 --timeout 120000
           
       - name: Run cross-browser tests
@@ -539,17 +551,17 @@ jobs:
       - name: Install dependencies with retry logic
         run: |
           # Retry yarn install up to 3 times for flaky network issues
-          for i in {1..3}; do
+          for i in $(seq 1 $DEPENDENCY_INSTALL_RETRIES); do
             echo "Attempt $i: Installing dependencies..."
-            if yarn install --frozen-lockfile --network-timeout 300000; then
+            if yarn install --frozen-lockfile --network-timeout $DEPENDENCY_INSTALL_TIMEOUT; then
               echo "Dependencies installed successfully on attempt $i"
               break
-            elif [ $i -eq 3 ]; then
-              echo "Failed to install dependencies after 3 attempts"
+            elif [ $i -eq $DEPENDENCY_INSTALL_RETRIES ]; then
+              echo "Failed to install dependencies after $DEPENDENCY_INSTALL_RETRIES attempts"
               exit 1
             else
-              echo "Attempt $i failed, retrying in 10 seconds..."
-              sleep 10
+              echo "Attempt $i failed, retrying in $RETRY_DELAY_SECONDS seconds..."
+              sleep $RETRY_DELAY_SECONDS
             fi
           done
         

GLOBAL_PATCHES.md

@@ -6,6 +6,33 @@ This document provides comprehensive documentation about global modifications, m
 
 SVMSeek operates in a complex browser extension ecosystem where multiple wallet extensions compete for global properties and APIs. To ensure compatibility and prevent crashes, several global modifications have been implemented as defensive programming measures.
 
+**⚠️ IMPORTANT:** All global patches can now be controlled via feature flags in `src/utils/featureFlags.ts`. This allows fine-grained control over which modifications are enabled in different environments.
+
+## 🎛️ Feature Flag Control
+
+Global patches are now controlled by environment variables and feature flags:
+
+```bash
+# Global patch control
+REACT_APP_ENABLE_OS_POLYFILL=true
+REACT_APP_ENABLE_BUFFER_POLYFILL=true
+REACT_APP_ENABLE_SAFE_EVENT_LISTENERS=true
+REACT_APP_ENABLE_CRYPTO_POLYFILL=true
+
+# Security features (enabled by default)
+REACT_APP_DISABLE_RATE_LIMITING=false
+REACT_APP_DISABLE_ORIGIN_VALIDATION=false
+REACT_APP_DISABLE_MESSAGE_SECURITY=false
+
+# Extension compatibility (enabled by default)
+REACT_APP_ENABLE_EXTENSION_COMPATIBILITY=true
+```
+
+**Default Behavior:**
+- Development: All patches enabled for maximum compatibility
+- Staging: Essential patches enabled
+- Production: Only explicitly enabled patches (safer defaults)
+
 ## 🚨 Critical Global Modifications
 
 ### 1. EventTarget.prototype.addEventListener (SafeEventListenerUtility)

e2e/comprehensive-production.spec.ts

@@ -316,11 +316,14 @@ test.describe('SVMSeek Wallet - Comprehensive Production Tests', () => {
   test.describe('Wallet Restore Flow', () => {
 
     test('should restore wallet with valid seed phrase', async ({ page }) => {
+      // Increase timeout for wallet restoration which can be slow
+      test.setTimeout(45000);
+      
       await page.goto('/restore');
       await waitForPageLoad(page);
 
       // Should be on restore page
-      await expect(page.locator('text=Restore').or(page.locator('text=Import'))).toBeVisible();
+      await expect(page.locator('text=Restore').or(page.locator('text=Import'))).toBeVisible({ timeout: 10000 });
 
       // Valid test seed phrase (standard BIP39)
       const testSeedPhrase = 'abandon abandon abandon abandon abandon abandon abandon abandon abandon abandon abandon about';
@@ -345,19 +348,19 @@ test.describe('SVMSeek Wallet - Comprehensive Production Tests', () => {
           }
         }
 
-        // Submit restore
+        // Submit restore with increased timeout for wallet processing
         const restoreButton = page.locator('button:has-text("Restore")').or(
           page.locator('button:has-text("Import")')
         );
         await restoreButton.click();
         await waitForPageLoad(page);
 
-        // Should show success or wallet interface
+        // Should show success or wallet interface - increased timeout for wallet restoration
         await expect(page.locator('text=Success').or(
           page.locator('text=Wallet').or(
             page.locator('text=Balance')
           )
-        )).toBeVisible({ timeout: 15000 });
+        )).toBeVisible({ timeout: 30000 });
       }
 
       await page.screenshot({ 

src/index.tsx

@@ -4,6 +4,10 @@ import './polyfills/index.js';
 // Import global error handler early to catch initialization errors
 import './utils/globalErrorHandler';
 
+// Import feature flags and safe event listeners
+import { isFeatureEnabled, logFeatureFlags } from './utils/featureFlags';
+import { safeEventListenerUtility } from './utils/SafeEventListenerUtility';
+
 // Import React and other modules AFTER polyfills
 import React from 'react';
 import { createRoot } from 'react-dom/client';
@@ -19,6 +23,20 @@ import { devLog, logInfo, logError } from './utils/logger';
 // Secure Buffer initialization without global modification
 import { Buffer } from 'buffer';
 
+// Initialize feature-flag controlled global patches
+function initializeGlobalPatches() {
+  // Log current feature flag status in development
+  logFeatureFlags();
+  
+  // Enable safe event listeners if feature flag is set
+  if (isFeatureEnabled('enableSafeEventListeners')) {
+    safeEventListenerUtility.enableSafeListeners();
+    devLog('🛡️ Safe event listeners enabled via feature flag');
+  } else {
+    devLog('🎛️ Safe event listeners disabled via feature flag');
+  }
+}
+
 // Safe initialization function to avoid direct global modification
 function initializeRequiredPolyfills() {
   const globalScope = (function() {
@@ -41,6 +59,9 @@ function initializeRequiredPolyfills() {
 // Initialize polyfills safely
 initializeRequiredPolyfills();
 
+// Initialize feature-flag controlled global patches
+initializeGlobalPatches();
+
 devLog('Buffer polyfills and React initialized successfully');
 
 // Wrap the entire app initialization in error handling