Github actions caching with Cypress

This has been on my To Do list for a while. To make builds faster (and save github minutes) you can use the cache action to cache dependencies between builds (or jobs in the same workflow) rather than installing them each time.

To cache your node_modules folder, this is the step you would need:

- name: Cache Dependencies
  id: cache-deps
  uses: actions/cache@v2
  with:
     path: ~/node_modules
     key: cache-${{ hashFiles('yarn.lock') }}

In subsequent builds, if your yarn.lock file has not changed, the cache will be restored (in a few seconds) and you won’t need to wait for dependencies to install.

However, if you are using Cypress, configuring the cache as above results in a missing Cypress binary.

The cypress npm package is installed, but the Cypress binary is missing.

We expected the binary to be installed here: /home/runner/work/xxx/xxx/cypress/cache/9.2.0/Cypress/Cypress

Reasons it may be missing:

- You're caching 'node_modules' but are not caching this path: /home/runner/.cache/Cypress
- You ran 'npm install' at an earlier build step but did not persist: /home/runner/.cache/Cypress

It took me a while to get this right, but the steps below work to also cache the Cypress binary

- name: Cache Dependencies
  id: cache-deps
  uses: actions/cache@v2
  with:
    path: |
       ~/.cache/Cypress
       ~/node_modules
       **/node_modules
    key: cache-${{ hashFiles('yarn.lock') }}
- name: Install dependencies
  if: steps.cache-deps.outputs.cache-hit != 'true'
  run: yarn --frozen-lockfile

(Note: this project is a monorepo so I am also caching node_modules wherever it exists, not just in the root folder)