Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Migration Chrome Extension v3 Notification

I am trying to migrate my Google Chrome extension manifest v2 to v3. But I have an error when I try to create a notification.

Error in service worker:

extensions::imageUtil:11
Uncaught ReferenceError: Image is not defined
at loadImageData (extensions::imageUtil:11)
at Object.loadAllImages (extensions::imageUtil:74)
at replaceNotificationOptionURLs (extensions::notifications:89)
at extensions::notifications:115
at service_workers.js:2

My service_workers.js:

self.addEventListener('activate', (event) => {
    chrome.notifications.create({
        type:     'basic',
        iconUrl:  'assets/images/icon_128.png',
        title:    'MyTitle',
        message:  'MyMessage!'
    });
});

My manifest.json

{
 "name": "My Extension",
 "description": "...",
 "version": "0.1",
 "manifest_version": 3,
 "permissions": [
   "storage",
   "alarms",
   "notifications",
   "activeTab",
   "tabs"
 ],
 "host_permissions": [
   "http://localhost:3000/api/data"
 ],
 "background": {
   "service_worker": "service_workers.js"
 },
 "action": {
   "default_title": "ExtensionPopup",
   "default_popup": "popup/popup.html"
 },
 "icons": {
   "128": "assets/images/icon_128.png"
 },
 "content_security_policy": {
   "extension_pages": "script-src 'self'; object-src 'self' "
 }
}

I also tried to provide iconUrl with chrome.runtime.getURL or base64 data, with no success. I am testing on Chrome canary V89.

Am I missing something ? Thank you in advance !

like image 891
uhsub Avatar asked Aug 05 '26 02:08

uhsub


1 Answers

according to the document from [email protected] for Manifest V3. Extension notifications are replaced by web notifications

My notification works like this, but I don't know if that's the right approach:

registration.showNotification(title, {
    body: message,
    data: UUID,
    icon: logoUrl,
    message,
    actions: [
      { action: 'Open', title: 'Open' },
      { action: 'Close', title: 'Close' }
    ]
  })

self.addEventListener('notificationclick', function (event) {
  if (event.action === 'Open') {
    // something(event.notification.data) // UUID
  }
  event.notification.close()
})
like image 158
spddl Avatar answered Aug 08 '26 08:08

spddl