expo: expo-notifications not showing notifications in foreground even with setNotificationHandler

Summary

I have setup the Expo-Notifications, and I’m using local notifications as reminders, all works well until I need a notification to show while I’m inside the app. The notification always shows while the app is in background but I can’t get it to work in the foreground.

What platform(s) does this occur on?

No response

SDK Version

46.0.16

Environment

expo-env-info 1.0.5 environment info: System: OS: macOS 12.5.1 Shell: 3.2.57 - /bin/bash Binaries: Node: 16.17.0 - /usr/local/bin/node Yarn: 1.22.19 - /usr/local/bin/yarn npm: 8.17.0 - /usr/local/bin/npm Watchman: 2022.10.31.00 - /opt/homebrew/bin/watchman Managers: CocoaPods: 1.11.3 - /opt/homebrew/bin/pod SDKs: iOS SDK: Platforms: DriverKit 22.1, iOS 16.1, macOS 13.0, tvOS 16.1, watchOS 9.1 IDEs: Android Studio: 2021.2 AI-212.5712.43.2112.8815526 Xcode: 14.1/14B47b - /usr/bin/xcodebuild npmGlobalPackages: eas-cli: 2.8.0 expo-cli: 6.0.8

Minimal reproducible example

App.tsx:

import * as Notifications from "expo-notifications";

Notifications.setNotificationHandler({
  handleNotification: async () => ({
    shouldShowAlert: true,
    shouldPlaySound: true,
    shouldSetBadge: false,
  }),
});


const App = () => {

  const notificationListener = useRef();
  const responseListener = useRef();
  const [notification, setNotification] = useState(false);


    useEffect(() => {
      const getPerm = async() => {
        const { status: existingStatus } = await Notifications.getPermissionsAsync();
        let finalStatus = existingStatus
        if(existingStatus !== 'granted'){
          const { lastStatus }:any = await Notifications.requestPermissionsAsync();
          finalStatus = lastStatus
        }
        if (finalStatus !== "granted") {
          console.log("Failed to get push token for push notification!");
          return;
        }
      }
      getPerm()

      notificationListener.current = Notifications.addNotificationReceivedListener(notification => {
        setNotification(notification);
        console.log("NOTIF: ", notification)
      });
  
      responseListener.current = Notifications.addNotificationResponseReceivedListener(response => {
        console.log("RES: ",response);
      });
  
      return () => {
        Notifications.removeNotificationSubscription(notificationListener.current);
        Notifications.removeNotificationSubscription(responseListener.current);
      };
    }, []) ....

How I schedule the notification in a different file:

const triggerNotifications = async () => {
    await Notifications.scheduleNotificationAsync({
    content: {
        title: "You’ve got mail! 📬",
        body: "Here is the notification body",
        data: { data: "goes here" }
    },
    trigger: { seconds: 5 },
    });
}

About this issue

Original URL
State: closed
Created 2 years ago
Reactions: 5
Comments: 21

Most upvoted comments

Too be fair it’s a little rough to make a reproducible example here, as it is linked to your Push Notification service. I changed shouldPlaySound from false to true and the notification showed in the foreground. Before that it did not.

This issue really should not be closed.

+11

robinclaes on May 31, 2023

I have the same issue on Android, however with the following Notification Handler it’s still not working on the foreground…

Notifications.setNotificationHandler({ handleNotification: async () => ({ shouldShowAlert: true, shouldPlaySound: true, shouldSetBadge: true, }), });

nicholas-masini on Aug 7, 2023

+1 for me on android. When app is in foreground, I see notification in the status bar, but notification popup does not appear. My setup is default from expo docs.

@paradise I faced the same issue.

When used the following settings (default from expo docs, the notification showed in the status bar and tray but didn’t appear in the app)

Notifications.setNotificationHandler({ handleNotification: async () => ({ shouldShowAlert: true, shouldPlaySound: false, shouldSetBadge: false, // priority: ‘high’, }),

But when I put shouldPlaySound as ‘true’, it appeared in both the status bar, tray and the app.

Notifications.setNotificationHandler({ handleNotification: async () => ({ shouldShowAlert: true, shouldPlaySound: true, shouldSetBadge: false, // priority: ‘high’, }),

});

lloydraj on Feb 22, 2023

+1 for me on android. When app is in foreground, I see notification in the status bar, but notification popup does not appear. My setup is default from expo docs.

paradise on Jan 19, 2023

+1 Can confirm the issue

mamedia-edv on Dec 30, 2022

I’m experiencing this same issue. For some reason it seems to work better with a custom dev build. Has anyone learned more about this issue?

ademartini on Oct 13, 2023

+1 for me on android. When app is in foreground, I see notification in the status bar, but notification popup does not appear. My setup is default from expo docs.

for me I have the same issue, so I ended up to use define sound property and make it null for android and default for ios, i don’t know why should i define sound property to see the notification but it is what it is

Example:

await Notifications.scheduleNotificationAsync({
        content: {
          title: "Time is done!",
          body: "Hello",
          sound: Platform.OS === "android" ? null : "default",
        },
        trigger: {
          seconds: 60,
        },

anasalaqeel on Jul 13, 2023

I am facing the same problem, the notifications seems to work for me with the expo notifications tool, but when app is in foreground they are never touching handleNotification function in Notifications.setNotificationHandler, not sure what might be issue

Guys i checked out not sure if it will be the same for you but i realized they are working, but they are not when the debugger is on

Hi, I have the same issue. Please, what do you mean by “when the debugger is on”? What debugger are you refering to?

LagoonProject on Jan 4, 2023