MDN URL

https://developer.mozilla.org/en-US/docs/Web/API/Notifications_API/Using_the_Notifications_API#feature-detecting_the_requestpermission_promise

What specific section or headline is this issue about?

Feature-detecting the requestPermission() promise

What information was incorrect, unhelpful, or incomplete?

The code example that is given to feature detect the old-school callback way vs the promise way of asking for notification permissions is:

function checkNotificationPromise() {
  try {
    Notification.requestPermission().then();
  } catch (e) {
    return false;
  }

  return true;
}

Then it's suggested to use it like so:

 // Let's check if the browser supports notifications
  if (!("Notification" in window)) {
    console.log("This browser does not support notifications.");
  } else if (checkNotificationPromise()) {
    Notification.requestPermission().then((permission) => {
      handlePermission(permission);
    });
  } else {
    Notification.requestPermission((permission) => {
      handlePermission(permission);
    });
  }

What did you expect to see?

I expected that when this code is triggered on Safari 16.3 on MacOS it would show a native notification prompt, and then run my callback once the user approves the native prompt. Instead, the code seems to throw an error immediately and my callback is not called when the user approves the prompt. It's like calling Notification.requestPermission().then() immediately runs the permission request but without your callback.

Exactly this same problem can also be triggered with Firefox for Android. (However not Firefox desktop).

Here is a quick video to illustrate the incorrect behavior:

Do you have any supporting links, references, or citations?

Based on MDN, Safari since version 15 supports the new promise-based syntax. However the problem here is that feature testing for this actually breaks the feature.

requestPermission

Do you have anything more you want to share?