Chrome Notifications not appearing from Chrome Extension background page

Question

Using the new chrome.notifications API, I am unable to get notifications from my extension to appear. Even the most basic notification fails to appear for me, but I get no errors and the callback function is properly executed.

manifest.json

{
  "name": "notify",
  "version": "0.0.0",
  "manifest_version": 2,
  "permissions": [
    "notifications"
  ],
  "background": {
    "scripts": ["main.js"]
  }
}

main.js

window.addEventListener('load', function() {
  var opt = {
    type: 'list',
    title: 'Primary Title',
    message: 'Primary message to display',
    priority: 1,
    items: [{ title: 'Item1', message: 'This is item 1.'},
            { title: 'Item2', message: 'This is item 2.'},
            { title: 'Item3', message: 'This is item 3.'}]
  };
  chrome.notifications.create('notify1', opt, function() { console.log('created!'); });
});

When I inspect the background page, I can see "created!" in the console, but I don't ever get a notification on the desktop. I have tried a bunch of different priority values to no avail. What am I doing wrong?

Compare the behavior in https://chrome.google.com/webstore/detail/notifications-galore/gclcddgeeaknflkijpcbplmhbkonmlij?hl=en (see that item's description for source). Narrow down the responsible differences, then please post an answer to your own question here. — sowbug, Feb 27 '14 at 16:33
Using the exact id and options from one of the examples from the app you mentioned, I get the same results. The only difference that I can see is that I am using an Chrome Extension, and your example (and all other examples I've found) are using Chrome Apps. — smfoote, Feb 27 '14 at 18:00
Are the working examples calling the create method from the background page? — sowbug, Feb 28 '14 at 15:20
Yes, the working examples are calling the create method from the background page. As far as I can tell, the only difference is that the working examples use a Chrome App instead of an Extension. — smfoote, Feb 28 '14 at 19:24

score 21 · Accepted Answer · answered Feb 28 '14 at 21:13

Unfortunately detailed error messages for chrome.notifications have been suppressed from the console due to a bug that I haven't yet diagnosed; the reason your notification isn't being displayed is that it doesn't provide a required "iconUrl" parameter. When I tried the following in the background page of an extension I have installed:

var opt = {
  iconUrl: "http://www.google.com/favicon.ico",
  type: 'list',
  title: 'Primary Title',
  message: 'Primary message to display',
  priority: 1,
  items: [{ title: 'Item1', message: 'This is item 1.'},
        { title: 'Item2', message: 'This is item 2.'},
          { title: 'Item3', message: 'This is item 3.'}]
};
chrome.notifications.create('notify1', opt, function() { console.log('created!'); });

the notification is created successfully. It pays to check chrome.runtime.lastError:

var opt = {
    type: 'list',
    title: 'Primary Title',
    message: 'Primary message to display',
    priority: 1,
    items: [{ title: 'Item1', message: 'This is item 1.'},
            { title: 'Item2', message: 'This is item 2.'},
            { title: 'Item3', message: 'This is item 3.'}]
  };
  chrome.notifications.create('notify1', opt, function(id) { console.log("Last error:", chrome.runtime.lastError); });

which would have shown you that in fact there are required properties and one is missing.

Thanks for an awesome answer! The tip about `chrome.runtime.lastError` was also really useful. — smfoote, Mar 01 '14 at 04:00
I find it strange that the chrome API document states that the iconUrl parameter is optional. https://developer.chrome.com/extensions/notifications#type-NotificationOptions — Frank Fu, Aug 21 '14 at 01:44
They've changed it, but it is still not obvious that it is required. "Required for notifications.create method" — Whyser, Jun 14 '15 at 16:19

score 17 · Answer 2 · answered Jun 21 '20 at 17:16

17

If you are using Mac and Chrome 59+, it might be because the MacOS native notification is disabled for Chrome. Here's two possible solutions:

Solution 1

Open Chrome > Go chrome://flags > Search Enable native notifications > Change it to Disabled > Relaunch Chrome

Solution 2

Go to MacOS System Preferences > Notifications > Turn on Notifications for Banners/Alerts as shown here (likely previously it's Off)

Notifications Setting Screenshot

Reference 1

Reference 2

answered Jun 21 '20 at 17:16

Bobby Chang Liu

321
2
5

3

Helpful! I was using MacOS and the solution 2 helped! – Jeffy Mathew Jul 25 '20 at 15:32
1

Thanks! This is helpful. I recently upgraded from MacOS 10.14 to MacOS 10.15, then the notification broke for my extension. It turned out that the notification for Chrome is turned off by default. – hudidit Aug 19 '20 at 14:14

score 8 · Answer 3 · answered Aug 27 '20 at 13:03

8

In my case, Chrome would show notification only once for a particular name/id being passed. As a workaround, I suffixed the name with current DateTime to make it unique.

chrome.notifications.create(`my-notification-${Date.now()}`, {
    type: "basic",
    iconUrl: "icons/logo.png",
    title: "My Title",
    message: "My Message",
});

answered Aug 27 '20 at 13:03

2

Thank you - that was my problem too. You can also leave that name/id as an empty string, and it works also. – BlakeyUK Sep 03 '21 at 13:14
This is annoying though, because I have a situation where I want to react to a notification button being pressed based on the notificationId, so I don't want to have to suffix it. Does anybody know a workaround? – Dylan Powers Apr 10 '23 at 01:43

score 6 · Answer 4 · answered Nov 14 '21 at 01:51

6

You may have chrome notifications blocked. A good hint this is the case is if you aren't being constantly spammed with notifications from other websites. This answer worked for me.

answered Nov 14 '21 at 01:51

Spankied

1,626
13
21

lol.. man.. you should be on top, how can i forget it.. i checked my all code.. again and again.. tried every possible combinations, debug.. aleart last error.. nothing.. helped me to figure it out..where is the problem, but when i seen your answers it hit me .. perfect.. – HackerGprat Nov 20 '22 at 14:21
Just a note, this was the solution for me after trying everything else, BUT despite getting it to pop up, I never see Google Chrome in my Windows "Get notifications from these senders" list with an on/off button, I just had to have the base "Notifications" on in windows settings. – Ivan Apr 12 '23 at 14:22

score 0 · Answer 5 · answered Mar 24 '21 at 09:39

use : chrome.runtime.lastError - add it to the callback (see example)

pay attention: you must have iconUrl icon URL path if related to your manifest

 chrome.notifications.create(`my-notification-${Date.now()}`, {
                iconUrl: "assets/images/1.png",
                type: "basic",
                contextMessage: "contextMessage",
                message: "message",
                title: "title"
            }, function(context) {
               console.log("Last error:", chrome.runtime.lastError);
               alert(JSON.stringify( chrome.runtime.lastError));
     
            });

Chrome Notifications not appearing from Chrome Extension background page

manifest.json

main.js

5 Answers5

Solution 1

Solution 2

Linked