Safari 11 new HTML5 Audio auto-limitations

Question

I am trying to understand how the limitations of autoplay of Safari 11 (and iOS) are implemented, and I do not understand why the following does not start playing the audio file:

const audio = new window.Audio() audio.src = 'https://raw.githubusercontent.com/vnglst/autoplay-tutorial/master/mp3/winamp.mp3' btn.onclick = e => { window .fetch( `https://api.github.com/repos/vnglst/autoplay-tutorial/contents/mp3/modem-sound.mp3` ) .then(resp => resp.json()) .then(json => { audio.src = json.download_url audio.play() }) } 

Jsfiddle code: https://jsfiddle.net/vnglst/f702pyw1/

While Safari is fine with the following:

 const audio = new window.Audio() audio.src = 'https://raw.githubusercontent.com/vnglst/autoplay-tutorial/master/mp3/modem-sound.mp3' const mockedPromise = new Promise((resolve, reject) => { setTimeout(() => { const src = 'https://raw.githubusercontent.com/vnglst/autoplay-tutorial/master/mp3/winamp.mp3' return resolve(src) }, 500) }) btn.onclick = (e) => { mockedPromise.then(src => { audio.src = src audio.play() }) } 

Jsfiddle: https://jsfiddle.net/vnglst/q4d6eozj/

Does anyone know how Safari determines if something is autoplay or not? I'm not looking for a job (like starting and pausing), but I'm trying to figure out how it works.

(more information about the new Safari auto-play policy can be found here: https://webkit.org/blog/7734/auto-play-policy-changes-for-macos/ )