Merge pull request #28 from fraidakis/fraidakis

feat: add ESLint to CI/CD workflow

Author: fraidakis

.github/workflows/frontend-cicd.yml

@@ -68,18 +68,27 @@ jobs:
       - name: Install Frontend Dependencies
         run: npm ci --loglevel=error --no-audit --no-fund
 
-      # Step 7: Run Cypress End-to-End tests
+      # Step 7: Run ESLint to ensure code quality
+      - name: Run Lint
+        run: npm run lint
+
+      # Step 8: Run Cypress End-to-End tests
       - name: Run Cypress E2E
         uses: cypress-io/github-action@v6
         with:
           install: false # Dependencies are already installed in a previous step
           start: npm start # Command to start the frontend application
           wait-on: ${{ env.CYPRESS_BASE_URL }} # Wait for the frontend to be available
-          command: npm run test:e2e -- --env apiUrl=${{ env.REACT_APP_API_URL }} # Run E2E tests, passing backend API URL
+          browser: chrome
+          # Suppress WebGL warnings in headless CI environment
+          command: npm run test:e2e -- --env apiUrl=${{ env.REACT_APP_API_URL }}
         env:
           CI: true # Indicate that tests are running in a CI environment
           CYPRESS_BASE_URL: 'http://localhost:3000' # Base URL for the frontend application
           REACT_APP_API_URL: 'http://localhost:3001' # API URL for the backend
+          GENERATE_SOURCEMAP: false # Suppress source map warnings during build
+          # Chrome flags for headless mode to suppress WebGL warnings
+          ELECTRON_EXTRA_LAUNCH_ARGS: '--disable-gpu --enable-unsafe-swiftshader'
 
       # Step 8: Upload Cypress screenshots if tests fail
       - name: Upload Cypress Screenshots

cypress.config.js

@@ -36,7 +36,7 @@ module.exports = defineConfig({
     responseTimeout: 30000,
     execTimeout: 60000,
     taskTimeout: 60000,
-    
+
     retries: {
       // Retry failed tests in CI/headless mode
       runMode: 1,
@@ -49,11 +49,11 @@ module.exports = defineConfig({
 
     // Experiment features
     experimentalRunAllSpecs: true,
-    
+
     // Security and stability
     chromeWebSecurity: true,
     modifyObstructiveCode: false,
-    
+
     // Reporter configuration (for CI/CD)
     reporter: 'spec',
     reporterOptions: {
@@ -64,13 +64,13 @@ module.exports = defineConfig({
     env: {
       // API base URL for backend requests
       apiUrl: 'http://localhost:3001',
-      
+
       // Test timeout multiplier for slower environments
       slowTestThreshold: 10000,
-      
+
       // Coverage collection
       coverage: false,
-      
+
       // Code coverage directory
       codeCoverage: {
         url: 'http://localhost:3001/__coverage__',
@@ -94,6 +94,26 @@ module.exports = defineConfig({
         console.log(`   Duration: ${results.stats.duration}ms`);
       });
 
+      // Configure browser launch options
+      on('before:browser:launch', (browser = {}, launchOptions) => {
+        if (browser.family === 'chromium' || browser.name === 'chrome' || browser.name === 'electron') {
+          // Fix for "Automatic fallback to software WebGL has been deprecated" in CI
+          // These flags suppress WebGL warnings in headless/CI environments
+          launchOptions.args.push('--enable-unsafe-swiftshader');
+          launchOptions.args.push('--disable-gpu');
+          launchOptions.args.push('--disable-software-rasterizer');
+          launchOptions.args.push('--disable-dev-shm-usage');
+
+          // Only log in CI to avoid noise in local development
+          if (process.env.CI) {
+            console.log(`Injecting Chrome flags for ${browser.name}:`, launchOptions.args.filter(arg =>
+              arg.includes('gpu') || arg.includes('swiftshader') || arg.includes('rasterizer')
+            ));
+          }
+        }
+        return launchOptions;
+      });
+
       // Task for custom logging
       on('task', {
         log(message) {

package.json

@@ -38,12 +38,6 @@
     "test:e2e:chrome": "cypress run --browser chrome",
     "test:e2e:firefox": "cypress run --browser firefox"
   },
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "react-app/jest"
-    ]
-  },
   "browserslist": {
     "production": [
       ">0.2%",
@@ -56,4 +50,4 @@
       "last 1 safari version"
     ]
   }
-}
+}