JavaScript play() bug in Safari 15

Viewed 137

I want to use the HTMLMediaElement.play() method to play a sound when a button is clicked. Everything working fine in Chrome and Firefox, but Safari 15... Every time I click the button there is some kind of delay or it is not even played. I used the code as described below:

const mainButton = document.getElementById('main-button');
const buttonSound = new Audio (button-sound.mp3);

mainButton.addEventListener('click', e => {
  buttonSound.play();
});

It would be great if someone could help!

1 Answers

I have not tried it yet, but this seems like a viable solution: https://browserhow.com/how-to-allow-or-block-auto-play-sound-access-in-safari-mac/ it sounds like it is disabled by default in the browser so if you enable it, it should then play. If it is delayed, does the sound file start from 0 seconds? I know that sounds obvious but that could be a reason for the delay.

This can be changed I believe by going into the safari settings specifically the article indicates to do this as follows:

  1. Launch the Safari app on a mac computer.
  2. Select Safari from the menubar options.
  3. Choose Preferences… option under the Safari menu.
  4. Switch to the Websites tab within the Preferences popup window.
  5. Choose the Auto-Play in the sidebar.
  6. At the bottom of the drop-down — When visiting other websites select Allow All Auto-Play.

enter image description here

Related