Greasemonkey for Office 365 Browser Notification

OWOuais.js

// ==UserScript==
// @name         OWouais
// @version      1
// @description  Bring the necessary Desktop Notification to Outlook Web App.
// @author       SD
// @match        https://outlook.office.com/owa/*
// @exclude      */manifests/*
// @grant        none
// ==/UserScript==

console.log('Start OWouais')
let oldMenuState = ""

if (!("Notification" in window)) {
  alert("This browser does not support desktop notification. OWouais will not work.")
} else {
  Notification.requestPermission()
  // Menu method (fallback for first and second emails)
  const menuInterval = setInterval(checkForNewMail, 5 * 1000)
  // Wait for element method, further emails
  let interval = 0
  interval = setInterval(() => {
    const el = document.getElementsByClassName("o365cs-notifications-notificationPopup")[0]
    if (el) {
      clearInterval(menuInterval)
      clearInterval(interval)
      listenForNotification(el)
    }
  }, 500)
}

function checkForNewMail() {
  try {
    var menuState = document.getElementsByClassName("subfolders")[0]
    menuState = menuState.innerText.replace(/Deleted Items\n[\d\s]+/, '') // Ignore Deleted Items
  } catch (e) {
    console.error("OWouais failure")
    return
  }
  if (menuState.match(/\d/) && menuState !== oldMenuState) {
    oldMenuState = menuState
    new Notification("Outlook", { body: `You got mail!`, icon })
  }
}

function listenForNotification(targetNode) {
  const notify = () => {
    const nt = targetNode.getElementsByClassName("o365cs-notifications-text")
    const subject = nt[2].innerText
    const from = nt[1].innerText
    new Notification("Outlook", { body: `${subject} - ${from}`, icon })
  }
  notify() // We are called for a reason, and we can't catch addedNodes the first time
  const observer = new MutationObserver((mut) => {
    if (mut[0].addedNodes.length > 0) {
      notify()
    }
  })
  observer.observe(targetNode, { childList: true })
}

var icon = [
  "data:image/png;base64,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"
].join('')