Duplicate push notificaion iOS on TestFlight

[rahuljeevan-experion]

Issue

Describe your issue here

I recently migrated from @react-native-community/push-notification-ios and react-native-push-notification to @react-native-firebase/messaging. Things are working fine on Android, but on iOS, I'm receiving duplicate push notifications. I'm using PubNub to send push notifications. This issue occurs only on TestFlight builds.

Project Files

Javascript

Click To Expand

package.json:

    "@react-native-firebase/analytics": "19.2.2",
    "@react-native-firebase/app": "19.2.2",
    "@react-native-firebase/crashlytics": "19.2.2",
    "@react-native-firebase/messaging": "19.2.2",
    "react": "18.2.0",
    "react-native": "0.72.12",

firebase.json for react-native-firebase v6:

{
  "react-native": {
    "analytics_auto_collection_enabled": false,
    "crashlytics_debug_enabled": false,
    "crashlytics_disable_auto_disabler": true,
    "crashlytics_auto_collection_enabled": true,
    "crashlytics_is_error_generation_on_js_crash_enabled": true,
    "crashlytics_javascript_exception_handler_chaining_enabled": true
  }
}

iOS

Click To Expand

ios/Podfile:

• I'm not using Pods
• I'm using Pods and my Podfile looks like:

# N/A

AppDelegate.m:

// N/A

---

Android

Click To Expand

Have you converted to AndroidX?

• my application is an AndroidX application?
• I am using android/gradle.settings jetifier=true for Android compatibility?
• I am using the NPM package jetifier for react-native compatibility?

android/build.gradle:

// N/A

android/app/build.gradle:

// N/A

android/settings.gradle:

// N/A

MainApplication.java:

// N/A

AndroidManifest.xml:

<!-- N/A -->

---

Environment

Click To Expand

react-native info output:

 OUTPUT GOES HERE

• Platform that you're experiencing the issue on:
  • iOS
  • Android
  • iOS but have not tested behavior on Android
  • Android but have not tested behavior on iOS
  • Both
• react-native-firebase version you're using that has this issue:
  • e.g. 5.4.3
• Firebase module(s) you're using that has the issue:
  • e.g. Instance ID
• Are you using TypeScript?
  • Y/N & VERSION

---

Reproducible code

Token generation

    try {
      if (Platform.OS === 'android' && Platform.Version >= 33) {
        const granted = await PermissionsAndroid.request(
          PermissionsAndroid.PERMISSIONS.POST_NOTIFICATIONS,
        );
        if (granted !== PermissionsAndroid.RESULTS.GRANTED) {
          throw new Error('Permission denied');
        }
      } else if (Platform.OS === 'ios') {
        const authStatus = await messaging().requestPermission();
        const enabled =
          authStatus === messaging.AuthorizationStatus.AUTHORIZED ||
          authStatus === messaging.AuthorizationStatus.PROVISIONAL;
        if (!enabled) {
          throw new Error('Permission denied');
        }
      }
      let fcmToken;
      if (Platform.OS === 'android') {
        fcmToken = await messaging().getToken();
      } else {
        fcmToken = await messaging().getAPNSToken();
      }
      if (fcmToken) {
        setAsyncStorageData(constants.DEVICE_TOKEN, fcmToken);
        dispatch(saveDeviceToken(fcmToken));
      }
    } catch (error) {
      // console.error('Error configuring push notifications:', error);
    }

index.js

if (Platform.OS === 'android') {
  messaging().setBackgroundMessageHandler(async (remoteMessage) => {});
} else {
   notifee.onBackgroundEvent(async ({type, detail}) => {});
}

Notification interaction

  const androidPushMethods = () => {
    messaging().onNotificationOpenedApp((remoteMessage) => {
      pushNotificationHandler(remoteMessage);
    });
    // Check if the app was opened from a quit state due to a notification
    messaging()
      .getInitialNotification()
      .then((remoteMessage) => {
        pushNotificationHandler(remoteMessage);
      });
  };


  useEffect(() => {
    let unsbscribe;
    if (Platform.OS === 'android') {
      androidPushMethods();
    } else {
      unsbscribe = notifee.onForegroundEvent(({type, detail}) => {
        if (type !== EventType.PRESS) return;
        if (detail === null) return;
        pushNotificationHandler(detail?.notification);
      });
    }

    return unsbscribe;
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);

Pubnub push code

{
  "pn_debug": true,
  "pn_fcm": {
    "data": {
      "message": "hello"
    }
  },
  "pn_apns": {
    "aps": {
      "alert": "hello"
    },
    "pn_push": [
      {
        "push_type": "alert",
        "auth_method": "token",
        "targets": [
          {
            "environment": "development",
            "topic": "com.PubNub.MobilePushTest"
          }
        ],
        "version": "v2"
      }
    ]
  }
}

• 👉 Check out React Native Firebase and Invertase on Twitter for updates on the library.

[russellwheatley]

This issue only occurs on TestFlight. Is there any way to test this locally?

[rahuljeevan-experion]

This issue only occurs on TestFlight. Is there any way to test this locally?

I'm not sure. Based on the sample code I shared, is there anything wrong? I'm trying to figure out if I've made a mistake in the implementation.

[russellwheatley]

Nothing jumps out at me I'm afraid. Worth removing things until it is fixed to help locate issue. I notice you're using Notifee as well, that might be the first thing to check out if you're sending notification via messaging + notifee.

[rahuljeevan-experion]

Nothing jumps out at me I'm afraid. Worth removing things until it is fixed to help locate issue. I notice you're using Notifee as well, that might be the first thing to check out if you're sending notification via messaging + notifee.

I added Notifee after reading somewhere that it might help fix the issue, but it didn't. With or without it, I was getting duplicate push notifications.