TDD with Firestore functions emulator

Having spent time running tests inside and outside Firestore’s emulator, I learned that using the emulator is more than 50% faster.

Here is the latest flow we are using at Circuit. If you know of a simpler way, please let me know at gus [at] getcircuit [dot] com.

Basic version

firebase emulators:exec --only firestore 'jest'

You can replace jest with the runner of your choice.

Abstract the emulator call

Install scripty:

yarn add scripty

Add an entry to package.json:

{
  …
  "scripts": {
    …
    "test": "scripty"
  }
  …
}

Create a directory called scripts in the root of your project.

Create a file with path and name scripts/test:

#!/usr/bin/env sh

str="$*"
firebase emulators:exec --only firestore "yarn jest $str"

Allow computer to run this file:

chmod 644 scripts/test

Now you can run yarn test and add anything you would add to the command, like yarn test --watch, yarn test /path/to/test.file.

Enable connecting with a browser’s debugger

Add an entry to package.json:

{
  …
  "scripts": {
    …
    "debug": "scripty"
  }
  …
}

Create a file with path and name script/debug:

#!/usr/bin/env sh

str="$*"
firebase emulators:exec --only firestore "node --inspect node_modules/.bin/jest --watch --runInBand $str"

Allow computer to run this file:

chmod 644 scripts/debug

Add debugger to any line of your Firestore code.

Run yarn debug — you can also pass a filename to focus on it right away.

Open your browers’s developer tools.

Click on the green cube (Node’s logo):

This will open the debugger and you’re ready to step debug your code.