v149 · HTML · Permissions · usermedia

Constraints Builder

Build the <script type="permissionconstraints"> block for a <usermedia> element. Configure video/audio constraints, see the generated HTML and the equivalent getUserMedia() call side by side.

Origin Trial: <usermedia> is behind an origin trial in Chrome 149. This builder generates the correct markup so you have it ready when your OT token is in place. The element may not render in your current browser.

Constraint Configuration

Media tracks
Video constraints
Audio constraints
Advanced video fallbacks

Each fallback becomes one entry in video.advanced[], so the generated structure matches the MediaTrackConstraints branch.

<usermedia> HTML (Chrome 149 OT)valid JSON
getUserMedia() JavaScript equivalent
// building…

Live Preview

<usermedia> renders a browser-controlled button here
(requires Chrome 149 OT token to render natively)
—
Negotiated track settings will appear here.

why the element matters

/* getUserMedia() — developer controls the button label */
<button onclick="requestCamera()">Enable Camera</button>
/* User sees: "Enable Camera" — could be misleading */

/* <usermedia> — browser controls the button label and appearance */
<usermedia>
  <script type="permissionconstraints">
    { "video": { "facingMode": "user" }, "audio": true }
  </script>
</usermedia>
/* User sees: browser's trusted "Allow camera and microphone" button
   — can't be spoofed by page content */

see also