237323 2022-03-01 07:12:12 -0800 Occasional issue with pause from the play promise not working 2022-10-01 14:19:57 -0700 1 1 1 Unclassified WebKit Media Safari 15 Unspecified Unspecified NEW InRadar P2 Normal --- 1 hartman.wiki webkit-unassigned jer.noble supersonicandtails webkit-bug-importer oldest_to_newest 1847016 0 hartman.wiki 2022-03-01 07:12:12 -0800 I'm experiencing an occasional issue with the pause() command of <audio> elements not functioning... Codepen example: https://codepen.io/hartman/pen/ZEameXW?editors=1111 The reproduction conditions are as follows: 1. The audio sample needs to be supported by the device. MP3 qualifies. 2. The audio sample uses preload="none" 3. The audio sample is played. 4. The audio sample is paused from the promise of the play 5. The audio sample keeps playing, even thought the pause() was sent. Things I have noticed: 1. I can only trigger it on the initial playback when first opening the page. This might indicate that the load phase is very important, once in the resource cache, I can no longer trigger it (play not delayed because of the load?) 2. The load phase is probably also why preload="none" is a good trigger for this. 3. I've only been able to reproduce with mp3, but this might be a coincidence as I haven't tested a lot of mp4. 4. This happens quite often, say 1 in 10 or 1 in 20 or so playbacks, but definitely not all the time. 5. My older hardware like my 2015 MacBook Pro and my iPhone SE seem to trigger it more easily than my new 2021 MacBook Pro for instance, again indicating something about a racecondition due to performance. 6. Similarly, my reduced testcase on codepen seems to trigger this left often then a full blown website like https://commons.wikimedia.org/wiki/File:Armstrong_Small_Step.ogg (if this fails, you might hear the audio clip being played twice, until I have applied the workaround to production). 7. Wrapping the pause inside the play promise with a setTimeout, kicking it to the next cycle, also seems to fix this behaviour. 1847017 1 hartman.wiki 2022-03-01 07:13:13 -0800 Linking back to Wikimedia issue: https://phabricator.wikimedia.org/T301740 1849248 2 webkit-bug-importer 2022-03-08 07:13:15 -0800 <rdar://problem/89966322> 1902641 3 462751 supersonicandtails 2022-10-01 14:19:57 -0700 Created attachment 462751 Demonstrates Safari seemingly unpausing an audio element on its own I believe I have a self-contained test case that reproduces the "audio playing twice" issue after an initial audio element is paused. 462751 2022-10-01 14:19:57 -0700 2022-10-01 14:19:57 -0700 Demonstrates Safari seemingly unpausing an audio element on its own audio-pause.html text/html 1072 supersonicandtails PCFET0NUWVBFIGh0bWw+CjxodG1sIGxhbmc9ImVuIj4KPGhlYWQ+Cgk8bWV0YSBjaGFyc2V0PSJV VEYtOCI+Cgk8bWV0YSBuYW1lPSJ2aWV3cG9ydCIgY29udGVudD0id2lkdGg9ZGV2aWNlLXdpZHRo LCBpbml0aWFsLXNjYWxlPTEuMCI+Cgk8dGl0bGU+RG9jdW1lbnQ8L3RpdGxlPgo8L2hlYWQ+Cjxi b2R5PgoJPG9sPgoJCTxsaT5DbGljayBwbGF5LCB3YWl0IGZvciBhdWRpbyB0byBzdGFydDwvbGk+ CgkJPGxpPkNsaWNrIHBsYXkgYWdhaW4sIHF1aWNrbHkgc3dpdGNoIHRvIGFub3RoZXIgYnJvd3Nl ciB0YWI8L2xpPgoJCTxsaT5XYWl0IGZvciBhdWRpbyB0byBzdGFydCBhIHNlY29uZCB0aW1lPC9s aT4KCQk8bGk+U3dpdGNoIGJhY2sgdG8gdGhpcyBwYWdlJ3MgdGFiPC9saT4KCQk8bGk+Q2xpY2sg cGxheSBhZ2FpbiwgcXVpY2tseSBzd2l0Y2ggdG8gYW5vdGhlciBicm93c2VyIHRhYjwvbGk+CgkJ PGxpPldhaXQgZm9yIGF1ZGlvIHRvIHN0YXJ0IGFnYWluPC9saT4KCQk8bGk+U3dpdGNoIGJhY2sg dG8gdGhpcyBwYWdlJ3MgdGFiPC9saT4KCTwvb2w+Cgk8YnV0dG9uIHR5cGU9ImJ1dHRvbiIgaWQ9 InBsYXktYnV0dG9uIj5QbGF5PC9idXR0b24+Cgk8c2NyaXB0PgoJCWxldCBjdXJBdWRpbyA9IG51 bGw7CgoJCWZ1bmN0aW9uIHBsYXlOZXh0VHJhY2tBZnRlckRlbGF5KCkKCQl7CgkJCWxldCBvbGRB dWRpbyA9IGN1ckF1ZGlvOwoJCQljdXJBdWRpbyA9IG5ldyBBdWRpbygiaHR0cHM6Ly9zMy5hbWF6 b25hd3MuY29tL3BmZXJuYW5kZXMuY29tL3RyYWNrLWRvd25sb2Fkcy9xZWQvc2FtcGxlcy8wNy1t YXJrZXQtc3RyZWV0LXNhbXBsZS5tcDMiKTsKCQkJY3VyQXVkaW8ubG9hZCgpOwoKCQkJc2V0VGlt ZW91dCgoKSA9PiB7CgkJCQlvbGRBdWRpbz8ucGF1c2UoKTsKCQkJCWN1ckF1ZGlvLnBsYXkoKTsK CQl9LCAyMDAwKTsKCQl9CgoJCWNvbnN0IHBsYXlCdXR0b24gPSBkb2N1bWVudC5nZXRFbGVtZW50 QnlJZCgicGxheS1idXR0b24iKTsKCQlwbGF5QnV0dG9uLm9uY2xpY2sgPSAoKSA9PiBwbGF5TmV4 dFRyYWNrQWZ0ZXJEZWxheSgpOwoJPC9zY3JpcHQ+CjwvYm9keT4KPC9odG1sPg==