Integrating Jest with Github Actions

In this article, we'll set up a basic workflow with Github Actions. This tool allows you to automate countless actions, triggered by Github events.

Who is it for?

Currently, Github Actions is free for all public repositories. And private repositories have up to 2.000 free minutes per month. Additional minutes are available at a per-minute basis.

The flow described below is fairly simple and takes more or less 1 minute to finish. Hence, if our example repository was private (which it is not), it would allow me to automatically pull, test and merge around 2000 times per month. That equates to 66 pushes per day, not something you're likely to encounter for a personal side project.

What will we automate?

  • Pulling the development branch of our Angular project
  • Installing dependencies
  • Running all unit test suites
  • If successful, merging the development branch into master

When will we execute this?

Upon every push to the development branch.

How to get started?

The process is relatively easy. In our project, we create a new folder .github/workflows. Inside of this new folder, create a new YAML file (e.g. test.yml).

The full content for my project looks like this:

  • Name: a name for our workflow.
    This name will show up in Github Actions' reports.
  • On: the trigger to run our workflow.
  • Jobs: all jobs that need to be executed.
    Every job consists of one or multiple steps.

The full contents of the file look like this:


name: Run unit tests, merge develop into master and push

on:
  push:
    branches: [develop]

jobs:
  build-and-test:
    runs-on: ubuntu-latest

    steps:
      # Pull repository into the current pipeline
      - name: Pull repository
        uses: actions/checkout@v2

      - name: NPM install
        run: npm ci

      - name: Run tests
        run: npm test

      - name: Merge develop into master and push
        run: |
          git fetch --unshallow
          git checkout master
          git pull
          git merge develop -m "Auto merge dev into master"
          git push

Breakdown

Let's break that file down, shall we?


name: Run unit tests, merge develop into master and push

Name for our workflow. This will show up in Github Actions' reports.


on:
  push:
    branches: [develop]

The workflow is triggered upon every push to the branch named develop.


jobs:
  build-and-test:
    runs-on: ubuntu-latest

A workflow consists of one or multiple jobs. Each job has a name and consists of one or multiple steps. With runs-on, we can specify the type of machine for each job. Our job will run on the latest version of Ubuntu (20.04).


    steps:
      # Pull repository into the current pipeline
      - name: Pull repository
        uses: actions/checkout@v2

      - name: NPM install
        run: npm ci

      - name: Run tests
        run: npm test

      - name: Merge develop into master and push
        run: |
          git fetch --unshallow
          git checkout master
          git pull
          git merge develop -m "Auto merge dev into master"
          git push

The checkout (v2) action is likely among the most wielded custom actions. Since we are triggering this workflow by pushing to a certain branch (develop), this action will automatically checkout that branch. We don't have to explicitly mention it in the options.

Next, we're doing a clean install of our dependencies with npm ci. This approach is preferred over npm install, because it ensures all our dependencies have the same version as the ones specified in the package-lock.json file of our development branch.

Then, our test suites are run with Jest by calling npm test.

There are two options:

  • All tests pass and the workflow proceeds to the next step.
  • A test fails and the workflow exits with a corresponding error code. You receive an e-mail notifying you of this failure. It also shows up in the "Actions" tab of your repository.

Assuming all tests pass, the workflow will continue with the final step. It checks out the master branch, merges the development branch into it and push the changes.

Notice how the pipe symbol allows specifying multiple commands in one step. For Ubuntu, these commands are run in sequence with git bash.

Master has been pushed. What's next?

Well, if you're running an application on a platform like Heroku or Netlify, you can trigger automated deploys by pushing to the master branch. Assuming you have activated that option in your application settings, obviously.

For me, automating these processes (run tests, merge and deploy) made my life significantly easier. I just need to push changes to the development branch and if everything goes well, my changes are visible after a couple of minutes.

Conclusion

Interested in more examples of Github Actions? Have a look at the quickstart guide for Github Actions or the Github Actions cheat sheet.

⇤ Return to blog overview