p5.SoundFile loadSound() autoplay behavior after library upgrade
0 reputation · 25 Sept 2023, 19:40 UTC
0 reputation · 25 Sept 2023, 19:40 UTC
Determine whether loadSound() should automatically start playback after a p5.js or p5.sound upgrade, while respecting browser autoplay restrictions.
Modern browsers block audio that starts without a user gesture. loadSound() currently returns a p5.SoundFile that must be explicitly played, and the underlying AudioContext begins in a suspended state until resumed.
Upgrading the library may change the internal initialization of the AudioContext, potentially altering whether loadSound() can resume automatically. It is unclear if the default behavior should remain unchanged or be enhanced with an optional auto‑play flag.
loadSound() expose an optional autoPlay parameter?AudioContext is resumed in compliance with browser policies?No, loadSound() should not automatically start playback, regardless of library upgrades. Modern browsers strictly enforce autoplay policies, so any attempt to trigger audio without a preceding user gesture (such as a click or key press) will be blocked by the browser engine, not by the p5.js library.
The underlying Web Audio API requires the AudioContext to be in a running state. By default, browsers initialize this context as suspended. While a library upgrade might change how the AudioContext is instantiated, it cannot bypass the browser's requirement for a user gesture to resume that context.
An optional autoPlay flag would not solve the underlying problem: the browser would still block playback without a gesture. Adding such a parameter risks implying behavior the library cannot reliably deliver, so the safer design is to keep loadSound() as a pure loading operation and require explicit playback from a gesture handler.
Decouple loading from playback:
preload() so the p5.SoundFile is fully buffered before the sketch starts..play() inside a user-initiated event handler.let mySound;
function preload() {
mySound = loadSound('audio.mp3');
}
function mousePressed() {
// This user gesture resumes the AudioContext and starts playback
mySound.play();
}
When upgrading p5.js and p5.sound, avoid relying on implicit timing or auto-start workarounds. The safest strategy is to explicitly manage the AudioContext state. If you encounter a suspended context after an upgrade, resume it within a gesture:
function mousePressed() {
if (getAudioContext().state === 'suspended') {
getAudioContext().resume();
}
mySound.play();
}
To check whether an upgrade changed behavior or the browser is blocking audio, open the browser console. A warning such as "The AudioContext was not allowed to start" indicates a browser policy restriction rather than a library bug. Also confirm the p5.sound version in your script tag matches your p5.js core version, since mismatched versions are a common source of post-upgrade issues.
Diagnostic question: Are you calling .play() inside setup() or draw() without a preceding user interaction? If so, moving it into a gesture handler is the fix.
Use comments to ask for clarification. Post a solution as an answer.
35,275 reputation · 25 Sept 2023, 22:46 UTC
In p5.js ≥ 1.6 the loadSound() API was rewritten to return a Promise that resolves with a p5.SoundFile. The function no longer starts playback automatically. A new autoplay option can be passed in the options object, but it only triggers .play() if the AudioContext is already in the running state; otherwise the promise resolves and the file stays paused.
Typical usage:
loadSound('song.mp3', null, null, {autoplay:true})
.then(s => console.log('loaded', s));
To guarantee playback after a user gesture, call sound.play() inside the event handler and, if necessary, resume the context with sound._soundContext.resume().