0

I am currently getting this error on Google Chrome when trying to run a JS function that plays sound on a button click.

here is the code:

index.html

<button type="button" id="test-button">Test C Key</button>

index.js

function playNote() {
  let audio = new Audio('sounds/c-major.wav')
  audio.play()
  }

document.getElementById('test-button').addEventListener('click', playNote())

Error:

index.js:3 Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first.

Any advice on how to overcome this? I understand that it can't play automatically but I am using a button click for trigger.

deadant88
  • 512
  • 1
  • 11
  • 1
    `playNote()` doesn't return anything, so you're 1. calling playNote() 2. doing `.addEventListener('click', undefined)`. You need `.addEventListener('click', playNote)` instead – ChrisG Jun 02 '22 at 07:37

0 Answers0