ci.yml

name: Backpack CI

on:
  push:
    branches: [main]
  pull_request:

defaults:
  run:
    shell: bash -l {0}

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      - uses: actions/checkout@v2

      - name: Set the correct npm version
        run: nvm install && nvm use

      - name: Install dependencies from npm
        run: |
          nvm use
          npm ci

      - name: Build Backpack
        run: |
          nvm use
          npm run build

      - name: Confirm the build hasn't changed any files
        run: ./scripts/check-pristine-state package-lock.json

      - name: Run tests
        run: |
          nvm use
          npm test

      - name: Danger
        run: npm run danger
        if: github.ref != 'refs/heads/main' && github.repository == github.event.pull_request.head.repo.full_name
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

      - name: Build Storybook
        run: |
          nvm use
          npm run storybook:dist

      - name: Run visual tests
        id: visualTests
        run: |
          nvm use
          npm run jest:visual-tests

      - name: Upload failed visual tests (if necessary)
        uses: actions/upload-artifact@v2
        if: failure() && steps.visualTests.outcome == 'failure'
        with:
          name: failed-visual-tests
          path: .storybook/__image_snapshots__/__diff_output__

      - name: Post a comment about the visual tests (if they pass)
        uses: unsplash/comment-on-pr@master
        if: github.ref != 'refs/heads/main' && github.repository == github.event.pull_request.head.repo.full_name && steps.visualTests.outcome == 'success'
        with:
          msg: "Visual regression tests passed 😎. Bear in mind that they only run in Chromium on static components – they aren't perfect."
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

      - name: Post a comment about the visual tests (if they fail)
        uses: unsplash/comment-on-pr@master
        if: failure() && steps.visualTests.outcome == 'failure'
        with:
          msg: "Visual regression tests failed 😢. You can download the failure diffs from the 'Artifacts' section of the failed CI run. To update the tests, run `npm run jest:visual-tests:update` locally."
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

      - name: Build Sass docs
        if: github.ref == 'refs/heads/main'
        run: |
          nvm use
          npm run sassdoc

      - name: Deploy Sass docs to backpack.github.io, if on main branch
        uses: peaceiris/actions-gh-pages@v3
        if: github.ref == 'refs/heads/main'
        with:
          personal_token: ${{ secrets.DEPLOY_TOKEN }}
          publish_dir: dist-sassdoc/
          keep_files: false
          external_repository: backpack/sassdoc
          publish_branch: main

      - name: Deploy Storybook to backpack.github.io, if on main branch
        uses: peaceiris/actions-gh-pages@v3
        if: github.ref == 'refs/heads/main'
        with:
          personal_token: ${{ secrets.DEPLOY_TOKEN }}
          publish_dir: dist-storybook/
          keep_files: false
          external_repository: backpack/storybook
          publish_branch: main

      - name: Prepare to deploy Storybook (pull request build)
        run: |
          mkdir build
          mv dist-storybook $PR_NUMBER
          cp -R $PR_NUMBER build/
        if: github.ref != 'refs/heads/main' && github.repository == github.event.pull_request.head.repo.full_name
        env:
          PR_NUMBER: ${{ github.event.pull_request.number }}

      - name: Deploy Storybook to backpack.github.io/storybook-prs, if a pull request
        uses: peaceiris/actions-gh-pages@v3
        if: github.ref != 'refs/heads/main' && github.repository == github.event.pull_request.head.repo.full_name
        with:
          personal_token: ${{ secrets.DEPLOY_TOKEN }}
          publish_dir: build/
          keep_files: true
          external_repository: backpack/storybook-prs
          publish_branch: main

      - name: Link to the pull request build
        uses: unsplash/comment-on-pr@master
        if: github.ref != 'refs/heads/main' && github.repository == github.event.pull_request.head.repo.full_name
        with:
          msg: "Visit https://backpack.github.io/storybook-prs/${{ env.PR_NUMBER }} to see this build running in a browser."
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          PR_NUMBER: ${{ github.event.pull_request.number }}