feat: implement playwright sharding with CI environment improvements (#1309)

* feat: add sharded playwright

* feat: try docker build push ghcr

* feat: update CI workflow to conditionally run jobs and handle missing artifacts in Playwright tests

* chore: comment out conditional jobs in CI for testing purposes

* feat: leverage .env.local.template for CI environment defaults in Docker builds

- Add script to export env vars from template to GitHub Actions env
- Update Dockerfile to include all environment variables from .env.local.template
- Update GitHub workflow to read env vars from .env.local.template
- Dynamically collect environment variables for Docker build
- Mark all values as secrets in GitHub Actions for security
- Update documentation with implementation details

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>

* fix: update build args generation in CI workflow

Replace problematic variable expansion with printenv to fix GitHub Actions syntax error

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>

* fix(ci): simpler approach, cleanup

* feat(ci): enhance Docker build process and artifact handling

- Extract build args from environment file
- Save and upload Docker image as tarball
- Update workflow to utilize new image outputs

* feat(ci): improve Playwright test setup and configuration

- Set environment variables for Next app and Playwright command
- Adjust Docker compose port mapping for clarity
- Update Playwright config for conditional server command

* fix(ci): update Playwright command to use `--rm` for better container management

* feat(ci): refine Playwright command and port setup for better compatibility

- Change Playwright command to `docker compose up`
- Update Next app port configuration

* feat(ci): enhance Playwright setup with startup checks and background logging

- Add health check loop for Next app readiness
- Update Docker command to run in detached mode

* feat(ci): improve CI workflow with focused shard config and enhanced app readiness checks

- Simplify matrix shard to only 1
- Add startup and readiness verification logic for Next app

* cleanup

* Revert "cleanup"

This reverts commit 542126a.

* use ubuntu latest

* speed up playwright merge reports

* Add option to install Tilt in setup-env action and check if already installed in install-tilt action

* Update next-app service in CI to use .env.local and increase wait time for readiness check

* Fix install-tilt action to run installation script from /tmp for better isolation

* Add brew-bundle option to setup-env action for installing dependencies with Brew

* Update CI workflow to use --env-file option for next-app docker compose command for improved environment variable management

* Add Homebrew setup step and cleanup to setup-env action to streamline dependency management in CI workflows

* Remove redundant shell declaration from Homebrew setup step in setup-env action to simplify configuration

* Add Docker container specification for jobs in CI workflow to standardize execution environment across all steps

* Remove Docker container from CI workflow jobs to simplify configuration and avoid redundancy across execution environments

* Update Docker Compose to set resource limits and reservations for deployment, enhancing performance and resource management

* Increase CI timeout to 60 minutes and streamline Playwright tests setup in workflow for better reliability and performance

* Fix environment variable setup in CI for Docker compatibility, replacing localhost with host.docker.internal when necessary

* Enhance CI workflow by adding skip_docker_compose flag to control Docker Compose execution based on configuration settings

* Refactor CI workflow to properly pass --skip_docker_compose flag in tilt command and remove redundant debug step for clarity

* Update CI workflow to use correct .env.local file and improve artifact handling for Playwright test results and reports

* Fix CI workflow paths for Playwright reports and improve error handling in Markdown report generation

* Update CI workflow to generalize blob report pattern and streamline artifact processing for improved readability

* Refactor CI workflow to enhance Playwright report path handling and improve error messaging in Markdown report output

* Enhance CI workflow to enable all shards in matrix for improved testing coverage and reliability across builds

---------

Co-authored-by: Claude <[email protected]>

Author: 0xBigBoss

.github/actions/docker-build/action.yml

@@ -1,54 +1,80 @@
-name: "Setup Docker Build Environment"
-description: "Set up Node.js, install Foundry, and set up Bun. Runs Yarn install run docker build"
+name: "Build and Push Next App Docker Image"
+description: "Builds the next-app Docker image using Buildx, caches layers with GHCR, tags, and pushes to GHCR."
+
 inputs:
-  build-nextjs-docker:
-    description: "Whether to build Next.js docker image"
-    required: false
-    default: "true"
-  push-nextjs-docker-image:
-    description: "Whether to push build to dockerhub"
-    required: false
-    default: "false"
-  dockerhub_username:
-    description: "Username to login to dockerhub"
-    required: false
-  dockerhub_password:
-    description: "Password to login to dockerhub"
+  build-args:
+    description: "Build arguments to pass to docker buildx build (e.g., 'ARG1=value1 ARG2=value2')"
     required: false
+    default: ""
+  ghcr-token:
+    description: "Token for authenticating with GHCR"
+    required: true
+    default: ${{ github.token }}
+  image-name:
+    description: "Base name for the image in GHCR (e.g., next-app)"
+    required: true
+    default: "next-app"
+
+outputs:
+  image-tag:
+    description: "The full GHCR tag of the pushed image (e.g., ghcr.io/owner/repo/next-app:sha)"
+    value: ${{ steps.build-and-push.outputs.image-tag }}
+
 runs:
   using: "composite"
   steps:
-    - name: Use Node.js
-      if: ${{ inputs.build-nextjs-docker == 'true' }}
-      uses: actions/setup-node@v4
-      with:
-        node-version-file: .node-version
-        cache: "yarn"
-    - name: Setup Bun
-      if: ${{ inputs.build-nextjs-docker == 'true' }}
-      uses: oven-sh/setup-bun@v1
-    - name: Install Foundry
-      if: ${{ inputs.build-nextjs-docker == 'true' }}
-      uses: foundry-rs/foundry-toolchain@v1
+    - name: Login to GitHub Container Registry
+      uses: docker/login-action@v3
       with:
-        version: stable
-    - name: Yarn Install
-      if: ${{ inputs.build-nextjs-docker == 'true' }}
+        registry: ghcr.io
+        username: ${{ github.actor }}
+        password: ${{ inputs.ghcr-token }}
+
+    - name: Generate Image Tag
+      id: generate-tag
       shell: bash
-      run: yarn install --immutable
-    - name: Build Next.js
-      if: ${{ inputs.build-nextjs-docker == 'true' }}
+      run: |
+        SHORT_SHA=$(git rev-parse --short=10 HEAD)
+        IMAGE_TAG="ghcr.io/${{ github.repository_owner }}/${{ github.event.repository.name }}/${{ inputs.image-name }}:${SHORT_SHA}"
+        echo "IMAGE_TAG=${IMAGE_TAG,,}" >> $GITHUB_OUTPUT # Lowercase for Docker compatibility
+        
+    - name: Set Environment Variables from Template
       shell: bash
       run: |
-        cp .env.local.template .env.local
-        yarn web:docker:build
-        rm .env.local
-    - uses: docker/login-action@v3
-      if: ${{ inputs.build-nextjs-docker == 'true' }} && ${{ inputs.push-nextjs-docker-image == 'true' }}
-      with:
-        username: ${{ inputs.dockerhub_username }}
-        password: ${{ inputs.dockerhub_password }}
-    - name: Push to dockerhub
+        if [ -f "./scripts/github-actions-set-env-from-template.sh" ]; then
+          chmod +x ./scripts/github-actions-set-env-from-template.sh
+          ./scripts/github-actions-set-env-from-template.sh .env.local.template
+        else
+          echo "Warning: Environment script not found, using default environment variables"
+        fi
+
+    - name: Build and Push Docker Image
+      id: build-and-push
       shell: bash
-      if: ${{ inputs.build-nextjs-docker == 'true' }} && ${{ inputs.push-nextjs-docker-image == 'true' }}
-      run: yarn web:docker:push
+      run: |
+        BUILD_ARGS_STRING=""
+        if [[ -n "${{ inputs.build-args }}" ]]; then
+          for arg in ${{ inputs.build-args }}; do
+            BUILD_ARGS_STRING+=" --build-arg $arg"
+          done
+        fi
+        
+        # Add environment variables from template as build arguments
+        # Only include variables starting with NEXT_PUBLIC_ for the Next.js build
+        for var in $(env | grep "^NEXT_PUBLIC_" | cut -d= -f1); do
+          BUILD_ARGS_STRING+=" --build-arg ${var}=${!var}"
+        done
+
+        echo "Building image: ${{ steps.generate-tag.outputs.IMAGE_TAG }}"
+        echo "Using build args:${BUILD_ARGS_STRING}" # Be careful not to expose secrets here
+
+        docker buildx build \
+          --tag ${{ steps.generate-tag.outputs.IMAGE_TAG }} \
+          --cache-from type=gha \
+          --cache-to type=gha,mode=max \
+          --push \
+          -f ./apps/next/Dockerfile \
+          ${BUILD_ARGS_STRING} \
+          .
+
+        echo "image-tag=${{ steps.generate-tag.outputs.IMAGE_TAG }}" >> $GITHUB_OUTPUT

.github/actions/install-tilt/action.yml

@@ -1,8 +1,9 @@
 name: "Install Tilt"
+description: "Installs Tilt if not already installed."
 runs:
   using: "composite"
   steps:
     - name: Install Tilt
       id: tilt
       shell: bash
-      run: curl -fsSL https://raw.githubusercontent.com/tilt-dev/tilt/master/scripts/install.sh | bash
+      run: command -v tilt || cd /tmp && curl -fsSL https://raw.githubusercontent.com/tilt-dev/tilt/master/scripts/install.sh | bash

.github/actions/setup-env/action.yml

@@ -21,6 +21,14 @@ inputs:
     description: "Whether to build Next.js."
     required: false
     default: "false"
+  install-tilt:
+    description: "Whether to install Tilt."
+    required: false
+    default: "true"
+  brew-bundle:
+    description: "Whether to run Brew bundle."
+    required: false
+    default: "true"
 runs:
   using: "composite"
   steps:
@@ -49,6 +57,20 @@ runs:
       if: ${{ inputs.yarn-install == 'true' }}
       shell: bash
       run: yarn install --immutable  --inline-builds
+    - name: Install Tilt
+      if: ${{ inputs.install-tilt == 'true' }}
+      uses: ./.github/actions/install-tilt
+    - name: Set up Homebrew
+      if: ${{ inputs.brew-bundle == 'true' }}
+      id: set-up-homebrew
+      uses: Homebrew/actions/setup-homebrew@master
+    - name: Brew Bundle
+      if: ${{ inputs.brew-bundle == 'true' }}
+      shell: bash
+      id: brew-bundle
+      run: |
+        brew bundle
+        brew cleanup
     - name: Build Next.js
       if: ${{ inputs.build-nextjs == 'true' }}
       shell: bash