- Edited
I'm doing the following with javascript.
// Chrome (desktop) - refresh, navigate away
// Chrome (mobile) - background mode
// Safari (desktop) - change tab
// Safari (mobile) - background mode
// Firefox (desktop) - refresh, navigate away, change tab, close tab
// Firefox (mobile) - background mode
document.onvisibilitychange = function () {
if (document.visibilityState == "hidden") {
sendBeacon()
}
}
// Chrome (desktop) - change tab, close tab, close browser
// Safari (desktop) - refresh, close tab, close browser
// Firefox (desktop) - close browser
window.onbeforeunload = function () {
sendBeacon()
}
window.addEventListener("beforeunload", function () {
sendBeacon()
})
window.addEventListener("unload", function () {
sendBeacon()
})
// Chrome (mobile) - refresh, navigate away
// Safari (desktop) - navigate away
// Safari (mobile) - refresh, navigate away
// Firefox (mobile) - refresh, navigate away
window.onpagehide = function () {
sendBeacon()
}
const sendBeacon = useCallback(() => {
const url = `/api/groupChat/logout`
let headers = {
type: "application/json",
}
let payload = {
method: "publish",
params: {
channel: `server:${store.server.id}`,
data: {
origin: "centrifuge",
event: "onlineState",
data: { online: false, chatUserId: store.user.id },
},
},
}
let blob = new Blob([JSON.stringify(payload)], headers)
navigator.sendBeacon(url, blob)
}, [store.server.id, store.user.id])
Expected behavior:
Safari emits a beacon when the page closes
Orion and macOS:
Mac: Mojave 10.14.4
Orion: Version 0.99.109.1-beta (WebKit 613.1.12)