test.yml

name: Test

on:
  push:

env:
  # Group output as we make heavy use of parallel and nested tasks.
  TASK_OUTPUT: "--output group --output-group-begin '::group::{{.TASK}}' --output-group-end '::endgroup::'"

jobs:
  test:
    runs-on: ubuntu-22.04
    steps:
      - uses: actions/checkout@v4
      - name: Setup Node
        uses: actions/setup-node@v4
        with:
          # TODO replace which with what can be read from .nvmrc if we get a
          # separation between checkout and install
          node-version: 'lts/*'
          registry-url: 'https://npm.pkg.github.com'
        env:
          NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
      - name: Setup go-task
        uses: arduino/setup-task@v1
        with:
          repo-token: ${{ secrets.GITHUB_TOKEN }}
      - name: Initialize environment
        run: "task init ${{ env.TASK_OUTPUT }}"
      - name: Prepare CMS for development
        run: "task cms:dev ${{ env.TASK_OUTPUT }}"
      - name: Link Design system to React components
        run: "task react:link ${{ env.TASK_OUTPUT }}"
      - name: Link Design system and React components to CMS
        run: "task cms:link ${{ env.TASK_OUTPUT }}"
      - name: Link Design system to React components (again)
        run: "task react:link ${{ env.TASK_OUTPUT }}"
      - name: Link Design system and React components to CMS (again)
        run: "task cms:link ${{ env.TASK_OUTPUT }}"
      - name: Test React components after linking
        uses: cypress-io/github-action@v6
        with:
          start: yarn start:storybook:test
          wait-on: "http://localhost:57021"
          browser: chrome
          working-directory: react
          # A single test should be sufficient to ensure that Storybook can
          # start, the React components work etc. after linking.
          # The demo modal test is simple and quick to execute.
          spec: src/apps/demo-modal/demo-modal.test.ts
      - name: Test CMS after linking
        working-directory: cms
        # A single request to see that the frontpage can be retrieved should be
        # sufficient to ensure that Drupal can bootstrap and return a page.
        # If we can get ports for running containers in the CMS directory after
        # initializing then docker commands within the subdirectory will work
        # with the Dapple-initiated containers as expected.
        run: "curl --fail http://localhost:$(docker compose port varnish 8080 | cut -d: -f2)"
      # Test that changes to design system results in changes in React component dependencies
      - name: Store current build of Design system in React components
        run: |
          mkdir ${{ runner.temp }}/design-system
          cp node_modules/@danskernesdigitalebibliotek/dpl-design-system/build/css/base.css ${{ runner.temp }}/design-system/base.before.css
        working-directory: react
      - name: Update design system file
        run: |
          echo -e "\nh1 { color: pink; }\n" >> src/stories/Library/typography/typography.scss
        working-directory: design-system
      - name: Build Design system
        run: "task design-system:build ${{ env.TASK_OUTPUT }}"
      - name: Store new build of Design system in React components
        run: |
          cp node_modules/@danskernesdigitalebibliotek/dpl-design-system/build/css/base.css ${{ runner.temp }}/design-system/base.after.css
        working-directory: react
      - name: Ensure there is a difference between design system builds in React components
        # We expect a difference and diff will return an error code if there is
        # a difference. Reverse this using !.
        run: |
          ! diff ${{ runner.temp }}/design-system/base.before.css ${{ runner.temp }}/design-system/base.after.css
      - name: Store info on current build of React components in CMS
        run: |
          mkdir ${{ runner.temp }}/react
          docker compose cp php:app/web/libraries/dpl-react/version.json ${{ runner.temp }}/react/version.before.json
        working-directory: cms
      - name: Update React component
        run: |
          echo -e "\nconsole.log('Hello world!');\n" >> src/apps/hello-world/hello-world.tsx
        working-directory: react
      - name: Build React components for CMS
        # Normally this would happen automatically through file watchers when
        # files are changed. We are not running with file watchers in GitHub
        # actions so updated links to the CMS automatically.
        run: "task cms:link ${{ env.TASK_OUTPUT }}"
      - name: Store new build of React components in CMS
        run: |
          docker compose cp php:app/web/libraries/dpl-react/version.json ${{ runner.temp }}/react/version.after.json
        working-directory: cms
      - name: Ensure there is a difference between React builds in CMS
        # We expect a difference and diff will return an error code if there is
        # a difference. Reverse this using !.
        run: |
          ! diff ${{ runner.temp }}/react/version.before.json ${{ runner.temp }}/react/version.after.json
      - name: Reset environment
        run: "task reset ${{ env.TASK_OUTPUT }}"
      - name: Setup tmate session to support debugging if enabled
        if:  runner.debug == '1'
        uses: mxschmitt/action-tmate@v3
        timeout-minutes: 15