Sending an Electron notification

src/main/index.js

@@ -1,4 +1,4 @@
-const { app, BrowserWindow } = require('electron')
+const { app, BrowserWindow, ipcMain, Notification } = require('electron')
 
 let mainWindow
 
@@ -17,4 +17,14 @@ app.on('ready', () => {
   })
 
   mainWindow.loadURL(`file://${__dirname}/../renderer/index.html`)
+
+  ipcMain.on('send-notification', (event, options) => {
+    const notification = new Notification(options)
+
+    notification.on('click', () => {
+      mainWindow.send('clicked-notification')
+    })
+
+    notification.show()
+  })
 })

src/renderer/renderer.js

@@ -1,13 +1,15 @@
+const { ipcRenderer } = require('electron')
 const loadMonaco = require('monaco-loader')
 
-function sendNotification (editor) {
-  const notification = new window.Notification('Hello!', {
-    body: 'Hello from your notification system'
+function sendNotificationFromMain (editor) {
+  // We're telling the main process to send the notification
+  ipcRenderer.send('send-notification', {
+    body: 'Hello from the main process!'
   })
 
-  notification.onclick = () => {
+  ipcRenderer.once('clicked-notification', () => {
     editor.setValue('Notification clicked!')
-  }
+  })
 }
 
 loadMonaco().then((monaco) => {
@@ -28,6 +30,6 @@ loadMonaco().then((monaco) => {
     contextMenuOrder: 1,
     precondition: null,
     keybindingContext: null,
-    run: (editor) => sendNotification(editor)
+    run: (editor) => sendNotificationFromMain(editor)
   })
 })