Running Detox end-to-end tests on CI

Now that you’ve added end-to-end tests with Detox to your React Native application from my previous blog post it’s time to automate running the tests and add them to continuous integration (CI) pipeline. Detox has documentation for running it on some Continuous Integration services but it’s somewhat lacking and outdated. This post will show how to automate E2E testing on GitHub Actions.

Detox E2E tests on GitHub Actions

GitHub Actions makes it easy to automate software workflows and basically provides some capabilities than any common CI/CD service like GitLab, CircleCI, Bitrise etc. At work I used GitLab CI/CD to run our e2e tests so adding automation for my personal Hailakka project on GitHub Actions was a nice exercise. You can see the workflow file from the repository: ios.yml

Creating the workflow for GitHub Actions was quite straightforward by modernizing the workflow shown in the article I found and there’s more modern blog post also which covers also Azure Pipelines.

GitHub Actions provides a macOS runner so setting up things were as simple as writing the steps you’d do manually for running the Detox tests and translating those steps to workflow. Adding a workflow for iOS and getting tests to run was easy. The result was simple pipeline on repository “push” action in pull request and master branches.

There is a workflow for Hailakka on Android but I managed it to get running only on API level 29 (or lower) on the GitHub Actions although locally it run on API level 31. Somehow the newer API didn’t create any UI (empty images) for Detox to click through. Anyways the Android tests seemed more flaky even when running on local machine.

Detox tests for my simple newsreader application runs on iOS runner quickly after the app was build. The total runtime for the workflow run is around 30 minutes. As I’ve set the artifacts to be generated only when the tests fail the output is just a succeeded job. Maybe I should look into partial visual regression testing 🤔

You can add a badge to your readme of the workflow status ✅