ci.yml

name: Run CI build and tests

# Run this workflow every time a new commit pushed to your repository
on:
  push:
    branches:
      - main
      - stable/*
    tags:
      - '*'
  pull_request:
    types:
      - opened
      - reopened
      - synchronize
      # - ready_for_review  relevant for chromatic, at some point
  workflow_dispatch:

concurrency:
  group: '${{ github.workflow }}-${{ github.ref_name }}' # unique builds for branch/tag name
  cancel-in-progress: false  # do not cancel in progress, but only in-between builds

jobs:
  storybook:
    name: Create storybook build
    runs-on: ubuntu-latest

    steps:
      - uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version-file: '.nvmrc'
          cache: npm

      - name: Build Storybook docs
        run: |
          npm ci
          npm run compilemessages
          npm run build-storybook --quiet

      - name: Upload artifact
        uses: actions/upload-pages-artifact@v1
        with:
          path: ./storybook-static

  build-package:
    name: Create 'production' build
    runs-on: ubuntu-latest

    steps:
      - uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version-file: '.nvmrc'
          cache: npm

      - name: Install dependencies
        run: npm ci

      - name: Build library
        run: |
          npm run build
          npm run compilemessages

      - name: Store build artifact
        uses: actions/upload-artifact@v3
        with:
          name: build
          path: lib/
          retention-days: 1

  prettier:
    name: Check frontend code formatting with prettier
    runs-on: ubuntu-latest

    steps:
      - uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version-file: '.nvmrc'
          cache: npm

      - name: Install dependencies
        run: npm ci

      - name: Run prettier linter
        run: npm run checkformat

  tests:
    name: Run Storybook tests
    runs-on: ubuntu-latest
    needs:
      - storybook

    steps:
      - uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version-file: '.nvmrc'
          cache: npm

      - name: Install dependencies
        run: npm ci

      # Reference: https://storybook.js.org/docs/6.5/react/writing-tests/test-runner#run-against-non-deployed-storybooks
      - name: Set up test environment
        run: |
          npx playwright install --with-deps
          npm run compilemessages

      - name: Download storybook artifact
        uses: actions/download-artifact@v3
        with:
          name: github-pages
          path: storybook-static

      - name: Serve storybook and run tests
        run: |
          cd storybook-static/ && tar -xvf artifact.tar && cd ..
          npx concurrently -k -s first -n "SB,TEST" -c "magenta,blue" \
            "npx http-server storybook-static --port 6006 --quiet" \
            "npx wait-on -l http://127.0.0.1:6006 && npm test"

  deploy:
    runs-on: ubuntu-latest
    needs:
      - storybook
      - prettier
      - tests
    # do not run in forks & only publish main branch
    if: github.ref_name == 'main' && github.repository_owner == 'open-formulieren'

    environment:
      name: github-pages
      url: ${{ steps.deployment.outputs.page_url }}

    # Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
    permissions:
      contents: read
      pages: write
      id-token: write

    steps:
      - name: Setup Pages
        id: pages
        uses: actions/configure-pages@v3
      - name: Deploy to GitHub Pages
        id: deployment
        uses: actions/deploy-pages@v1

  publish:
    name: Publish the NPM package
    runs-on: ubuntu-latest
    needs:
      - build-package
      - tests
      - prettier

    # do not publish in forks or non-tag pushes
    if: startsWith(github.ref, 'refs/tags/') && github.repository_owner == 'open-formulieren'

    steps:
      - uses: actions/checkout@v3
      - uses: actions/setup-node@v3
        with:
          node-version-file: '.nvmrc'
          cache: npm
          registry-url: 'https://registry.npmjs.org'
          scope: '@open-formulieren'

      - name: Install dependencies
        run: npm ci

      - name: Download build artifact
        uses: actions/download-artifact@v3
        with:
          name: build
          path: lib/

      - name: Publish package to NPM
        run: |
          # Strip git ref prefix from version
          VERSION=$(echo "${{ github.ref }}" | sed -e 's,.*/\(.*\),\1,')

          npm publish --access public --new-version=$VERSION
        env:
          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}