Code Quiz

Bridge Boundary Sync Call Bug

Spot why reading a native bridge result synchronously breaks a React Native MVVM view model.

Codejavascript

// Native side (iOS):
// RCT_EXPORT_METHOD(getAuthToken:(RCTPromiseResolveBlock)resolve
//                   rejecter:(RCTPromiseRejectBlock)reject) {
//   resolve(self.keychain.token);
// }

import { NativeModules } from 'react-native';
const { AuthBridge } = NativeModules;

class SessionViewModel {
  loadToken() {
    // Read the token from the native keychain module
    const token = AuthBridge.getAuthToken();
    this.token = token;
    this.isAuthenticated = token != null;
    return this.token;
  }
}

const vm = new SessionViewModel();
console.log(vm.loadToken());

What is the bug in this code, and how should it be fixed?

Next →Bridge vs JSI Architecture Trade-offs