How to Fix “DOMException: play() failed because the user didn't interact with the document first” in Web Games

Autoplay policy is universal now: no sound before the first click, tap, or key. Games that embrace the gate ship silently-failing-free. Here is the standard pattern.

How to fix it

1. Design the gesture gate

A 'Click to Start' screen (or the first menu click) is where music begins — call play() inside that handler and the policy is satisfied for the session.

2. Always catch the promise

audio.play().catch(() => queueForUnlock()) — an uncaught rejection is console noise at best and an error-tracking flood at worst; queue and retry on first input.

3. Unlock the whole pipeline once

On first gesture, resume your AudioContext / play a muted sound, then everything (SFX, later music) works — one unlock function called from pointerdown and keydown covers all inputs.

4. Test the strict browsers

iOS Safari is strictest (and per-element); verify music, SFX, and tab-return behavior there before shipping an embed.

Catching the ones you can't reproduce

The hardest version of this to fix is the one you can't reproduce — it only happens on a player's hardware, OS, driver, or save state, under conditions that simply aren't present on your machine. A report that says “it crashed” or “it froze” gives you nothing to act on, so the bug survives release after release while quietly costing you players.

Automatic error capture closes that gap. Each failure arrives with its full stack trace, the device and OS, the build number, and a breadcrumb trail of what the player did right before it broke, so even a failure you have never seen becomes a specific, reproducible issue. Fold identical failures into one signature ranked by how many players each hits, and your worklist sorts itself worst-first instead of arriving as a stream of vague complaints.

This is where a tool like Bugnet earns its place. Its SDK captures every HTML5 error automatically with the full stack trace plus device, OS, memory, build, and game-state context, folds duplicates into one grouped issue with an occurrence count, and ties each to the build it first appeared on — so you fix the problem that hurts the most players first and confirm it is gone when its signature disappears from the next release.