facebook / react-native

A framework for building native applications using React
https://reactnative.dev
MIT License
119.48k stars 24.37k forks source link

Error receiving firebase push notification in background #46775

Open DmytroKoblents15 opened 1 month ago

DmytroKoblents15 commented 1 month ago

Description

Getting error Error: Exception in HostFunction: Could not enqueue microtask because they are disabled in this runtime, js engine: hermes when receiving background message from firebase on react native after updating to 0.75.3 with newArch and hermes enabled. If I disable the new arch or rollback to RN 0.74 error doesn't show up

index.js

import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';
import messaging from '@react-native-firebase/messaging'

messaging().setBackgroundMessageHandler(async remoteMessage => {
    console.log('Message handled in the background!', remoteMessage)
})

AppRegistry.registerComponent(appName, () => App);

package.json

{
  "name": "pushNotificationTest",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "lint": "eslint .",
    "start": "react-native start",
    "test": "jest"
  },
  "dependencies": {
    "react": "18.3.1",
    "react-native": "0.75.3",
    "@react-native-firebase/app": "^21.0.0",
    "@react-native-firebase/messaging": "^21.0.0",
    "@react-navigation/native": "^6.1.18",
    "@notifee/react-native": "^7.8.2",
    "@react-navigation/native-stack": "^6.11.0"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0",
    "@babel/preset-env": "^7.20.0",
    "@babel/runtime": "^7.20.0",
    "@react-native/babel-preset": "0.75.3",
    "@react-native/eslint-config": "0.75.3",
    "@react-native/metro-config": "0.75.3",
    "@react-native/typescript-config": "0.75.3",
    "@types/react": "^18.2.6",
    "@types/react-test-renderer": "^18.0.0",
    "babel-jest": "^29.6.3",
    "eslint": "^8.19.0",
    "jest": "^29.6.3",
    "prettier": "2.8.8",
    "react-test-renderer": "18.3.1",
    "typescript": "5.0.4"
  },
  "engines": {
    "node": ">=18"
  }
}

graddle.properties

newArchEnabled=true

hermesEnabled=true

Steps to reproduce

  1. Open the app
  2. Go to background
  3. Send notification from Firebase
  4. Notice the error

React Native Version

0.75.3

Affected Platforms

Runtime - Android

Areas

Other (please specify)

Output of npx react-native info

System:
  OS: macOS 14.6.1
  CPU: (8) arm64 Apple M1
  Memory: 565.80 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 20.3.0
    path: ~/.nvm/versions/node/v20.3.0/bin/node
  Yarn:
    version: 1.22.22
    path: ~/.nvm/versions/node/v20.3.0/bin/yarn
  npm:
    version: 9.6.7
    path: ~/.nvm/versions/node/v20.3.0/bin/npm
  Watchman:
    version: 2024.08.19.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.15.2
    path: /usr/local/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 23.2
      - iOS 17.2
      - macOS 14.2
      - tvOS 17.2
      - visionOS 1.0
      - watchOS 10.2
  Android SDK: Not Found
IDEs:
  Android Studio: 2024.1 AI-241.19072.14.2412.12360217
  Xcode:
    version: 15.2/15C500b
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.11
    path: /usr/bin/javac
  Ruby:
    version: 2.6.10
    path: /usr/bin/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.3.1
    wanted: 18.3.1
  react-native:
    installed: 0.75.3
    wanted: 0.75.3
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true

Stacktrace or Logs

LOG  Message handled in the background! {}

 ERROR  Error: Exception in HostFunction: Could not enqueue microtask because they are disabled in this runtime, js engine: hermes

 LOG  Failed to print error:  Exception in HostFunction: Could not enqueue microtask because they are disabled in this runtime

Reproducer

https://github.com/DmytroKoblents15/notificationsReproduce

Screenshots and Videos

No response

cipolleschi commented 1 month ago

@DmytroKoblents15 thanks for the issue. Quick question: which path does the app follow when it is started from a notification on Android? I believe that React Native is not initialized properly when that happen.

cortinico commented 1 month ago

Also @DmytroKoblents15, have you also opened an issue against https://github.com/invertase/react-native-firebase/issues ?

mbpictures commented 1 month ago

I opened an issue against the react-native-firebase repo here

mikehardy commented 1 week ago

I can no longer reproduce any issues with background headlessJS on android in new architecture - detailed findings on https://github.com/facebook/react-native/issues/47570#issuecomment-2483974714

There is still a problem with old architecture and background FCM in react-native >= 0.76.0 through at least 0.76.2 but it is tracked separately with a reproducer here https://github.com/facebook/react-native/issues/47592