I am making a file uploader, and if the user submit the navigates away from the page before the file uploading is complete, I wish to tell ask them if they are sure they wish to navigate away and loose thier upload.

In Chrome however it blocks the alert during beforeunload: Blocked alert('....') during beforeunload.

function confirmLooseUpload() {
    if (THIS.getAttribute('uploading') == "progress" ) {        
        return !alert("Wait for upload to complete? Press cancel to abort upload and navigate away now")
    }
}
window.addEventListener('beforeunload', confirmLooseUpload)

I research the issue and there is sendBeason, and it seems to be for small data, not a 10MB upload. Also most hits detail how to abort a fetch POST, rather than how to ensure it finishes.

Some solutions like this suggest just return a string seems to cancel the unload event, but it did not work for me:

function confirmLooseUpload(event) {
    if (THIS.getAttribute('uploading') == "progress" ) {
        return "There is a file upload in progress, please wait for it to finish..."
    }
}
window.addEventListener('beforeunload', confirmLooseUpload)