https://developer.apple.com/videos/play/wwdc2022/10098/

navigator.serviceWorker.getRegistration.js

const applicationServerKey = 'BDd3_hVL9fZi9Ybo2UUzA284WG5FZR30_95YeZJsiApwXKpNcF1rRPF3foIiBHXRdJI2Qhumhf6_LFTeZaNndIo'

async function send() {
  let reg = await navigator.serviceWorker.getRegistration()
  if (!reg) reg = await navigator.serviceWorker.register('./service-worker.js')
  let subs = await reg.pushManager.getSubscription()
  if (!subs) subs =  await (await navigator.serviceWorker.ready).pushManager.subscribe({ userVisibleOnly: true, applicationServerKey })
  const subscription = subs.toJSON()

  await fetch('https://web-push-server.vercel.app/api/send', {
    method: 'POST',
    body: JSON.stringify({ subscription, payload: { title: 'やあ😸' } })
  })
}

if (Notification.permission === 'default') {
  Notification.requestPermission().then(permission => {
    if (permission === 'granted') send()
    else if (permission === 'default') {
      addEventListener('click', () => Notification.requestPermission().then(permission => permission === 'granted' && send()), { once: true })
    }
  })
} else if (Notification.permission === 'granted') {
  send()
}

const permission = await Notification.requestPermission()
if (permission === 'default') console.log('show button')

const applicationServerKey = 'BDd3_hVL9fZi9Ybo2UUzA284WG5FZR30_95YeZJsiApwXKpNcF1rRPF3foIiBHXRdJI2Qhumhf6_LFTeZaNndIo'
let reg = await navigator.serviceWorker.getRegistration()
console.log('registration', reg)
if (!reg) reg = await navigator.serviceWorker.register('./service-worker.js')
let subs = await reg.pushManager.getSubscription()
console.log('subscription', subs)
if (!subs) subs =  await reg.pushManager.subscribe({ userVisibleOnly: true, applicationServerKey })
const subscription = subs.toJSON()

await fetch('https://web-push-server.vercel.app/api/send', {
  method: 'POST',
  body: JSON.stringify({ subscription, payload: { title: 'やあ😸' } })
})

registration undefined
VM673:9 subscription null
Uncaught DOMException: Failed to execute 'subscribe' on 'PushManager': Subscription failed - no active Service Worker
at :10:42

(await navigator.serviceWorker.getRegistration()).active is null if first time

https://caniuse.com/es6-module

https://caniuse.com/mdn-api_document_execcommand_copy