CODEWITHSUNDEEP
javascriptgoogle-chromegoogle-chrome-extensionnotifications
Thomas Weiss
Thomas Weiss

Reputation: 375

Edit a chrome notification after it was called?

my chrome extension uses notifications. I am calling them with: 

function notifyMe(message) {
  if (!Notification) {
    alert('No desktop notifications possible!'); 
    return;
  }

  if (Notification.permission !== "granted")
    Notification.requestPermission();
  else {
    var notification = new Notification('Bot success!', {
      icon: 'https://material-design.storage.googleapis.com/publish/material_v_9/0Bx4BSt6jniD7blViQzF0azNqZU0/style_icons_system_intro_principles_consistent.png',
      body: message,
    });

    setTimeout(function() { notification.close() }, 5000);

    notification.onclick = function () {
      window.open("http://google.com");      
    };

  }

}

notifyMe("I am a notification!");

Is there a way to change message , icon and title when the notification is already there? And is there a way to close it down from another function instead of the 5000ms timeout inside the function itself?

I tried a few things about closing it from the outside by defining var notification; at the beginning of my script to allow access from everywhere, but this didn't work too well.

This might be pretty obvious, but I am still kind of new to JS. Sorry for that!

Any help is appreciated!

Upvotes: 0

Views: 1063

Answers (2)

Xan
Xan

Reputation: 77502

You are creating a notification using a (web) Notification API, not the extension specific chrome.notifications API. With that in mind:

And is there a way to close it down from another function instead of the 5000ms timeout inside the function itself?

As long as you store the notification object returned by the constructor, you can call notification.close() at any point.

I tried a few things about closing it from the outside by defining var notification; at the beginning of my script to allow access from everywhere, but this didn't work too well.

This is a valid strategy; but if you write var notification again inside your function, you no longer access the global notification variable but create a new local one with the same name. If you have a global variable, avoid adding var anywhere else.

Might want to check out You Don't Know JS: Scope & Closures if you're interested in a deeper look at how scope works in JS

Is there a way to change message, icon and title when the notification is already there?

You cannot edit an existing notification created by Notifications API - all of its properties are read-only after creation, and it does not prove an update method.

Instead, however, you can replace a notification if you create a new one with the same tag attribute:

new Notification('One', {
  tag: "replaceMe"
});
new Notification('Two', {
  tag: "replaceMe"
});
// Will result in only one notification, "Two", being shown

Consider using chrome.notifications API for your purposes. It offers a few more features over Notifications API, such as buttons (at least, in Chrome - less of an advantage if you want a shared codebase with Firefox), and doesn't require a runtime permission request.

Upvotes: 2

Joe
Joe

Reputation: 2540

You can update a Chrome notification using chrome.notifications.update

Upvotes: 0

Related Questions