play_sound operation hijacks sound controls

[edwinv]

In #98 a new play_sound operation is added. The PR describes:

First, it uses the worlds shortest viable MP3 (93 bytes!) to overcome Apple's annoying "click to play" constraint on Mobile Safari. This process should be transparent and invisible. It does this by capturing the first interaction with the page and using that to immediately start and then stop playback; this "unlocks" the DOM object used to play the sound, document.audio.

This method has some serious drawbacks:

• With a strict Content Security Policy, the loaded audio file will generate an error on all pages:

Refused to load data:audio/mpeg;base64,... because it does not appear in the media-src directive of the Content Security Policy.

• Because the tab now has audio, all audio controls on a Mac are now linked to the tab. Clicking "play" on a keyboard starts the MP3 file instead of controlling other audio sources.
• When the page is opened on an iPhone, all other audio is paused to play the empty MP3 file. In our case it's a webview inside our native iPhone app.

We are forced to downgrade to 4.4.6, although we have no intention to use the play_sound operation. Maybe the audio for Mobile Safari hack should only be activated when using the play_sound operation?

[leastbad]

You know, I completely agree with you - this functionality should have been opt-in. I had no idea it would cause this concern, or else I would have done so out of the gate.

Let me work something up and we'll try to get an update pushed ASAP.

[edwinv]

Thanks for the fast respond @leastbad. And thanks for giving us a good laugh. We had some fun this morning to figure out why our accounting software suddenly was playing music 🤣

[leastbad]

@edwinv feel free to stick your CR client to the commit associated with #112. Otherwise, there will be a patch release coming quite soon. Thanks for helping us catch this.

[kieranklaassen]

Our wine website also plays music, how fun :)

[leastbad]

Our wine website also plays music, how fun :)

I really am sorry about this, but it's exactly why we pulled it out of core: we flew too close to the sun and could not anticipate every diverse scenario that might come up.

It's my hope that you can instead take the ideas I wanted to express from the source and cut your own custom operation that hits the sweet spot for your application. For example, you might need to test and see if audio is already playing? I don't know. Safari makes everything complicated.

The main takeaway from the hack I used is that the first sound has to be played in direct response to the event that captured it; you cannot delegate it, setTimeout it, or anything else. It has to be in the event handler function for the event, period.

Good luck!

[kieranklaassen]

No worries!! I'm really happy you added it to SR, it's just kind of funny. We upgraded our version, thanks for the awesome work @leastbad !