Detox Test Automation in the Perfecto Continuous Testing Cloud

Detox is a JavaScript mobile testing framework that is built into the application so that the test execution starts with the app launch. This makes test execution fast and robust because no additional external tools are needed to orchestrate and synchronize tests.

The Perfecto testing cloud provides teams with instant access to real devices from anywhere, allowing faster feedback to engineering teams, which increases your development velocity and reduces production defects.

Image Mobile Cloud Benefits Toolchain

About the Detox Framework

High velocity native mobile development requires us to adopt continuous integration workflows, which means our reliance on manual QA has to drop significantly. The Detox framework tests your mobile app while it's running in a real device/simulator, interacting with it just like a real user.

The most difficult part of automated testing on mobile is the tip of the testing pyramid of end to end testing. The core problem with E2E tests is flakiness. Tests are usually not deterministic. The only way to tackle flakiness head on is by moving from black box testing to gray box testing. That's where the Detox framework comes into play.

Image Integration Detox

6 Features of the Detox Framework

icon-productpage-features

Cross Platform

Write cross-platform tests in JavaScript. Detox currently supports iOS and Android.

icon-productpage-features

Runs on Devices

Gain confidence to ship by testing your app on a device/simulator just like a real user. Note: this is not yet supported in iOS.

icon-productpage-features

Automatically Synchronized

Stop flakiness at the core by monitoring asynchronous operations in your app.
 

icon-productpage-features

Made For CI

Execute your E2E tests on CI platforms like Travis easily.

icon-productpage-features

Test Runner Independent

Use Mocha, AVA, or any other JavaScript test runner you like.

Debuggable

Modern async-await API allows breakpoints in asynchronous tests to work as expected.

How the Detox Framework Is Built

Detox is built from the ground up to support React Native projects as well as pure native ones.

Detox Does Not Rely on WebDriver

Detox is built from the ground up to integrate with native layers of your mobile app directly. This is to avoid generic cross-platform interfaces that are often the lowest common denominator.

Detox Does Gray Box, Not Black Box Testing

Switching to gray box allows the test framework to monitor the app from the inside and delivers critical wins like fighting flakiness at the core.

Detox Relies On EarlGrey and Espresso

The leading native gray box drivers are developed by Google. EarlGrey is used for iOS and Espresso is used for Android. Detox relies on them using a JSON-based reflection mechanism, which allows a common JavaScript implementation to invoke their native methods directly.

Detox Synchronizes With Your App's Activity

By knowing what your app is doing and synchronizing with it, Detox times its actions to run only when your app is idle, meaning it has determined that your app has finished work, such as React Native load, animations, network requests, etc. You can read more on this here.

Friendly Protractor-like API for tests

Tests in Detox are implemented in human-readable JavaScript and can even be shared between platforms. This easy-to-use API completely abstracts the complex native driver invocations taking place under the hood.

Detox Controls Devices Through Low-Level APIs

Let's take iOS simulators for example, which are difficult to control efficiently since multiple concurrent instances aren't supported. Detox uses AppleSimulatorUtils (another open source library by Wix) to work around these issues and support test sharding.

Built From the Ground Up for Mobile and React Native

Detox is inspired by web testing methodologies but is not a direct translation of a solution designed for a different platform. Detox is built from the ground up for native mobile and has deep first-class support for React Native apps.

Detox Relies on Websockets for Communication

Communication between the test script running on Node.js and the tested app running on device uses websockets. This provides true bi-directional communication and is much faster and resilient than REST-like protocols.

Both Tester and Testee Are Websocket Clients

The test script running on Node.js and the tested app running on device are both clients. This allows one side to disconnect without affecting the other. A separate proxy websocket server is used to connect them.

Expectations Run On the Testee, Not the Tester

Traditionally, test frameworks evalutate expectations in the test script running on Node.js. Detox evaluates expectations natively directly in the tested app running on device. This enables operations that were impossible before due to performance reasons.
 

Watch Detox and Perfecto in Action

No matter the framework you use, the Perfecto platform is all you need, allowing you to have a single continuous testing solution that can scale with your team. With Perfecto, you can execute tests fast without the need for additional tools or device labs. See Perfecto and Detox together in this video.

Example Detox Test

This is a test for a login screen. It runs on a device/simulator like an actual user.

describe('Login flow', () => {
    
  it('should login successfully', async () => {
    await device.reloadReactNative();
    await expect(element(by.id('email'))).toBeVisible();

   
    await element(by.id('email')).typeText('[email protected]');
    await element(by.id('password')).typeText('123456');
    await element(by.text('Login')).tap();

   
    await expect(element(by.text('Welcome'))).toBeVisible();
    await expect(element(by.id('email'))).toNotExist();

    });
 
});

 

View a sample project of Detox.

Get Started With Perfecto and Detox

Start My Perfecto Trial