test: add comprehensive E2E testing with Playwright and CI workflows

.github/workflows/e2e-tests.yml

@@ -0,0 +1,348 @@
+# Copyright The Linux Foundation and each contributor to LFX.
+# SPDX-License-Identifier: MIT
+
+name: E2E Tests
+
+permissions:
+  id-token: write
+  contents: read
+  issues: write
+  pull-requests: write
+
+on:
+  workflow_call:
+    inputs:
+      node-version:
+        description: 'Node.js version to use'
+        required: false
+        default: '22'
+        type: string
+      test-command:
+        description: 'Test command to run'
+        required: false
+        default: 'e2e'
+        type: string
+      browser:
+        description: 'Browser to test (chromium, firefox, mobile-chrome, or all)'
+        required: false
+        default: 'all'
+        type: string
+      base-url:
+        description: 'Base URL for testing'
+        required: false
+        default: 'http://localhost:4200'
+        type: string
+      skip-build:
+        description: 'Skip building the application (use existing build)'
+        required: false
+        default: false
+        type: boolean
+    secrets:
+      TEST_USERNAME:
+        description: 'Username for test authentication'
+        required: false
+      TEST_PASSWORD:
+        description: 'Password for test authentication'
+        required: false
+    outputs:
+      test-results:
+        description: 'Test results summary'
+        value: ${{ jobs.e2e-tests.outputs.test-results }}
+      report-url:
+        description: 'URL to the test report artifact'
+        value: ${{ jobs.e2e-tests.outputs.report-url }}
+
+jobs:
+  e2e-tests:
+    name: Playwright E2E Tests
+    runs-on: ubuntu-latest
+    timeout-minutes: 30
+
+    outputs:
+      test-results: ${{ steps.test-results.outputs.results }}
+      report-url: ${{ steps.upload-report.outputs.artifact-url }}
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Enable Corepack
+        run: corepack enable
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ inputs.node-version }}
+          cache: 'yarn'
+
+      - name: Install dependencies
+        run: yarn install --immutable
+
+      - name: OIDC Auth
+        uses: aws-actions/configure-aws-credentials@v4
+        id: oidc-auth
+        with:
+          audience: sts.amazonaws.com
+          role-to-assume: arn:aws:iam::788942260905:role/github-actions-deploy
+          aws-region: us-west-2
+
+      - name: Read secrets from AWS Secrets Manager into environment variables
+        id: get_secrets
+        uses: aws-actions/aws-secretsmanager-get-secrets@v2
+        with:
+          secret-ids: |
+            SUPABASE, /cloudops/managed-secrets/cloud/supabase/api_key
+            AUTH0,  /cloudops/managed-secrets/auth0/LFX_V2_PCC
+
+      - name: Setup Turborepo cache
+        uses: actions/cache@v4
+        with:
+          path: |
+            .turbo
+            node_modules/.cache/turbo
+          key: ${{ runner.os }}-turbo-${{ hashFiles('**/yarn.lock') }}-${{ hashFiles('**/*', '!**/node_modules/**', '!**/.turbo/**') }}
+          restore-keys: |
+            ${{ runner.os }}-turbo-${{ hashFiles('**/yarn.lock') }}-
+            ${{ runner.os }}-turbo-
+
+      - name: Validate required secrets for E2E testing
+        id: validate-secrets
+        run: |
+          missing_secrets=""
+
+          # Check AWS Secrets Manager secrets (masked environment variables)
+          if [ -z "$AUTH0" ]; then
+            missing_secrets="$missing_secrets AUTH0 (from AWS Secrets Manager)"
+          fi
+          if [ -z "$SUPABASE" ]; then
+            missing_secrets="$missing_secrets SUPABASE (from AWS Secrets Manager)"
+          fi
+
+          # Check GitHub secrets (fallback)
+          if [ -z "${{ secrets.TEST_USERNAME }}" ]; then
+            missing_secrets="$missing_secrets TEST_USERNAME"
+          fi
+          if [ -z "${{ secrets.TEST_PASSWORD }}" ]; then
+            missing_secrets="$missing_secrets TEST_PASSWORD"
+          fi
+
+          if [ -n "$missing_secrets" ]; then
+            echo "❌ Missing required secrets for E2E testing:$missing_secrets"
+            echo "Please configure these secrets to enable E2E tests."
+            echo "can_run_tests=false" >> $GITHUB_OUTPUT
+          else
+            echo "✅ All required secrets are configured"
+            echo "can_run_tests=true" >> $GITHUB_OUTPUT
+          fi
+
+      - name: Set up non-sensitive environment variables
+        if: steps.validate-secrets.outputs.can_run_tests == 'true'
+        run: |
+          echo "ENV=development" >> $GITHUB_ENV
+          echo "PCC_BASE_URL=http://localhost:4200" >> $GITHUB_ENV
+          echo "PCC_AUTH0_ISSUER_BASE_URL=https://linuxfoundation-dev.auth0.com/" >> $GITHUB_ENV
+          echo "PCC_AUTH0_AUDIENCE=https://api-gw.dev.platform.linuxfoundation.org/" >> $GITHUB_ENV
+          echo "CI=true" >> $GITHUB_ENV
+
+      - name: Set up sensitive environment variables
+        if: steps.validate-secrets.outputs.can_run_tests == 'true'
+        run: |
+          # Parse and set AUTH0 secrets with explicit masking
+          if [ -n "$AUTH0" ]; then
+            AUTH0_CLIENT_ID=$(echo "$AUTH0" | jq -r '.client_id // empty')
+            AUTH0_CLIENT_SECRET=$(echo "$AUTH0" | jq -r '.client_secret // empty')
+
+            # Explicitly mask the values
+            echo "::add-mask::$AUTH0_CLIENT_ID"
+            echo "::add-mask::$AUTH0_CLIENT_SECRET"
+
+            # Set as environment variables
+            echo "PCC_AUTH0_CLIENT_ID=$AUTH0_CLIENT_ID" >> $GITHUB_ENV
+            echo "PCC_AUTH0_CLIENT_SECRET=$AUTH0_CLIENT_SECRET" >> $GITHUB_ENV
+            echo "✅ AUTH0 secrets set as masked environment variables"
+          fi
+
+          # Parse and set SUPABASE secrets
+          if [ -n "$SUPABASE" ]; then
+            SUPABASE_URL=$(echo "$SUPABASE" | jq -r '.url // empty')
+            SUPABASE_API_KEY=$(echo "$SUPABASE" | jq -r '.api_key // empty')
+
+            # Explicitly mask the values
+            echo "::add-mask::$SUPABASE_URL"
+            echo "::add-mask::$SUPABASE_API_KEY"
+
+            # Set as environment variables
+            echo "SUPABASE_URL=$SUPABASE_URL" >> $GITHUB_ENV
+            echo "POSTGRES_API_KEY=$SUPABASE_API_KEY" >> $GITHUB_ENV
+            echo "✅ SUPABASE secrets set as masked environment variables"
+          fi
+
+          # Set test credentials
+          echo "::add-mask::${{ secrets.TEST_USERNAME }}"
+          echo "::add-mask::${{ secrets.TEST_PASSWORD }}"
+          echo "TEST_USERNAME=${{ secrets.TEST_USERNAME }}" >> $GITHUB_ENV
+          echo "TEST_PASSWORD=${{ secrets.TEST_PASSWORD }}" >> $GITHUB_ENV
+
+      - name: Install Playwright browsers
+        if: steps.validate-secrets.outputs.can_run_tests == 'true'
+        working-directory: apps/lfx-pcc
+        run: npx playwright install --with-deps
+
+      - name: Create Playwright auth directory
+        if: steps.validate-secrets.outputs.can_run_tests == 'true'
+        working-directory: apps/lfx-pcc
+        run: mkdir -p playwright/.auth
+
+      - name: Build the application
+        if: steps.validate-secrets.outputs.can_run_tests == 'true'
+        run: yarn build
+
+      - name: Run E2E tests (All browsers)
+        if: ${{ inputs.browser == 'all' && steps.validate-secrets.outputs.can_run_tests == 'true' }}
+        working-directory: apps/lfx-pcc
+        run: |
+          if [ -n "$TEST_USERNAME" ] && [ -n "$TEST_PASSWORD" ]; then
+            echo "🔐 Running authenticated E2E tests on all browsers"
+            echo "🚀 Playwright will automatically start the dev server on localhost:4200"
+            echo "📋 Using secrets from AWS Secrets Manager"
+            yarn ${{ inputs.test-command }} --reporter=list
+          else
+            echo "⚠️ No test credentials provided. Skipping E2E tests."
+            echo "Set TEST_USERNAME and TEST_PASSWORD secrets to enable E2E tests."
+            exit 0
+          fi
+
+      - name: Run E2E tests (Specific browser)
+        if: ${{ inputs.browser != 'all' && steps.validate-secrets.outputs.can_run_tests == 'true' }}
+        working-directory: apps/lfx-pcc
+        run: |
+          if [ -n "$TEST_USERNAME" ] && [ -n "$TEST_PASSWORD" ]; then
+            echo "🔐 Running authenticated E2E tests on ${{ inputs.browser }}"
+            echo "🚀 Playwright will automatically start the dev server on localhost:4200"
+            echo "📋 Using secrets from AWS Secrets Manager"
+            yarn ${{ inputs.test-command }} --project=${{ inputs.browser }} --reporter=list
+          else
+            echo "⚠️ No test credentials provided. Skipping E2E tests."
+            echo "Set TEST_USERNAME and TEST_PASSWORD secrets to enable E2E tests."
+            exit 0
+          fi
+
+      - name: E2E tests skipped
+        if: ${{ steps.validate-secrets.outputs.can_run_tests == 'false' }}
+        run: |
+          echo "⏭️ E2E tests skipped due to missing required secrets"
+          echo "Configure the following secrets to enable E2E testing:"
+          echo ""
+          echo "AWS Secrets Manager (required):"
+          echo "  - /cloudops/managed-secrets/auth0/LFX_V2_PCC (AUTH0 configuration)"
+          echo "  - /cloudops/managed-secrets/cloud/supabase/api_key (SUPABASE configuration)"
+          echo ""
+          echo "GitHub Secrets (required for authenticated tests):"
+          echo "  - TEST_USERNAME"
+          echo "  - TEST_PASSWORD"
+
+      - name: Generate test results summary
+        id: test-results
+        if: always()
+        working-directory: apps/lfx-pcc
+        run: |
+          if [ "${{ steps.validate-secrets.outputs.can_run_tests }}" == "false" ]; then
+            echo "⏭️ E2E tests skipped (missing required secrets)"
+            echo "results=skipped" >> $GITHUB_OUTPUT
+          elif [ -z "$TEST_USERNAME" ] || [ -z "$TEST_PASSWORD" ]; then
+            echo "⏭️ E2E tests skipped (no test credentials)"
+            echo "results=skipped" >> $GITHUB_OUTPUT
+          elif [ -f "test-results/.last-run.json" ]; then
+            echo "✅ E2E tests completed successfully"
+            echo "results=success" >> $GITHUB_OUTPUT
+          else
+            echo "❌ E2E tests failed"
+            echo "results=failure" >> $GITHUB_OUTPUT
+          fi
+
+      - name: Upload Playwright report
+        id: upload-report
+        uses: actions/upload-artifact@v4
+        if: always()
+        with:
+          name: playwright-report-${{ inputs.browser }}-${{ github.run_id }}
+          path: |
+            apps/lfx-pcc/playwright-report/
+          retention-days: 7
+
+      - name: Comment test results on PR
+        if: github.event_name == 'pull_request' && always()
+        uses: actions/github-script@v7
+        with:
+          script: |
+            const results = '${{ steps.test-results.outputs.results }}';
+            const browser = '${{ inputs.browser }}';
+            const runId = '${{ github.run_id }}';
+
+            let emoji, status, details;
+
+            if (results === 'success') {
+              emoji = '✅';
+              status = 'passed';
+              details = 'All E2E tests passed successfully.';
+            } else if (results === 'failure') {
+              emoji = '❌';
+              status = 'failed';
+              details = 'Some E2E tests failed. Check the [test report](https://github.com/${{ github.repository }}/actions/runs/' + runId + ') for details.';
+            } else {
+              emoji = '⏭️';
+              status = 'skipped';
+              details = 'E2E tests were skipped (no test credentials provided).';
+            }
+
+            const comment = `## ${emoji} E2E Tests ${status.charAt(0).toUpperCase() + status.slice(1)}
+
+            **Browser:** ${browser}
+            **Status:** ${status}
+
+            ${details}
+
+            <details>
+            <summary>Test Configuration</summary>
+
+            - **Node.js:** ${{ inputs.node-version }}
+            - **Command:** \`${{ inputs.test-command }}\`
+            - **Browser:** ${browser}
+            - **Base URL:** ${{ inputs.base-url }}
+
+            </details>`;
+
+            // Look for existing E2E test comment by this bot
+            const existingComments = await github.rest.issues.listComments({
+              issue_number: context.issue.number,
+              owner: context.repo.owner,
+              repo: context.repo.repo
+            });
+
+            const botComment = existingComments.data.find(comment => 
+              comment.user.login === 'github-actions[bot]' && 
+              comment.body.includes('## ') && 
+              comment.body.includes('E2E Tests')
+            );
+
+            if (botComment) {
+              // Update existing comment
+              await github.rest.issues.updateComment({
+                comment_id: botComment.id,
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                body: comment
+              });
+              console.log('Updated existing E2E test comment');
+            } else {
+              // Create new comment
+              await github.rest.issues.createComment({
+                issue_number: context.issue.number,
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                body: comment
+              });
+              console.log('Created new E2E test comment');
+            }

.github/workflows/quality-check.yml

@@ -70,4 +70,17 @@ jobs:
         with:
           name: turbo-cache-summary
           path: .turbo/
-          retention-days: 1
+          retention-days: 1
+
+  e2e-tests:
+    name: E2E Tests
+    needs: quality-checks
+    uses: ./.github/workflows/e2e-tests.yml
+    with:
+      node-version: '22'
+      test-command: 'e2e'
+      browser: 'chromium'  # Use only Chromium for PR testing for faster feedback
+      skip-build: false
+    secrets:
+      TEST_USERNAME: ${{ secrets.TEST_USERNAME }}
+      TEST_PASSWORD: ${{ secrets.TEST_PASSWORD }}