Add Lighthouse CI and expand frontend CI/CD

Replace the previous frontend workflow with an expanded Build, Test & Push workflow. Adds a quality-check job (runs on push and PRs to main) that sets up Node.js, installs deps, runs lint/type checks, unit tests (ChromeHeadless), production build and runs LHCI. The docker job now depends on the quality-check job and only runs on pushes to main. Added lighthouserc.json and ignored .lighthouseci, relaxed two ESLint rules (@typescript-eslint/no-inferrable-types and no-explicit-any), and updated package.json (and lock) to include LHCI tooling.

.gitea/workflows/build-Frontend-a.yml

@@ -1,12 +1,58 @@
-name: Build & Push Frontend A
+name: Build, Test & Push Frontend
+run-name: ${{ gitea.actor }} build and test Angular 🚀
+
 on:
   push:
     branches:
       - main
+  pull_request:
+    branches:
+      - main
 
 jobs:
-  docker:
+  # ------------------------------------------------------------------
+  # JOB 1: Code integrity and quality gates (CI)
+    # ------------------------------------------------------------------
+  quality-check:
     runs-on: ubuntu-latest
+    steps:
+      - name: Checkout Code
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+          cache: 'npm'
+
+      - name: Install Dependencies
+        run: npm ci
+
+      # 1. Linting (Code-Style)
+      - name: Lint & Type Check
+        run: npm run lint --if-present
+
+      # 2. Unit Tests (Logik)
+      - name: Unit Tests
+        run: npx ng test --watch=false --browsers=ChromeHeadless
+
+      # 3. Build Production (für Lighthouse notwendig)
+      - name: Build Production
+        run: npx ng build --configuration production
+
+      # 4. Lighthouse Audit (Performance & SEO)
+      - name: Lighthouse CI
+        run: npx lhci autorun
+
+  # ------------------------------------------------------------------
+  # JOB 2: Docker Build & Push (CD)
+  # Runs only if 'quality-check' are successfully and we are on branch main.
+  # ------------------------------------------------------------------
+  docker:
+    needs: quality-check
+    runs-on: ubuntu-latest
+    if: github.event_name == 'push' && github.ref == 'refs/heads/main'
+
     steps:
       - uses: actions/checkout@v4
 
@@ -36,8 +82,7 @@ jobs:
             docker.io/${{ secrets.DOCKERHUB_USERNAME }}/playground:frontend-a-${{ steps.prep.outputs.branch }}
             docker.io/${{ secrets.DOCKERHUB_USERNAME }}/playground:frontend-a-${{ steps.prep.outputs.branch }}-${{ steps.prep.outputs.sha }}
 
-      - name: Also push moving main tag (only on main)
+      - name: Also push moving main tag
-        if: ${{ github.ref == 'refs/heads/main' }}
         uses: docker/build-push-action@v6
         with:
           context: .

.gitignore

@@ -41,3 +41,6 @@ __screenshots__/
 # System files
 .DS_Store
 Thumbs.db
+
+# Lighthouse
+.lighthouseci/

eslint.config.js

@@ -15,6 +15,8 @@ module.exports = defineConfig([
     ],
     processor: angular.processInlineTemplates,
     rules: {
+      "@typescript-eslint/no-inferrable-types": "off",
+      "@typescript-eslint/no-explicit-any": "off",
       "@angular-eslint/directive-selector": [
         "error",
         {

lighthouserc.json

@@ -0,0 +1,11 @@
+{
+  "ci": {
+    "collect": {
+      "numberOfRuns": 1,
+      "staticDistDir": "./dist/playground-frontend/browser"
+    },
+    "upload": {
+      "target": "temporary-public-storage"
+    }
+  }
+}

package.json

@@ -30,6 +30,7 @@
     "@angular/build": "~21.1.0",
     "@angular/cli": "~21.1.0",
     "@angular/compiler-cli": "~21.1.0",
+    "@lhci/cli": "~0.15.1",
     "@types/jasmine": "~5.1.15",
     "angular-eslint": "21.2.0",
     "eslint": "^9.39.2",