Testing React Native iOS Bridges
Article Summary
Szabolcs Tóth from Skyscanner reveals how they solved a critical testing gap when integrating React Native into their Objective-C iOS app. Their solution transformed flaky, hard-to-debug bridge tests into a reliable testing framework.
Skyscanner chose to integrate React Native incrementally rather than rewrite their entire iOS app, which meant creating extensive native bridges. The team needed a way to ensure these bridges worked correctly without maintaining duplicate codebases or relying on manual testing of RN features.
Key Takeaways
- Default RN testing bundles all tests into one method, hiding failures
- Custom solution enables 1-to-1 mapping between native and JS test methods
- Bracket notation in JS allows dynamic test execution via passed parameters
- Timeout control moved from RN's 2-minute default to configurable per-test values
- Reusable base class eliminates boilerplate across all bridge modules
Skyscanner built a scalable integration testing framework that makes React Native bridge failures fast to identify and easy to debug through direct native-to-JS test mapping.
About This Article
Skyscanner's logging system and core objects needed to work in React Native. Unit tests alone couldn't verify that JavaScript code could actually interact with native bridges without breaking things.
Szabolcs Tóth's team used RCTTestRunner and RCTTestModule to build integration tests. These tests run JavaScript test methods from native XCTestCase classes. They use bracket notation to dynamically call test methods by name based on parameters passed in.
The custom SKYRCTBridgeTestCase base class cut down boilerplate code across bridge modules. It also let teams set timeouts per test instead of using React Native's fixed two-minute default, so they got faster feedback when tests failed.