I can get audio.currentTime but not set it (in Google Chrome)

Question

This is driving me crazy. Here is the code I use to set current time:

$("#audio").click(function(e) {
    e.preventDefault();
    mr_waveform_skip(e)
});

function mr_waveform_skip(event) {
    clientX = event.clientX;
    left = event.currentTarget.offsetLeft;
    clickoffset = clientX - left;
    percent = clickoffset/event.currentTarget.offsetWidth
    audio_duration = audio_element.duration;
    duration_seek = percent*audio_duration;
    audio_element.currentTime = duration_seek;
    // audio_element.currentTime = 10;
    console.log('CLICK: ' + duration_seek + ' Element: ' + audio_element + ' CurrentTime: ' + audio_element.currentTime);
}

I cannot seem to set audio_element.currentTime only get it!

And worse, it works in fireFox! Chrome restarts at 0, no matter what.

This is what the above code produces in Firefox console:

CLICK: 63.82905432385121 Element: [object HTMLAudioElement] CurrentTime: 3.849546

And in Chrome:

CLICK: 63.82905432385121 Element: [object HTMLAudioElement] CurrentTime: 3.849546

See? The same one! We can see that Chromes sees the HTML audio element (since it can get the value). If I do audio_element.currentTime = 10; it still does not work (in Chrome, Firefox loyally restarts at 10)..

Answer 1

Your code works perfectly when I tested it with with an Ogg file from Wikipedia.. If that really is all of your code, then this problem appears to be caused by some kind of corruption or unexpected format in your media file.

You will not be able to fix this problem with code; you will need to produce a new media file that your browser can process correctly. Perhaps try using a different piece of audio software (or different settings) to produce or re-process the media file.

Answer 2

If the format isn't the problem:

I've bumped into this problem in Chrome a couple of times today. Wasted so much time trying to solve it. (Version 55.x)

The solution is to restart Chrome. After countless page refreshes the value is suddenly not set. It's probably some cache bug. I would stress that using a development server supporting range requests is also a good idea.

If I'm not running Node or Django I use : https://github.com/danvk/RangeHTTPServer