Android build fails when using DeviceEventManagerModule in RN 0.76 & New Architecture

[mfkrause]

Description

When creating a Native Module using create-react-native-library and using DeviceEventManagerModule in the Kotlin implementation of the module, building for Android will fail with the following error message:

> Task :react-native-somemodule:compileDebugKotlin FAILED
e: Supertypes of the following classes cannot be resolved. Please make sure you have the required dependencies in the classpath:
    class com.facebook.react.modules.core.DeviceEventManagerModule, unresolved supertypes: com.facebook.fbreact.specs.NativeDeviceEventManagerSpec
Adding -Xextended-compiler-checks argument might provide additional information.


FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':react-native-somemodule:compileDebugKotlin'.

Interestingly, when creating the Native Module as a local module within an existing React Native project, this does not happen and the build works fine. This only happens when creating a standalone module.

When disabling New Architecture by setting the newArchEnabled Android flag to false, building works fine as well. Building also works when downgrading to React Native 0.75.4 (by reverting the steps from the React Native Upgrade Helper).

I've created a fresh project from create-react-native-library@0.44.2 (latest) in the reproduction repo and added example Kotlin code that is affected from this. To reproduce, simply clone and run yarn && yarn example android.

Packages

• create-react-native-library
• react-native-builder-bob

Selected options

{
  "react-native-builder-bob": {
    "source": "src",
    "output": "lib",
    "targets": [
      [
        "commonjs",
        {
          "esm": true
        }
      ],
      [
        "module",
        {
          "esm": true
        }
      ],
      [
        "typescript",
        {
          "project": "tsconfig.build.json",
          "esm": true
        }
      ]
    ]
  },
  "create-react-native-library": {
    "type": "module-legacy",
    "languages": "kotlin-swift",
    "version": "0.44.2"
  }
}

Link to repro

https://github.com/mfkrause/crnl-rn76-deviceeventmanagermodule-bug-repro

Environment

System:
  OS: macOS 14.6.1
  CPU: (10) arm64 Apple M1 Pro
  Memory: 102.45 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 20.16.0
    path: /private/var/folders/h5/w2kdxkb56x9b1fvcqxrg4kt40000gn/T/xfs-130876a3/node
  Yarn:
    version: 3.6.1
    path: /private/var/folders/h5/w2kdxkb56x9b1fvcqxrg4kt40000gn/T/xfs-130876a3/yarn
  npm:
    version: 10.8.1
    path: ~/.nvm/versions/node/v20.16.0/bin/npm
  Watchman:
    version: 2024.10.14.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.15.2
    path: /usr/local/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.1
      - iOS 18.1
      - macOS 15.1
      - tvOS 18.1
      - visionOS 2.1
      - watchOS 11.1
  Android SDK: Not Found
IDEs:
  Android Studio: 2024.1 AI-241.18034.62.2412.12266719
  Xcode:
    version: 16.1/16B40
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.13
    path: /Library/Java/JavaVirtualMachines/zulu-17.jdk/Contents/Home/bin/javac
  Ruby:
    version: 2.6.10
    path: /usr/bin/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 15.0.1
    wanted: 15.0.1
  react:
    installed: 18.3.1
    wanted: 18.3.1
  react-native:
    installed: 0.76.2
    wanted: 0.76.2
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: true
  newArchEnabled: true

[menico]

The issue occurs because of a conflict between legacy event emission code and the New Architecture. Here's the solution:

1. If you want to use the legacy approach, you need to explicitly disable New Architecture:

example/android/gradle.properties

# ... other properties ...
newArchEnabled=false

2. However, the recommended approach is to use the new event emission method:

// Old problematic code
private fun sendEvent(eventName: String, params: WritableMap?) {
    reactApplicationContext
        .getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter::class.java)
        ?.emit(eventName, params)
}

// New recommended code
private fun sendEvent(eventName: String, params: WritableMap?) {
    val context = getReactApplicationContext()
    context.emitDeviceEvent(eventName, params)
}

The error occurs because create-react-native-library maintains compatibility with the New Architecture even when creating legacy modules. This causes conflicts when using legacy APIs like DeviceEventManagerModule.RCTDeviceEventEmitter.

You have two options:

1. Disable New Architecture by setting newArchEnabled=false
2. (Recommended) Use the new event emission method shown above

The second approach is preferred as it maintains forward compatibility with the New Architecture.

[satya164]

Thanks for the insight @menico