"Toast"-like alerts in a Chrome Extension

Question

I am trying to replace the following line:

   alert("Success!");

with something similar to Android-style toasts (Meaning, a non-interruptive success message somewhere on the page). There are many JQuery solutions for this problem (see here), however I am having trouble using them from a Chrome Extension background page.

I have also tried injecting it into the current page, but this is not simple and also not working (because I need to inject JQuery, then the plugin, then me calling the plugin) and this becomes a little ridiculous.

Any ideas?

Answer 1

Desktop Notifications still seem to be best, however the link in the answer is broken.

Below is a working example of how to create a basic Desktop Notification from a Chrome Extension and a link to the docs for more:

const notificationId = 'abc123'

const options = {
    type: 'basic',
    iconUrl: 'chrome-extension://dklpcjlnpcnegggninnhpbhpneialgci/src/shared/icon.png',
    title: 'Hey',
    message: 'Hello world',
}

const callback = notificationId => console.log('notificationId: ', notificationId)

chrome.notifications.create(notificationId, options, callback)

More here: https://developer.chrome.com/docs/extensions/reference/notifications/

Answer 2

Use desktop notifications.