demo · v144
Permission UX Compare
The motivation for <usermedia> is permission ergonomics: a user-activated declarative control gives the agent a strong intent signal, so the prompt is in-context, not surprise pop-up. Run both flows side by side and compare what the user actually sees.
Behind a flag in Chrome 144 — enable
chrome://flags/#enable-experimental-web-platform-features or join the origin trial. The imperative lane uses getUserMedia and works everywhere.
browser support: checking…
imperative (legacy)
JS-triggered prompt. The agent has no intent signal — the page calls getUserMedia whenever it wants.
user sees:
declarative <usermedia>
User activates a built-in control. Agent knows the user pressed it — can show inline or silent grant.
user sees:
0prompts shown
0grants received
0denials
the API
<!-- declarative: the user taps the control, the UA mediates -->
<usermedia kind="microphone">Start mic</usermedia>
<script>
const el = document.querySelector("usermedia");
el.addEventListener("capture", (e) => {
audio.srcObject = e.stream; // MediaStream from a trusted activation
});
</script>
<!-- imperative: JS asks; UA must prompt because intent is unclear -->
<script>
btn.addEventListener("click", async () => {
const s = await navigator.mediaDevices.getUserMedia({ audio: true });
});
</script>