0

Using a standard anchor element for downloading content, I can intercept the click event to inform the assisted user that the download is starting. However, there seems to be no event sent when a download is complete or fails. As it is, the sighted user can see the browser "Download complete popup", but that is completely invisible to blind users.

Context is Chromebook/Chrome/ChromeVox

HTML snippet:

<a id=asdf download href="http://50.18.90.151/scv/audio/3510b90ced0e914f83c81d8f03e47c01">
   download sound file</a>
<script>
    var elt = document.getElementById('asdf');
    console.log('Adding listeners', elt);
    elt.addEventListener('click', (evt) => {
        console.log('Starting download');
    });
    elt.addEventListener('load', (evt) => {
        console.log('This never gets called');
    });
</script>

I have tried all the following events and none fires: elt.addEventListener('close', (evt) => { elt.addEventListener('complete', (evt) => { elt.addEventListener('data', (evt) => { elt.addEventListener('downloading', (evt) => { elt.addEventListener('ended', (evt) => { elt.addEventListener('end', (evt) => { elt.addEventListener('loadend', (evt) => { elt.addEventListener('load', (evt) => { elt.addEventListener('message', (evt) => { elt.addEventListener('progress', (evt) => { elt.addEventListener('statechange', (evt) => { elt.addEventListener('storage', (evt) => { │ => elt.addEventListener('success', (evt) => { elt.addEventListener('writeend', (evt) => { elt.addEventListener('end', (evt) => {

OyaMist
  • 131
  • 5
  • 1
    I think you need to [edit] this question and share a bit more detail and a [mcve] before this question will get any traction. –  Oct 16 '18 at 18:34
  • Answer edited to show events tried – OyaMist Oct 16 '18 at 18:43
  • It's still unclear how you are expecting _something_ to act on events from _somewhere_. There are browser "iframe" javascript events and so on, but I don't think we have enough details to know what you are actually working with. Do you have some code? Can you tell us what frameworks or APIs are being used. Assume no one knows what "Chromebook" is, or are too busy to think about it. –  Oct 16 '18 at 18:47
  • I'm using Vue but the problem is not related to that, so the above example is raw HTML. I suspect that there is no documented and supported DOM event that does what I need. (edited) The really ugly solution is to tell the user "Download started, if you're lucky, you'll get a file in about 10 seconds". :( – OyaMist Oct 16 '18 at 19:55
  • 1
    related: https://stackoverflow.com/q/2343418/1531971 –  Oct 16 '18 at 21:48
  • Wow! Yes please do submit an answer related to the cookie suggestion so that I can accept it. The accepted answer doesn't work for me because I already discovered the lack of browser events. It had never occurred to me to use the cookie in the response. – OyaMist Oct 17 '18 at 15:44

1 Answers1

0

Thanks to @jdv for pointing out a related post which confirms that there is no browser event for download completion.

The solution is to have the server download handler return a session cookie such as "download-date". When the response has been processed, the cookie value will change and Javascript can be used to update the web application as desired.

  1. this is a transient cookie, so avoid maxAge and expires
  2. also avoid httpOnly so that client Javascript can access the cookie

That's it!

OyaMist
  • 131
  • 5