Feat: Playwright testing for boilerplate

.codepipeline/docker/setup.sh

@@ -21,7 +21,7 @@ fi
 
 echo "🏗️  Setting up Cosine"
 
-#Copy the config template if config.php doens't exist
+#Copy the config template if config.php doesn't exist
 if [ ! -f config.php ]; then
     echo "Installing config.php"
     cp /bootstrap/config.default.php config.php

.github/workflows/docker-image.yml

@@ -33,6 +33,17 @@ jobs:
         with:
           driver: docker-container
 
+      - name: Set Vars
+        id: vars
+        run: |
+          # Set the core branch to use for tests
+          if [ "${{ github.ref }}" == "refs/heads/master" ] || [ "${{ github.event.pull_request.base.ref }}" == "master" ]; then
+            # Base branch or current branch of boilerplate is master
+            echo "CORE_BRANCH=main" >> $GITHUB_ENV
+          else
+            echo "CORE_BRANCH=develop" >> $GITHUB_ENV
+          fi
+
       # Build all the tags for the image
       - name: Create tags
         id: meta
@@ -66,6 +77,8 @@ jobs:
         with:
           context: .
           push: true
+          build-args: |
+            BUILT_IN_CORE_BRANCH=${{ env.CORE_BRANCH }}
           tags: ${{ steps.meta.outputs.tags }}
           labels: ${{ steps.meta.outputs.labels }}
           cache-from: type=registry,ref=ghcr.io/2pisoftware/cmfive:buildcache
@@ -80,6 +93,8 @@ jobs:
         with:
           context: .
           push: true
+          build-args: |
+            BUILT_IN_CORE_BRANCH=${{ env.CORE_BRANCH }}
           tags: ${{ steps.meta.outputs.tags }}
           labels: ${{ steps.meta.outputs.labels }}
           cache-from: type=registry,ref=ghcr.io/2pisoftware/cmfive:buildcache
@@ -101,3 +116,10 @@ jobs:
           github-token: ${{ secrets.GITHUB_TOKEN }} # to be able to write the comment
           dockerhub-user: ${{ secrets.DOCKER_USER }}
           dockerhub-password: ${{ secrets.DOCKER_TOKEN }}
+
+  playwright:
+    needs: build-and-publish
+    uses: ./.github/workflows/playwright.yml
+    # Only run on pull requests
+    if: github.event_name == 'pull_request'
+

.github/workflows/playwright.yml

@@ -0,0 +1,255 @@
+name: Playwright
+on:
+  workflow_dispatch:
+  workflow_call:
+
+env:
+  DB_HOST: mysql-8
+  DB_PORT: 3306
+  DB_USERNAME: cmfive_test
+  DB_PASSWORD: cmfive_test
+  DB_DATABASE: cmfive_test
+
+jobs:
+
+  playwright:
+    # Steps: Checkout the code, Pull Docker image from PR (eg ghcr.io/2pisoftware/cmfive:pr-123), Run docker container, Run playwright tests
+    name: Playwright
+    runs-on: ubuntu-latest
+
+    steps:
+      # Set Boilerplate variables by determing which image and branch to use
+      - name: Set Vars
+        id: vars
+        run: |
+          # Set the boilerplate image to the current PR
+          echo "BOILERPLATE_IMAGE=ghcr.io/2pisoftware/cmfive:pr-${{ github.event.pull_request.number }}" >> $GITHUB_ENV
+
+          # Set the core branch to use for tests
+          if [ "${{ github.ref }}" == "refs/heads/master" ] || [ "${{ github.event.pull_request.base.ref }}" == "master" ]; then
+            # Base branch or current branch of boilerplate is master
+            echo "CORE_BRANCH=main" >> $GITHUB_ENV
+          else
+            echo "CORE_BRANCH=develop" >> $GITHUB_ENV
+          fi
+
+      # Checkout the boilerplate
+      - name: Checkout boilerplate
+        uses: actions/checkout@v4
+        with:
+          path: boilerplate
+
+      # Checkout core
+      - name: Checkout core
+        uses: actions/checkout@v4
+        with:
+          repository: '2pisoftware/cmfive-core'
+          ref: ${{ env.CORE_BRANCH }}
+          path: core
+
+      # Pull the boilerplate image and MySQL 8
+      - name: Pull Docker images
+        run: |
+          docker pull $BOILERPLATE_IMAGE
+          docker pull mysql:8
+
+      # Start cosine and MySQL 8 containers
+      - name: Start containers
+        run: |
+          # Link system dir
+          cd boilerplate
+          ln -s ../core/system system
+
+          # Change owner
+          sudo chown -R 1000:1000 .
+
+          # Create docker network
+          echo "Setting up docker"
+          docker network create cmfive
+
+          # Create MySQL 8 container
+          echo "Starting MySQL 8"
+          docker run --name mysql-8 -d -p 3306:3306 \
+            -e MYSQL_ROOT_PASSWORD=root \
+            -e MYSQL_DATABASE=$DB_DATABASE \
+            -e MYSQL_USER=$DB_USERNAME \
+            -e MYSQL_PASSWORD=$DB_PASSWORD \
+            --network=cmfive \
+            mysql:8
+
+          # Wait for MySQL to start
+          echo "Waiting for MySQL to start"
+          time=0
+          while ! docker exec mysql-8 mysqladmin ping -u$DB_USERNAME -p$DB_PASSWORD --silent; do
+            sleep 1
+            time=$((time+1))
+            if [ $time -gt 60 ]; then
+              echo "MySQL failed to start"
+              exit 1
+            fi
+          done
+
+          # Create Cmfive container
+          echo "Starting Cmfive"
+          docker run --name cmfive -d -p 3000:80 \
+            -v ${{ github.workspace }}/boilerplate/.codepipeline/test_agent/configs/test_agent-config.php:/var/www/html/config.php:rw \
+            -v ${{ github.workspace }}/boilerplate/test:/var/www/html/test:rw \
+            -v ${{ github.workspace }}/boilerplate/storage:/var/www/html/storage:rw \
+            -e DB_HOST=mysql-8 \
+            -e DB_USERNAME=$DB_USERNAME \
+            -e DB_PASSWORD=$DB_PASSWORD \
+            -e DB_DATABASE=$DB_DATABASE \
+            -e ENVIRONMENT=development \
+            --network=cmfive \
+            $BOILERPLATE_IMAGE
+          # Note: system is mounted to a volume to avoid conflicts with the symlink
+
+          # Wait for cmfive healthcheck to be healthy
+          echo "Waiting for Cmfive to start"
+          time=0
+          while [ "$(docker inspect -f '{{.State.Health.Status}}' cmfive)" != "healthy" ]; do
+            sleep 1
+            time=$((time+1))
+            if [ $time -gt 60 ]; then
+              echo "Cmfive failed to start"
+              exit 1
+            fi
+          done
+
+      # Pre-requisites Prepare Cmfive Environment
+      - name: Setup cmfive Test Environment
+        run: |
+          docker exec -t cmfive sh -c "chmod -R ugo=rwX /var/www/html*"
+
+      - name: Inject configs into cmfive Test Environment
+        run: |
+          echo "Inheriting test_agent config from PIPELINE"
+
+          # Define extra config
+          CONFIG='
+          Config::append(\"tests\", [\"testrunner\" => \"ENABLED\"]);
+          '
+
+          # Write extra config to cmfive container
+          docker exec -t cmfive sh -c "echo \"$CONFIG\" >> /var/www/html/config.php"
+
+      - name: Install dev tools
+        env:
+          CONTAINER: cmfive
+        run: |
+          if [ -f ./boilerplate/.codepipeline/docker/install_dev_tools.sh ]; then
+            ./boilerplate/.codepipeline/docker/install_dev_tools.sh
+          else
+            echo "⚠️  WARNING: could not find dev tools in boilerplate"
+          fi
+
+      - name: Prepare cmfive Test DB
+        run: |
+          docker exec -t cmfive sh -c "DB_HOST=mysql-8 DB_USERNAME=root DB_PASSWORD=root DB_DATABASE=$DB_DATABASE DB_PORT=3306 php cmfive.php testDB setup; exit \$?";
+
+      # Setup Node
+      - uses: actions/setup-node@v4
+        with:
+            node-version: 20
+
+      # Run Unit Tests
+      - name: "Run unit tests"
+        run: |
+          docker exec -u root cmfive chmod -R ugo=rwX /var/www/html/test/
+          docker exec -u cmfive cmfive sh -c "DB_HOST=mysql-8 DB_USERNAME=$DB_USERNAME DB_PASSWORD=$DB_PASSWORD DB_DATABASE=$DB_DATABASE DB_PORT=3306 php cmfive.php tests unit all; exit \$?"
+          if [ $? -gt 0 ]; then
+            echo "Admin module tests failed"
+          fi
+      # Setup playwright
+      - name: Setup Playwright
+        run: |
+          echo "Installing Playwright"
+          cd boilerplate/test/playwright
+          npm ci
+          npx playwright install --with-deps
+
+      - name: "Run admin module tests"
+        run: |
+            docker exec -u root cmfive sh -c "chmod ugo=rwX -R /var/www/html/system/modules/admin/install/migrations/"
+            cd boilerplate/test/playwright
+            npm run build
+            npm run test --module="admin" --reporter="github"
+            if [ $? -gt 0 ]; then
+                echo "Admin module tests failed"
+            fi
+      - name: "Run channel module tests"
+        run: |
+            cd boilerplate/test/playwright
+            npm run build
+            npm run test --module="channel" --reporter="github"
+            if [ $? -gt 0 ]; then
+                echo "Channel module tests failed"
+            fi
+      - name: "Run form module tests"
+        run: |
+            cd boilerplate/test/playwright
+            npm run build
+            npm run test --module="form" --reporter="github"
+            if [ $? -gt 0 ]; then
+                echo "Form module tests failed"
+            fi
+      - name: "Run report module tests"
+        run: |
+          cd boilerplate/test/playwright
+          npm run build
+          npm run test --module="report" --reporter="github"
+          if [ $? -gt 0 ]; then
+            echo "Report module tests failed"
+          fi
+      - name: "Run tag module tests"
+        run: |
+            cd boilerplate/test/playwright
+            npm run build
+            npm run test --module="tag" --reporter="github"
+            if [ $? -gt 0 ]; then
+                echo "Tag module tests failed"
+            fi
+      - name: "Run task module tests"
+        run: |
+            cd boilerplate/test/playwright
+            npm run build
+            npm run test --module="task" --reporter="github"
+            if [ $? -gt 0 ]; then
+                echo "Task module tests failed"
+            fi
+      - name: "Run timelog module tests"
+        run: |
+            cd boilerplate/test/playwright
+            npm run build
+            npm run test --module="timelog" --reporter="github"
+            if [ $? -gt 0 ]; then
+                echo "Timelog module tests failed"
+            fi
+
+      - name: Get container logs
+        if: ${{ failure() }} || ${{ success() }}
+        run: |
+          docker logs cmfive | sudo tee cmfive_container.log
+
+      - name: Stop containers
+        # the containers should be stopped regardless of 
+        # the test result
+        if: always()
+        run: |
+          docker rm cmfive -f
+          docker rm mysql-8 -f
+          docker network rm cmfive
+
+      # Store Test Results
+      - name: Test results
+        if: ${{ failure() }} || ${{ success() }}
+        uses: actions/upload-artifact@v4
+        with:
+          name: test-output-${{matrix.node_version}}
+          path: |
+            boilerplate/test/Codeception/tests/_output/
+            boilerplate/storage/log/
+            boilerplate/test/playwright/test-results/
+            boilerplate/test/playwright/playwright-report/
+            cmfive_container.log
+          retention-days: 5

Dockerfile

@@ -1,8 +1,8 @@
 # ==========================================================================
-# ## Cmfive docker image ##
+# ## Cosine docker image ##
 # ==========================================================================
 
-# This image provides a fully working cmfive instance
+# This image provides a fully working Cosine instance
 
 # It provides the following build arguments:
 # - CORE_BRANCH: The branch to clone from the cmfive-core repository
@@ -32,16 +32,20 @@ ADD https://api.github.com/repos/2pisoftware/cmfive-core/git/refs/heads/$BUILT_I
 # Clone github.com/2pisoftware/cmfive-core
 RUN git clone --depth 1 https://github.com/2pisoftware/cmfive-core.git -b $BUILT_IN_CORE_BRANCH
 
+# Get the repo metadata
+RUN cd /cmfive-core && \
+    git log -1 --pretty=format:"CORE_HASH=\"%H\"%nCORE_COMMIT_MSG=\"%s\"%nCORE_REF=\"%D\"" > /.core-metadata
+
 # Compile the theme
 RUN cd /cmfive-core/system/templates/base && \
     npm ci && \
     npm run production
 
 # --------------------------------------------------------------------------
-# == Cmfive stage ==
+# == Cosine stage ==
 # --------------------------------------------------------------------------
 
-# This stage builds the final cmfive image
+# This stage builds the final Cosine image
 
 # Use the Alpine Linux base image
 FROM alpine:3.19.4
@@ -128,6 +132,12 @@ COPY --chown=cmfive:cmfive \
     /cmfive-core/system/ \
     composer/vendor/2pisoftware/cmfive-core/system/
 
+# Metadata for core
+COPY --chown=cmfive:cmfive \
+    --from=core \
+    /.core-metadata \
+    /.core-metadata
+
 # Link system
 RUN ln -s composer/vendor/2pisoftware/cmfive-core/system/ system