Why does this error appear on audio.play()?

Question

JavaScript

When the page loads, audio.play() is called. I get the error "Uncaught (in promise) DOMException: The play() request was interrupted by a call to pause().", and nothing works. The bottom line is that I'm still finalizing the code and this error did not exist before. Is there any way to fix this?

function create() { 
        work = true;
        audio = new Audio(playlist[j]);
        progressOn();
        timerOn();
        activeTrack(j);
}

function playPause(clicked = false) {
    if (work) {
        try {
            if (pp) {
                audio.play();
                document.getElementById('play').src = 'pause.png';
                move = true;
                clearInterval(interval);
                interval = setInterval(moving, 1000);
                pp = false;
            } else {
                audio.pause();
                document.getElementById('play').src = 'play.png';
                if (i == 0) {
                    audio.play;
                    i++;
                }
                clearInterval(interval);
                pp = true;
                move = false;
            }
        } catch {
            audio.pause();
            move = false;
        }
    } else if (clicked) {
        j = 0;
        work = true;
        create();
        playPause();
    }
}

Answer 1

Because browsers prohibit playing audio without user action.
https://developers.google.com/web/updates/2017/06/...
Solution: execute the function when the button is clicked.

Answer 2

Here is your code.