diff --git a/index.html b/index.html
index e2d6b232..6bc68065 100644
--- a/index.html
+++ b/index.html
@@ -4,9 +4,9 @@
   <meta content="width=device-width, initial-scale=1, shrink-to-fit=no" name="viewport">
   <title>WebCodecs</title>
   <link href="https://www.w3.org/StyleSheets/TR/2016/W3C-ED" rel="stylesheet" type="text/css">
-  <meta content="Bikeshed version 800b43329, updated Tue May 25 14:13:32 2021 -0700" name="generator">
+  <meta content="Bikeshed version 21183bac3, updated Tue Jun 15 10:19:19 2021 -0700" name="generator">
   <link href="https://www.w3.org/TR/webcodecs/" rel="canonical">
-  <meta content="b3e3cc3412e9a7739f8891da3e139b077f13a593" name="document-revision">
+  <meta content="a96a6d773dc15061576ca6a1c74e7a6d00251baf" name="document-revision">
 <style>
 main > dl > dd {
   margin-bottom: 1em;
@@ -586,7 +586,7 @@
   <div class="head">
    <p data-fill-with="logo"><a class="logo" href="https://www.w3.org/"> <img alt="W3C" height="48" src="https://www.w3.org/StyleSheets/TR/2016/logos/W3C" width="72"> </a> </p>
    <h1 class="p-name no-ref" id="title">WebCodecs</h1>
-   <h2 class="no-num no-toc no-ref heading settled" id="profile-and-date"><span class="content">Editor’s Draft, <time class="dt-updated" datetime="2021-06-08">8 June 2021</time></span></h2>
+   <h2 class="no-num no-toc no-ref heading settled" id="profile-and-date"><span class="content">Editor’s Draft, <time class="dt-updated" datetime="2021-06-15">15 June 2021</time></span></h2>
    <div data-fill-with="spec-metadata">
     <dl>
      <dt>This version:
@@ -763,17 +763,14 @@ <h2 class="no-num no-toc no-ref" id="contents">Table of Contents</h2>
         <li><a href="#videoframe-internal-slots"><span class="secno">9.4.1</span> <span class="content">Internal Slots</span></a>
         <li><a href="#videoframe-constructors"><span class="secno">9.4.2</span> <span class="content">Constructors</span></a>
         <li><a href="#videoframe-attributes"><span class="secno">9.4.3</span> <span class="content">Attributes</span></a>
-        <li><a href="#videoframe-methods"><span class="secno">9.4.4</span> <span class="content">Methods</span></a>
-        <li><a href="#videoframe-algorithms"><span class="secno">9.4.5</span> <span class="content">Algorithms</span></a>
+        <li><a href="#videoframe-internal-structures"><span class="secno">9.4.4</span> <span class="content">Internal Structures</span></a>
+        <li><a href="#videoframe-methods"><span class="secno">9.4.5</span> <span class="content">Methods</span></a>
+        <li><a href="#videoframe-algorithms"><span class="secno">9.4.6</span> <span class="content">Algorithms</span></a>
        </ol>
-      <li>
-       <a href="#plane-interface"><span class="secno">9.5</span> <span class="content">Plane Interface</span></a>
-       <ol class="toc">
-        <li><a href="#plane-internal-slots"><span class="secno">9.5.1</span> <span class="content">Internal Slots</span></a>
-        <li><a href="#plane-attributes"><span class="secno">9.5.2</span> <span class="content">Attributes</span></a>
-        <li><a href="#plane-methods"><span class="secno">9.5.3</span> <span class="content">Methods</span></a>
-       </ol>
-      <li><a href="#pixel-format"><span class="secno">9.6</span> <span class="content">Pixel Format</span></a>
+      <li><a href="#videoframe-copyto-options"><span class="secno">9.5</span> <span class="content">VideoFrame CopyTo() Options</span></a>
+      <li><a href="#videoframe-rect"><span class="secno">9.6</span> <span class="content">VideoFrame Rectangle (Rect)</span></a>
+      <li><a href="#plane-layout"><span class="secno">9.7</span> <span class="content">Plane Layout</span></a>
+      <li><a href="#pixel-format"><span class="secno">9.8</span> <span class="content">Pixel Format</span></a>
      </ol>
     <li>
      <a href="#image-decoding"><span class="secno">10</span> <span class="content">Image Decoding</span></a>
@@ -897,29 +894,16 @@ <h3 class="heading settled" data-level="2.2" id="control-thread-and-codec-thread
 to schedule work.</p>
    <p><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="running a control message|control message steps" data-noexport id="running-a-control-message">Running a control
 message</dfn> means performing a sequence of steps specified by the method
-that enqueued the message. The steps of a control message may depend on <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="injected-state">injected state</dfn>, supplied by the method that enqueued the message.</p>
-   <p><dfn class="dfn-paneled" data-dfn-type="dfn" data-lt="Reset the control message queue" data-noexport id="reset-the-control-message-queue">Resetting the control message
-    queue</dfn> means performing these steps:</p>
-   <ol>
-    <li data-md>
-     <p>For each <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages③">control message</a> in the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue①">control message queue</a>:</p>
-     <ol>
-      <li data-md>
-       <p>If a control message’s <a data-link-type="dfn" href="#injected-state" id="ref-for-injected-state">injected state</a> includes a promise, reject
-that promise.</p>
-      <li data-md>
-       <p>Remove the message from the queue.</p>
-     </ol>
-   </ol>
+that enqueued the message.</p>
    <p>The <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="codec-processing-loop">codec processing loop</dfn> must run these steps:</p>
    <ol>
     <li data-md>
      <p>While true:</p>
      <ol>
       <li data-md>
-       <p>If the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue②">control message queue</a> is empty, <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#iteration-continue" id="ref-for-iteration-continue">continue</a>.</p>
+       <p>If the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue①">control message queue</a> is empty, <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#iteration-continue" id="ref-for-iteration-continue">continue</a>.</p>
       <li data-md>
-       <p>Dequeue <var>front message</var> from the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue③">control message queue</a>.</p>
+       <p>Dequeue <var>front message</var> from the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue②">control message queue</a>.</p>
       <li data-md>
        <p>Run <a data-link-type="dfn" href="#running-a-control-message" id="ref-for-running-a-control-message">control message steps</a> described by <var>front message</var>.</p>
      </ol>
@@ -969,6 +953,9 @@ <h3 class="heading settled" data-level="3.1" id="audiodecoder-internal-slots"><s
     <dd data-md>
      <p>The number of pending decode requests. This number will decrease as the
 underlying codec is ready to accept new input.</p>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="AudioDecoder" data-dfn-type="attribute" data-export id="dom-audiodecoder-pending-flush-promises-slot"><code>[[pending flush promises]]</code></dfn>
+    <dd data-md>
+     <p>A list of unresolved promises returned by calls to <code class="idl"><a data-link-type="idl" href="#dom-audiodecoder-flush" id="ref-for-dom-audiodecoder-flush①">flush()</a></code>.</p>
    </dl>
    <h3 class="heading settled" data-level="3.2" id="audiodecoder-constructors"><span class="secno">3.2. </span><span class="content">Constructors</span><a class="self-link" href="#audiodecoder-constructors"></a></h3>
     <dfn class="dfn-paneled idl-code" data-dfn-for="AudioDecoder" data-dfn-type="constructor" data-export data-lt="AudioDecoder(init)|constructor(init)" id="dom-audiodecoder-audiodecoder" title="AudioDecoder(init)"><code> AudioDecoder(init) </code></dfn> 
@@ -1068,7 +1055,7 @@ <h3 class="heading settled" data-level="3.4" id="audiodecoder-methods"><span cla
      </ol>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="AudioDecoder" data-dfn-type="method" data-export id="dom-audiodecoder-flush"><code>flush()</code></dfn>
     <dd>
-      Completes all <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages④">control messages</a> in the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue④">control message queue</a> and emits all outputs. 
+      Completes all <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages③">control messages</a> in the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue③">control message queue</a> and emits all outputs. 
      <p>When invoked, run these steps:</p>
      <ol>
       <li data-md>
@@ -1079,6 +1066,8 @@ <h3 class="heading settled" data-level="3.4" id="audiodecoder-methods"><span cla
        <p>Let <var>promise</var> be a new Promise.</p>
       <li data-md>
        <p><a data-link-type="dfn" href="#enqueues-a-control-message" id="ref-for-enqueues-a-control-message④">Queue a control message</a> to flush the codec with <var>promise</var>.</p>
+      <li data-md>
+       <p>Append <var>promise</var> to <code class="idl"><a data-link-type="idl" href="#dom-audiodecoder-pending-flush-promises-slot" id="ref-for-dom-audiodecoder-pending-flush-promises-slot">[[pending flush promises]]</a></code>.</p>
       <li data-md>
        <p>Return <var>promise</var>.</p>
      </ol>
@@ -1094,18 +1083,24 @@ <h3 class="heading settled" data-level="3.4" id="audiodecoder-methods"><span cla
       <li data-md>
        <p>If <var>decoded outputs</var> is not empty, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread⑥">control thread</a> event loop to run the <a data-link-type="dfn" href="#output-audiodata" id="ref-for-output-audiodata①">Output AudioData</a> algorithm with <var>decoded outputs</var>.</p>
       <li data-md>
-       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread⑦">control thread</a> event loop to resolve <var>promise</var>.</p>
+       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread⑦">control thread</a> event loop to run these steps:</p>
+       <ol>
+        <li data-md>
+         <p>Remove <var>promise</var> from <code class="idl"><a data-link-type="idl" href="#dom-audiodecoder-pending-flush-promises-slot" id="ref-for-dom-audiodecoder-pending-flush-promises-slot①">[[pending flush promises]]</a></code>.</p>
+        <li data-md>
+         <p>Resolve <var>promise</var>.</p>
+       </ol>
      </ol>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="AudioDecoder" data-dfn-type="method" data-export id="dom-audiodecoder-reset"><code>reset()</code></dfn>
     <dd>
-      Immediately resets all state including configuration, <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages⑤">control messages</a> in the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue⑤">control message queue</a>, and all pending
+      Immediately resets all state including configuration, <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages④">control messages</a> in the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue④">control message queue</a>, and all pending
     callbacks. 
-     <p>When invoked, run the <a data-link-type="dfn" href="#reset-audiodecoder" id="ref-for-reset-audiodecoder">Reset AudioDecoder</a> algorithm.</p>
+     <p>When invoked, run the <a data-link-type="dfn" href="#reset-audiodecoder" id="ref-for-reset-audiodecoder">Reset AudioDecoder</a> algorithm with an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①">DOMException</a></code>.</p>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="AudioDecoder" data-dfn-type="method" data-export id="dom-audiodecoder-close"><code>close()</code></dfn>
     <dd>
       Immediately aborts all pending work and releases <a data-link-type="dfn" href="#system-resources" id="ref-for-system-resources">system resources</a>.
     Close is final. 
-     <p>When invoked, run the <a data-link-type="dfn" href="#close-audiodecoder" id="ref-for-close-audiodecoder②">Close AudioDecoder</a> algorithm.</p>
+     <p>When invoked, run the <a data-link-type="dfn" href="#close-audiodecoder" id="ref-for-close-audiodecoder②">Close AudioDecoder</a> algorithm with an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror①">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException②">DOMException</a></code>.</p>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="AudioDecoder" data-dfn-type="method" data-export id="dom-audiodecoder-isconfigsupported"><code>isConfigSupported(config)</code></dfn>
     <dd>
       Returns a promise indicating whether the provided <var>config</var> is supported by
@@ -1172,7 +1167,7 @@ <h3 class="heading settled" data-level="3.5" id="audiodecoder-algorithms"><span
          <p>Invoke <code class="idl"><a data-link-type="idl" href="#dom-audiodecoder-output-callback-slot" id="ref-for-dom-audiodecoder-output-callback-slot①">[[output callback]]</a></code> with <var>data</var>.</p>
        </ol>
      </ol>
-    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="reset-audiodecoder">Reset AudioDecoder</dfn>
+    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="reset-audiodecoder">Reset AudioDecoder</dfn> (with <var>exception</var>)
     <dd>
       Run these steps: 
      <ol>
@@ -1184,23 +1179,31 @@ <h3 class="heading settled" data-level="3.5" id="audiodecoder-algorithms"><span
        <p>Signal <code class="idl"><a data-link-type="idl" href="#dom-audiodecoder-codec-implementation-slot" id="ref-for-dom-audiodecoder-codec-implementation-slot⑤">[[codec implementation]]</a></code> to cease producing
 output for the previous configuration.</p>
       <li data-md>
-       <p><a data-link-type="dfn" href="#reset-the-control-message-queue" id="ref-for-reset-the-control-message-queue">Reset the control message queue</a>.</p>
+       <p>Remove all <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages⑤">control messages</a> from the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue⑤">control message queue</a>.</p>
       <li data-md>
        <p>Set <code class="idl"><a data-link-type="idl" href="#dom-audiodecoder-decodequeuesize-slot" id="ref-for-dom-audiodecoder-decodequeuesize-slot③">[[decodeQueueSize]]</a></code> to zero.</p>
+      <li data-md>
+       <p>For each <var>promise</var> in <code class="idl"><a data-link-type="idl" href="#dom-audiodecoder-pending-flush-promises-slot" id="ref-for-dom-audiodecoder-pending-flush-promises-slot②">[[pending flush promises]]</a></code>:</p>
+       <ol>
+        <li data-md>
+         <p>Reject <var>promise</var> with <var>exception</var>.</p>
+        <li data-md>
+         <p>Remove <var>promise</var> from <code class="idl"><a data-link-type="idl" href="#dom-audiodecoder-pending-flush-promises-slot" id="ref-for-dom-audiodecoder-pending-flush-promises-slot③">[[pending flush promises]]</a></code>.</p>
+       </ol>
      </ol>
-    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="close-audiodecoder">Close AudioDecoder</dfn> (with error)
+    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="close-audiodecoder">Close AudioDecoder</dfn> (with <var>exception</var>)
     <dd>
       Run these steps: 
      <ol>
       <li data-md>
-       <p>Run the <a data-link-type="dfn" href="#reset-audiodecoder" id="ref-for-reset-audiodecoder①">Reset AudioDecoder</a> algorithm.</p>
+       <p>Run the <a data-link-type="dfn" href="#reset-audiodecoder" id="ref-for-reset-audiodecoder①">Reset AudioDecoder</a> algorithm with <var>exception</var>.</p>
       <li data-md>
        <p>Set <code class="idl"><a data-link-type="idl" href="#dom-audiodecoder-state-slot" id="ref-for-dom-audiodecoder-state-slot⑧">[[state]]</a></code> to <code>"closed"</code>.</p>
       <li data-md>
        <p>Clear <code class="idl"><a data-link-type="idl" href="#dom-audiodecoder-codec-implementation-slot" id="ref-for-dom-audiodecoder-codec-implementation-slot⑥">[[codec implementation]]</a></code> and release associated <a data-link-type="dfn" href="#system-resources" id="ref-for-system-resources①">system resources</a>.</p>
       <li data-md>
-       <p>If <var>error</var> is set, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread⑧">control thread</a> event loop to
-invoke the <code class="idl"><a data-link-type="idl" href="#dom-audiodecoder-error-callback-slot" id="ref-for-dom-audiodecoder-error-callback-slot①">[[error callback]]</a></code> with <var>error</var>.</p>
+       <p>If <var>exception</var> is not an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror②">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException③">DOMException</a></code>, queue a task on
+the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread⑧">control thread</a> event loop to invoke the <code class="idl"><a data-link-type="idl" href="#dom-audiodecoder-error-callback-slot" id="ref-for-dom-audiodecoder-error-callback-slot①">[[error callback]]</a></code> with <var>exception</var>.</p>
      </ol>
    </dl>
    <h2 class="heading settled" data-level="4" id="videodecoder-interface"><span class="secno">4. </span><span class="content">VideoDecoder Interface</span><a class="self-link" href="#videodecoder-interface"></a></h2>
@@ -1250,6 +1253,9 @@ <h3 class="heading settled" data-level="4.1" id="videodecoder-internal-slots"><s
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoDecoder" data-dfn-type="attribute" data-export id="dom-videodecoder-decodequeuesize-slot"><code>[[decodeQueueSize]]</code></dfn>
     <dd data-md>
      <p>The number of pending decode requests. This number will decrease as the underlying codec is ready to accept new input.</p>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoDecoder" data-dfn-type="attribute" data-export id="dom-videodecoder-pending-flush-promises-slot"><code>[[pending flush promises]]</code></dfn>
+    <dd data-md>
+     <p>A list of unresolved promises returned by calls to <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-flush" id="ref-for-dom-videodecoder-flush①">flush()</a></code>.</p>
    </dl>
    <h3 class="heading settled" data-level="4.2" id="videodecoder-constructors"><span class="secno">4.2. </span><span class="content">Constructors</span><a class="self-link" href="#videodecoder-constructors"></a></h3>
     <dfn class="dfn-paneled idl-code" data-dfn-for="VideoDecoder" data-dfn-type="constructor" data-export data-lt="VideoDecoder(init)|constructor(init)" id="dom-videodecoder-videodecoder" title="VideoDecoder(init)"><code> VideoDecoder(init) </code></dfn> 
@@ -1358,13 +1364,15 @@ <h3 class="heading settled" data-level="4.4" id="videodecoder-methods"><span cla
      <p>When invoked, run these steps:</p>
      <ol>
       <li data-md>
-       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-state-slot" id="ref-for-dom-videodecoder-state-slot⑤">[[state]]</a></code> is not <code>"configured"</code>, return <a data-link-type="dfn" href="https://heycam.github.io/webidl/#a-promise-rejected-with" id="ref-for-a-promise-rejected-with②">a promise rejected with</a> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror⑥">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①">DOMException</a></code>.</p>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-state-slot" id="ref-for-dom-videodecoder-state-slot⑤">[[state]]</a></code> is not <code>"configured"</code>, return <a data-link-type="dfn" href="https://heycam.github.io/webidl/#a-promise-rejected-with" id="ref-for-a-promise-rejected-with②">a promise rejected with</a> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror⑥">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException④">DOMException</a></code>.</p>
       <li data-md>
        <p>Set <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-key-chunk-required-slot" id="ref-for-dom-videodecoder-key-chunk-required-slot④">[[key chunk required]]</a></code> to <code>true</code>.</p>
       <li data-md>
        <p>Let <var>promise</var> be a new Promise.</p>
       <li data-md>
        <p><a data-link-type="dfn" href="#enqueues-a-control-message" id="ref-for-enqueues-a-control-message⑨">Queue a control message</a> to flush the codec with <var>promise</var>.</p>
+      <li data-md>
+       <p>Append <var>promise</var> to <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-pending-flush-promises-slot" id="ref-for-dom-videodecoder-pending-flush-promises-slot">[[pending flush promises]]</a></code>.</p>
       <li data-md>
        <p>Return <var>promise</var>.</p>
      </ol>
@@ -1380,18 +1388,24 @@ <h3 class="heading settled" data-level="4.4" id="videodecoder-methods"><span cla
       <li data-md>
        <p>If <var>decoded outputs</var> is not empty, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread①②">control thread</a> event loop to run the <a data-link-type="dfn" href="#output-videoframes" id="ref-for-output-videoframes①">Output VideoFrames</a> algorithm with <var>decoded outputs</var>.</p>
       <li data-md>
-       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread①③">control thread</a> event loop to resolve <var>promise</var>.</p>
+       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread①③">control thread</a> event loop to run these steps:</p>
+       <ol>
+        <li data-md>
+         <p>Remove <var>promise</var> from <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-pending-flush-promises-slot" id="ref-for-dom-videodecoder-pending-flush-promises-slot①">[[pending flush promises]]</a></code>.</p>
+        <li data-md>
+         <p>Resolve <var>promise</var>.</p>
+       </ol>
      </ol>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoDecoder" data-dfn-type="method" data-export id="dom-videodecoder-reset"><code>reset()</code></dfn>
     <dd>
       Immediately resets all state including configuration, <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages⑦">control messages</a> in the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue⑦">control message queue</a>, and all pending
     callbacks. 
-     <p>When invoked, run the <a data-link-type="dfn" href="#reset-videodecoder" id="ref-for-reset-videodecoder">Reset VideoDecoder</a> algorithm.</p>
+     <p>When invoked, run the <a data-link-type="dfn" href="#reset-videodecoder" id="ref-for-reset-videodecoder">Reset VideoDecoder</a> algorithm with an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror③">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException⑤">DOMException</a></code>.</p>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoDecoder" data-dfn-type="method" data-export id="dom-videodecoder-close"><code>close()</code></dfn>
     <dd>
       Immediately aborts all pending work and releases <a data-link-type="dfn" href="#system-resources" id="ref-for-system-resources②">system resources</a>.
     Close is final. 
-     <p>When invoked, run the <a data-link-type="dfn" href="#close-videodecoder" id="ref-for-close-videodecoder②">Close VideoDecoder</a> algorithm.</p>
+     <p>When invoked, run the <a data-link-type="dfn" href="#close-videodecoder" id="ref-for-close-videodecoder②">Close VideoDecoder</a> algorithm with an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror④">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException⑥">DOMException</a></code>.</p>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoDecoder" data-dfn-type="method" data-export id="dom-videodecoder-isconfigsupported"><code>isConfigSupported(config)</code></dfn>
     <dd>
       Returns a promise indicating whether the provided <var>config</var> is supported by
@@ -1448,7 +1462,7 @@ <h3 class="heading settled" data-level="4.5" id="videodecoder-algorithms"><span
          <p>Invoke <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-output-callback-slot" id="ref-for-dom-videodecoder-output-callback-slot①">[[output callback]]</a></code> with <var>frame</var>.</p>
        </ol>
      </ol>
-    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="reset-videodecoder">Reset VideoDecoder</dfn>
+    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="reset-videodecoder">Reset VideoDecoder</dfn> (with <var>exception</var>)
     <dd>
       Run these steps: 
      <ol>
@@ -1460,23 +1474,31 @@ <h3 class="heading settled" data-level="4.5" id="videodecoder-algorithms"><span
        <p>Signal <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-codec-implementation-slot" id="ref-for-dom-videodecoder-codec-implementation-slot⑤">[[codec implementation]]</a></code> to cease producing
 output for the previous configuration.</p>
       <li data-md>
-       <p><a data-link-type="dfn" href="#reset-the-control-message-queue" id="ref-for-reset-the-control-message-queue①">Reset the control message queue</a>.</p>
+       <p>Remove all <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages⑧">control messages</a> from the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue⑧">control message queue</a>.</p>
       <li data-md>
        <p>Set <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-decodequeuesize-slot" id="ref-for-dom-videodecoder-decodequeuesize-slot③">[[decodeQueueSize]]</a></code> to zero.</p>
+      <li data-md>
+       <p>For each <var>promise</var> in <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-pending-flush-promises-slot" id="ref-for-dom-videodecoder-pending-flush-promises-slot②">[[pending flush promises]]</a></code>:</p>
+       <ol>
+        <li data-md>
+         <p>Reject <var>promise</var> with <var>exception</var>.</p>
+        <li data-md>
+         <p>Remove <var>promise</var> from <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-pending-flush-promises-slot" id="ref-for-dom-videodecoder-pending-flush-promises-slot③">[[pending flush promises]]</a></code>.</p>
+       </ol>
      </ol>
-    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="close-videodecoder">Close VideoDecoder</dfn> (with <var>error</var>)
+    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="close-videodecoder">Close VideoDecoder</dfn> (with <var>exception</var>)
     <dd>
       Run these steps: 
      <ol>
       <li data-md>
-       <p>Run the <a data-link-type="dfn" href="#reset-videodecoder" id="ref-for-reset-videodecoder①">Reset VideoDecoder</a> algorithm.</p>
+       <p>Run the <a data-link-type="dfn" href="#reset-videodecoder" id="ref-for-reset-videodecoder①">Reset VideoDecoder</a> algorithm with <var>exception</var>.</p>
       <li data-md>
        <p>Set <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-state" id="ref-for-dom-videodecoder-state③">state</a></code> to <code>"closed"</code>.</p>
       <li data-md>
        <p>Clear <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-codec-implementation-slot" id="ref-for-dom-videodecoder-codec-implementation-slot⑥">[[codec implementation]]</a></code> and release associated <a data-link-type="dfn" href="#system-resources" id="ref-for-system-resources③">system resources</a>.</p>
       <li data-md>
-       <p>If <var>error</var> is set, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread①④">control thread</a> event loop to
-invoke the <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-error-callback-slot" id="ref-for-dom-videodecoder-error-callback-slot①">[[error callback]]</a></code> with <var>error</var>.</p>
+       <p>If <var>exception</var> is not an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror⑤">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException⑦">DOMException</a></code>, queue a task on
+the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread①④">control thread</a> event loop to invoke the <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-error-callback-slot" id="ref-for-dom-videodecoder-error-callback-slot①">[[error callback]]</a></code> with <var>exception</var>.</p>
      </ol>
    </dl>
    <h2 class="heading settled" data-level="5" id="audioencoder-interface"><span class="secno">5. </span><span class="content">AudioEncoder Interface</span><a class="self-link" href="#audioencoder-interface"></a></h2>
@@ -1523,6 +1545,8 @@ <h3 class="heading settled" data-level="5.1" id="audioencoder-internal-slots"><s
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="AudioEncoder" data-dfn-type="attribute" data-export id="dom-audioencoder-encodequeuesize-slot"><code>[[encodeQueueSize]]</code></dfn>
     <dd> The number of pending encode requests. This number will decrease as the
   underlying codec is ready to accept new input. 
+    <dt><dfn class="dfn-paneled idl-code" data-dfn-for="AudioEncoder" data-dfn-type="attribute" data-export id="dom-audioencoder-pending-flush-promises-slot"><code>[[pending flush promises]]</code></dfn>
+    <dd> A list of unresolved promises returned by calls to <code class="idl"><a data-link-type="idl" href="#dom-audioencoder-flush" id="ref-for-dom-audioencoder-flush①">flush()</a></code>. 
    </dl>
    <h3 class="heading settled" data-level="5.2" id="audioencoder-constructors"><span class="secno">5.2. </span><span class="content">Constructors</span><a class="self-link" href="#audioencoder-constructors"></a></h3>
     <dfn class="dfn-paneled idl-code" data-dfn-for="AudioEncoder" data-dfn-type="constructor" data-export data-lt="AudioEncoder(init)|constructor(init)" id="dom-audioencoder-audioencoder" title="AudioEncoder(init)"><code> AudioEncoder(init) </code></dfn> 
@@ -1616,15 +1640,17 @@ <h3 class="heading settled" data-level="5.4" id="audioencoder-methods"><span cla
      </ol>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="AudioEncoder" data-dfn-type="method" data-export id="dom-audioencoder-flush"><code>flush()</code></dfn>
     <dd>
-      Completes all <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages⑧">control messages</a> in the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue⑧">control message queue</a> and emits all outputs. 
+      Completes all <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages⑨">control messages</a> in the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue⑨">control message queue</a> and emits all outputs. 
      <p>When invoked, run these steps:</p>
      <ol>
       <li data-md>
-       <p>If <code class="idl"><a data-link-type="idl" href="#dom-audioencoder-state-slot" id="ref-for-dom-audioencoder-state-slot⑤">[[state]]</a></code> is not <code>"configured"</code>, return <a data-link-type="dfn" href="https://heycam.github.io/webidl/#a-promise-rejected-with" id="ref-for-a-promise-rejected-with④">a promise rejected with</a> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror①⓪">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException②">DOMException</a></code>.</p>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-audioencoder-state-slot" id="ref-for-dom-audioencoder-state-slot⑤">[[state]]</a></code> is not <code>"configured"</code>, return <a data-link-type="dfn" href="https://heycam.github.io/webidl/#a-promise-rejected-with" id="ref-for-a-promise-rejected-with④">a promise rejected with</a> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror①⓪">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException⑧">DOMException</a></code>.</p>
       <li data-md>
        <p>Let <var>promise</var> be a new Promise.</p>
       <li data-md>
        <p><a data-link-type="dfn" href="#enqueues-a-control-message" id="ref-for-enqueues-a-control-message①④">Queue a control message</a> to flush the codec with <var>promise</var>.</p>
+      <li data-md>
+       <p>Append <var>promise</var> to <code class="idl"><a data-link-type="idl" href="#dom-audioencoder-pending-flush-promises-slot" id="ref-for-dom-audioencoder-pending-flush-promises-slot">[[pending flush promises]]</a></code>.</p>
       <li data-md>
        <p>Return <var>promise</var>.</p>
      </ol>
@@ -1640,18 +1666,24 @@ <h3 class="heading settled" data-level="5.4" id="audioencoder-methods"><span cla
       <li data-md>
        <p>If <var>encoded outputs</var> is not empty, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread①⑧">control thread</a> event loop to run the <a data-link-type="dfn" href="#output-encodedaudiochunks" id="ref-for-output-encodedaudiochunks①">Output EncodedAudioChunks</a> algorithm with <var>encoded outputs</var>.</p>
       <li data-md>
-       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread①⑨">control thread</a> event loop to resolve <var>promise</var>.</p>
+       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread①⑨">control thread</a> event loop to run these steps:</p>
+       <ol>
+        <li data-md>
+         <p>Remove <var>promise</var> from <code class="idl"><a data-link-type="idl" href="#dom-audioencoder-pending-flush-promises-slot" id="ref-for-dom-audioencoder-pending-flush-promises-slot①">[[pending flush promises]]</a></code>.</p>
+        <li data-md>
+         <p>Resolve <var>promise</var>.</p>
+       </ol>
      </ol>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="AudioEncoder" data-dfn-type="method" data-export id="dom-audioencoder-reset"><code>reset()</code></dfn>
     <dd>
-      Immediately resets all state including configuration, <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages⑨">control messages</a> in the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue⑨">control message queue</a>, and all pending
+      Immediately resets all state including configuration, <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages①⓪">control messages</a> in the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue①⓪">control message queue</a>, and all pending
     callbacks. 
-     <p>When invoked, run the <a data-link-type="dfn" href="#reset-audioencoder" id="ref-for-reset-audioencoder">Reset AudioEncoder</a> algorithm.</p>
+     <p>When invoked, run the <a data-link-type="dfn" href="#reset-audioencoder" id="ref-for-reset-audioencoder">Reset AudioEncoder</a> algorithm with an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror⑥">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException⑨">DOMException</a></code>.</p>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="AudioEncoder" data-dfn-type="method" data-export id="dom-audioencoder-close"><code>close()</code></dfn>
     <dd>
       Immediately aborts all pending work and releases <a data-link-type="dfn" href="#system-resources" id="ref-for-system-resources④">system resources</a>.
     Close is final. 
-     <p>When invoked, run the <a data-link-type="dfn" href="#close-audioencoder" id="ref-for-close-audioencoder②">Close AudioEncoder</a> algorithm.</p>
+     <p>When invoked, run the <a data-link-type="dfn" href="#close-audioencoder" id="ref-for-close-audioencoder②">Close AudioEncoder</a> algorithm with an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror⑦">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①⓪">DOMException</a></code>.</p>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="AudioEncoder" data-dfn-type="method" data-export id="dom-audioencoder-isconfigsupported"><code>isConfigSupported(config)</code></dfn>
     <dd>
       Returns a promise indicating whether the provided <var>config</var> is supported by
@@ -1743,7 +1775,7 @@ <h3 class="heading settled" data-level="5.5" id="audioencoder-algorithms"><span
          <p>Invoke <code class="idl"><a data-link-type="idl" href="#dom-audioencoder-output-callback-slot" id="ref-for-dom-audioencoder-output-callback-slot①">[[output callback]]</a></code> with <var>chunk</var> and <var>chunkMetadata</var>.</p>
        </ol>
      </ol>
-    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="reset-audioencoder">Reset AudioEncoder</dfn>
+    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="reset-audioencoder">Reset AudioEncoder</dfn> (with <var>exception</var>)
     <dd>
       Run these steps: 
      <ol>
@@ -1759,23 +1791,31 @@ <h3 class="heading settled" data-level="5.5" id="audioencoder-algorithms"><span
        <p>Signal <code class="idl"><a data-link-type="idl" href="#dom-audioencoder-codec-implementation-slot" id="ref-for-dom-audioencoder-codec-implementation-slot⑥">[[codec implementation]]</a></code> to cease producing
 output for the previous configuration.</p>
       <li data-md>
-       <p><a data-link-type="dfn" href="#reset-the-control-message-queue" id="ref-for-reset-the-control-message-queue②">Reset the control message queue</a>.</p>
+       <p>Remove all <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages①①">control messages</a> from the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue①①">control message queue</a>.</p>
       <li data-md>
        <p>Set <code class="idl"><a data-link-type="idl" href="#dom-audioencoder-encodequeuesize-slot" id="ref-for-dom-audioencoder-encodequeuesize-slot③">[[encodeQueueSize]]</a></code> to zero.</p>
+      <li data-md>
+       <p>For each <var>promise</var> in <code class="idl"><a data-link-type="idl" href="#dom-audioencoder-pending-flush-promises-slot" id="ref-for-dom-audioencoder-pending-flush-promises-slot②">[[pending flush promises]]</a></code>:</p>
+       <ol>
+        <li data-md>
+         <p>Reject <var>promise</var> with <var>exception</var>.</p>
+        <li data-md>
+         <p>Remove <var>promise</var> from <code class="idl"><a data-link-type="idl" href="#dom-audioencoder-pending-flush-promises-slot" id="ref-for-dom-audioencoder-pending-flush-promises-slot③">[[pending flush promises]]</a></code>.</p>
+       </ol>
      </ol>
-    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="close-audioencoder">Close AudioEncoder</dfn> (with <var>error</var>)
+    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="close-audioencoder">Close AudioEncoder</dfn> (with <var>exception</var>)
     <dd>
       Run these steps: 
      <ol>
       <li data-md>
-       <p>Run the <a data-link-type="dfn" href="#reset-audioencoder" id="ref-for-reset-audioencoder①">Reset AudioEncoder</a> algorithm.</p>
+       <p>Run the <a data-link-type="dfn" href="#reset-audioencoder" id="ref-for-reset-audioencoder①">Reset AudioEncoder</a> algorithm with <var>exception</var>.</p>
       <li data-md>
        <p>Set <code class="idl"><a data-link-type="idl" href="#dom-audioencoder-state-slot" id="ref-for-dom-audioencoder-state-slot⑧">[[state]]</a></code> to <code>"closed"</code>.</p>
       <li data-md>
        <p>Clear <code class="idl"><a data-link-type="idl" href="#dom-audioencoder-codec-implementation-slot" id="ref-for-dom-audioencoder-codec-implementation-slot⑦">[[codec implementation]]</a></code> and release associated <a data-link-type="dfn" href="#system-resources" id="ref-for-system-resources⑤">system resources</a>.</p>
       <li data-md>
-       <p>If <var>error</var> is set, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread②⓪">control thread</a> event loop
-invoke the <code class="idl"><a data-link-type="idl" href="#dom-audioencoder-error-callback-slot" id="ref-for-dom-audioencoder-error-callback-slot①">[[error callback]]</a></code> with <var>error</var>.</p>
+       <p>If <var>exception</var> is not an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror⑧">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①①">DOMException</a></code>, queue a task on
+the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread②⓪">control thread</a> event loop to invoke the <code class="idl"><a data-link-type="idl" href="#dom-audiodecoder-error-callback-slot" id="ref-for-dom-audiodecoder-error-callback-slot②">[[error callback]]</a></code> with <var>exception</var>.</p>
      </ol>
    </dl>
    <h3 class="heading settled" data-level="5.6" id="encoded-audio-chunk-metadata"><span class="secno">5.6. </span><span class="content">EncodedAudioChunkMetadata</span><a class="self-link" href="#encoded-audio-chunk-metadata"></a></h3>
@@ -1833,6 +1873,8 @@ <h3 class="heading settled" data-level="6.1" id="videoencoder-internal-slots"><s
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoEncoder" data-dfn-type="attribute" data-export id="dom-videoencoder-encodequeuesize-slot"><code>[[encodeQueueSize]]</code></dfn>
     <dd> The number of pending encode requests. This number will decrease as the
   underlying codec is ready to accept new input. 
+    <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoEncoder" data-dfn-type="attribute" data-export id="dom-videoencoder-pending-flush-promises-slot"><code>[[pending flush promises]]</code></dfn>
+    <dd> A list of unresolved promises returned by calls to <code class="idl"><a data-link-type="idl" href="#dom-videoencoder-flush" id="ref-for-dom-videoencoder-flush①">flush()</a></code>. 
    </dl>
    <h3 class="heading settled" data-level="6.2" id="videoencoder-constructors"><span class="secno">6.2. </span><span class="content">Constructors</span><a class="self-link" href="#videoencoder-constructors"></a></h3>
     <dfn class="dfn-paneled idl-code" data-dfn-for="VideoEncoder" data-dfn-type="constructor" data-export data-lt="VideoEncoder(init)|constructor(init)" id="dom-videoencoder-videoencoder" title="VideoEncoder(init)"><code> VideoEncoder(init) </code></dfn> 
@@ -1921,15 +1963,17 @@ <h3 class="heading settled" data-level="6.4" id="videoencoder-methods"><span cla
      </ol>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoEncoder" data-dfn-type="method" data-export id="dom-videoencoder-flush"><code>flush()</code></dfn>
     <dd>
-      Completes all <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages①⓪">control messages</a> in the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue①⓪">control message queue</a> and emits all outputs. 
+      Completes all <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages①②">control messages</a> in the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue①②">control message queue</a> and emits all outputs. 
      <p>When invoked, run these steps:</p>
      <ol>
       <li data-md>
-       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoencoder-state-slot" id="ref-for-dom-videoencoder-state-slot⑤">[[state]]</a></code> is not <code>"configured"</code>, return <a data-link-type="dfn" href="https://heycam.github.io/webidl/#a-promise-rejected-with" id="ref-for-a-promise-rejected-with⑥">a promise rejected with</a> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror①④">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException③">DOMException</a></code>.</p>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoencoder-state-slot" id="ref-for-dom-videoencoder-state-slot⑤">[[state]]</a></code> is not <code>"configured"</code>, return <a data-link-type="dfn" href="https://heycam.github.io/webidl/#a-promise-rejected-with" id="ref-for-a-promise-rejected-with⑥">a promise rejected with</a> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror①④">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①②">DOMException</a></code>.</p>
       <li data-md>
        <p>Let <var>promise</var> be a new Promise.</p>
       <li data-md>
        <p><a data-link-type="dfn" href="#enqueues-a-control-message" id="ref-for-enqueues-a-control-message①⑨">Queue a control message</a> to flush the codec with <var>promise</var>.</p>
+      <li data-md>
+       <p>Append <var>promise</var> to <code class="idl"><a data-link-type="idl" href="#dom-videoencoder-pending-flush-promises-slot" id="ref-for-dom-videoencoder-pending-flush-promises-slot">[[pending flush promises]]</a></code>.</p>
       <li data-md>
        <p>Return <var>promise</var>.</p>
      </ol>
@@ -1945,18 +1989,24 @@ <h3 class="heading settled" data-level="6.4" id="videoencoder-methods"><span cla
       <li data-md>
        <p>If <var>encoded outputs</var> is not empty, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread②④">control thread</a> event loop to run the <a data-link-type="dfn" href="#output-encodedvideochunks" id="ref-for-output-encodedvideochunks①">Output EncodedVideoChunks</a> algorithm with <var>encoded outputs</var>.</p>
       <li data-md>
-       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread②⑤">control thread</a> event loop to resolve <var>promise</var>.</p>
+       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread②⑤">control thread</a> event loop to run these steps:</p>
+       <ol>
+        <li data-md>
+         <p>Remove <var>promise</var> from <code class="idl"><a data-link-type="idl" href="#dom-videoencoder-pending-flush-promises-slot" id="ref-for-dom-videoencoder-pending-flush-promises-slot①">[[pending flush promises]]</a></code>.</p>
+        <li data-md>
+         <p>Resolve <var>promise</var>.</p>
+       </ol>
      </ol>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoEncoder" data-dfn-type="method" data-export id="dom-videoencoder-reset"><code>reset()</code></dfn>
     <dd>
-      Immediately resets all state including configuration, <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages①①">control messages</a> in the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue①①">control message queue</a>, and all pending
+      Immediately resets all state including configuration, <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages①③">control messages</a> in the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue①③">control message queue</a>, and all pending
     callbacks. 
-     <p>When invoked, run the <a data-link-type="dfn" href="#reset-videoencoder" id="ref-for-reset-videoencoder">Reset VideoEncoder</a> algorithm.</p>
+     <p>When invoked, run the <a data-link-type="dfn" href="#reset-videoencoder" id="ref-for-reset-videoencoder">Reset VideoEncoder</a> algorithm with an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror⑨">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①③">DOMException</a></code>.</p>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoEncoder" data-dfn-type="method" data-export id="dom-videoencoder-close"><code>close()</code></dfn>
     <dd>
       Immediately aborts all pending work and releases <a data-link-type="dfn" href="#system-resources" id="ref-for-system-resources⑥">system resources</a>.
     Close is final. 
-     <p>When invoked, run the <a data-link-type="dfn" href="#close-videoencoder" id="ref-for-close-videoencoder②">Close VideoEncoder</a> algorithm.</p>
+     <p>When invoked, run the <a data-link-type="dfn" href="#close-videoencoder" id="ref-for-close-videoencoder②">Close VideoEncoder</a> algorithm with an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror①⓪">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①④">DOMException</a></code>.</p>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoEncoder" data-dfn-type="method" data-export id="dom-videoencoder-isconfigsupported"><code>isConfigSupported(config)</code></dfn>
     <dd>
       Returns a promise indicating whether the provided <var>config</var> is supported by
@@ -2028,9 +2078,9 @@ <h3 class="heading settled" data-level="6.5" id="videoencoder-algorithms"><span
           <li data-md>
            <p>Assign <code>encoderConfig.codec</code> to <code>outputConfig.codec</code>.</p>
           <li data-md>
-           <p>Assign <code>encoderConfig.width</code> to <code>outputConfig.cropWidth</code>.</p>
+           <p>Assign <code>encoderConfig.width</code> to <code>outputConfig.visibleRect.width</code>.</p>
           <li data-md>
-           <p>Assign <code>encoderConfig.height</code> to <code>outputConfig.cropHeight</code>.</p>
+           <p>Assign <code>encoderConfig.height</code> to <code>outputConfig.visibleRect.height</code>.</p>
           <li data-md>
            <p>Assign <code>encoderConfig.displayWidth</code> to <code>outputConfig.displayWidth</code>.</p>
           <li data-md>
@@ -2063,7 +2113,7 @@ <h3 class="heading settled" data-level="6.5" id="videoencoder-algorithms"><span
          <p>Invoke <code class="idl"><a data-link-type="idl" href="#dom-videoencoder-output-callback-slot" id="ref-for-dom-videoencoder-output-callback-slot①">[[output callback]]</a></code> with <var>chunk</var> and <var>chunkMetadata</var>.</p>
        </ol>
      </ol>
-    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="reset-videoencoder">Reset VideoEncoder</dfn>
+    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="reset-videoencoder">Reset VideoEncoder</dfn> (with <var>exception</var>)
     <dd>
       Run these steps: 
      <ol>
@@ -2079,23 +2129,31 @@ <h3 class="heading settled" data-level="6.5" id="videoencoder-algorithms"><span
        <p>Signal <code class="idl"><a data-link-type="idl" href="#dom-videoencoder-codec-implementation-slot" id="ref-for-dom-videoencoder-codec-implementation-slot⑥">[[codec implementation]]</a></code> to cease producing
 output for the previous configuration.</p>
       <li data-md>
-       <p><a data-link-type="dfn" href="#reset-the-control-message-queue" id="ref-for-reset-the-control-message-queue③">Reset the control message queue</a>.</p>
+       <p>Remove all <a data-link-type="dfn" href="#control-messages" id="ref-for-control-messages①④">control messages</a> from the <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue①④">control message queue</a>.</p>
       <li data-md>
        <p>Set <code class="idl"><a data-link-type="idl" href="#dom-videoencoder-encodequeuesize-slot" id="ref-for-dom-videoencoder-encodequeuesize-slot③">[[encodeQueueSize]]</a></code> to zero.</p>
+      <li data-md>
+       <p>For each <var>promise</var> in <code class="idl"><a data-link-type="idl" href="#dom-videoencoder-pending-flush-promises-slot" id="ref-for-dom-videoencoder-pending-flush-promises-slot②">[[pending flush promises]]</a></code>:</p>
+       <ol>
+        <li data-md>
+         <p>Reject <var>promise</var> with <var>exception</var>.</p>
+        <li data-md>
+         <p>Remove <var>promise</var> from <code class="idl"><a data-link-type="idl" href="#dom-videoencoder-pending-flush-promises-slot" id="ref-for-dom-videoencoder-pending-flush-promises-slot③">[[pending flush promises]]</a></code>.</p>
+       </ol>
      </ol>
-    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="close-videoencoder">Close VideoEncoder</dfn> (with <var>error</var>)
+    <dt><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="close-videoencoder">Close VideoEncoder</dfn> (with <var>exception</var>)
     <dd>
       Run these steps: 
      <ol>
       <li data-md>
-       <p>Run the <a data-link-type="dfn" href="#reset-videoencoder" id="ref-for-reset-videoencoder①">Reset VideoEncoder</a> algorithm.</p>
+       <p>Run the <a data-link-type="dfn" href="#reset-videoencoder" id="ref-for-reset-videoencoder①">Reset VideoEncoder</a> algorithm with <var>exception</var>.</p>
       <li data-md>
        <p>Set <code class="idl"><a data-link-type="idl" href="#dom-videoencoder-state-slot" id="ref-for-dom-videoencoder-state-slot⑧">[[state]]</a></code> to <code>"closed"</code>.</p>
       <li data-md>
        <p>Clear <code class="idl"><a data-link-type="idl" href="#dom-videoencoder-codec-implementation-slot" id="ref-for-dom-videoencoder-codec-implementation-slot⑦">[[codec implementation]]</a></code> and release associated <a data-link-type="dfn" href="#system-resources" id="ref-for-system-resources⑦">system resources</a>.</p>
       <li data-md>
-       <p>If <var>error</var> is set, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread②⑥">control thread</a> event loop
-invoke the <code class="idl"><a data-link-type="idl" href="#dom-videoencoder-error-callback-slot" id="ref-for-dom-videoencoder-error-callback-slot①">[[error callback]]</a></code> with <var>error</var>.</p>
+       <p>If <var>exception</var> is not an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror①①">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①⑤">DOMException</a></code>, queue a task on
+the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread②⑥">control thread</a> event loop to invoke the <code class="idl"><a data-link-type="idl" href="#dom-audiodecoder-error-callback-slot" id="ref-for-dom-audiodecoder-error-callback-slot③">[[error callback]]</a></code> with <var>exception</var>.</p>
      </ol>
    </dl>
    <h3 class="heading settled" data-level="6.6" id="encoded-video-chunk-metadata"><span class="secno">6.6. </span><span class="content">EncodedVideoChunkMetadata</span><a class="self-link" href="#encoded-video-chunk-metadata"></a></h3>
@@ -2286,11 +2344,11 @@ <h3 class="heading settled" data-level="7.6" id="video-decoder-config"><span cla
      <p class="note" role="note"><span>NOTE:</span> The registrations in the <a data-link-type="biblio" href="#biblio-webcodecs-codec-registry">[WEBCODECS-CODEC-REGISTRY]</a> may describe whether/how
         to populate this sequence, corresponding to the provided <code class="idl"><a data-link-type="idl" href="#dom-videodecoderconfig-codec" id="ref-for-dom-videodecoderconfig-codec②">codec</a></code>.</p>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoDecoderConfig" data-dfn-type="dict-member" data-export id="dom-videodecoderconfig-codedwidth"><code>codedWidth</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long①⓪">unsigned long</a></span>
-    <dd> Width of the VideoFrame in pixels, prior to any cropping or aspect ratio
-        adjustments. 
+    <dd> Width of the VideoFrame in pixels, potentionally including non-visible
+    padding, and prior to considering potential ratio adjustments. 
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoDecoderConfig" data-dfn-type="dict-member" data-export id="dom-videodecoderconfig-codedheight"><code>codedHeight</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long①①">unsigned long</a></span>
-    <dd> Height of the VideoFrame in pixels, prior to any cropping or aspect ratio
-        adjustments. 
+    <dd> Height of the VideoFrame in pixels, potentionally including non-visible
+    padding, and prior to considering potential ratio adjustments. 
     <p class="note" role="note"><span>NOTE:</span> <code class="idl"><a data-link-type="idl" href="#dom-videodecoderconfig-codedwidth" id="ref-for-dom-videodecoderconfig-codedwidth③">codedWidth</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videodecoderconfig-codedheight" id="ref-for-dom-videodecoderconfig-codedheight③">codedHeight</a></code> are used when selecting a <code class="idl"><a data-link-type="idl" href="#dom-videodecoder-codec-implementation-slot" id="ref-for-dom-videodecoder-codec-implementation-slot⑦">[[codec implementation]]</a></code>.</p>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoDecoderConfig" data-dfn-type="dict-member" data-export id="dom-videodecoderconfig-displayaspectwidth"><code>displayAspectWidth</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long①②">unsigned long</a></span>
     <dd> Horizontal dimension of the VideoFrame’s aspect ratio when displayed. 
@@ -2340,6 +2398,7 @@ <h3 class="heading settled" data-level="7.8" id="video-encoder-config"><span cla
   [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange①③"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long②①"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-videoencoderconfig-displayheight" id="ref-for-dom-videoencoderconfig-displayheight"><c- g>displayHeight</c-></a>;
   <a data-link-type="idl-name" href="#enumdef-hardwareacceleration" id="ref-for-enumdef-hardwareacceleration③"><c- n>HardwareAcceleration</c-></a> <a class="idl-code" data-default="&quot;allow&quot;" data-link-type="dict-member" data-type="HardwareAcceleration " href="#dom-videoencoderconfig-hardwareacceleration" id="ref-for-dom-videoencoderconfig-hardwareacceleration"><c- g>hardwareAcceleration</c-></a> = "allow";
   <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString⑦"><c- b>DOMString</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="DOMString " href="#dom-videoencoderconfig-scalabilitymode" id="ref-for-dom-videoencoderconfig-scalabilitymode②"><c- g>scalabilityMode</c-></a>;
+  <a data-link-type="idl-name" href="https://www.w3.org/TR/mediastream-recording/#bitratemode" id="ref-for-bitratemode"><c- n>BitrateMode</c-></a> <a class="idl-code" data-default="&quot;variable&quot;" data-link-type="dict-member" data-type="BitrateMode " href="#dom-videoencoderconfig-bitratemode" id="ref-for-dom-videoencoderconfig-bitratemode"><c- g>bitrateMode</c-></a> = "variable";
 };
 </pre>
    <p class="note" role="note"><span>NOTE:</span> Codec-specific extensions to <code class="idl"><a data-link-type="idl" href="#dictdef-videoencoderconfig" id="ref-for-dictdef-videoencoderconfig⑦">VideoEncoderConfig</a></code> may be defined by the
@@ -2365,12 +2424,12 @@ <h3 class="heading settled" data-level="7.8" id="video-encoder-config"><span cla
     <dd>
       The encoded width of output <code class="idl"><a data-link-type="idl" href="#encodedvideochunk" id="ref-for-encodedvideochunk①⓪">EncodedVideoChunk</a></code>s in pixels, prior to any
     display aspect ratio adjustments. 
-     <p>The encoder must scale any <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe⑦">VideoFrame</a></code> whose <code class="idl"><a data-link-type="idl" href="#dom-videoframe-crop-width-slot" id="ref-for-dom-videoframe-crop-width-slot">[[crop width]]</a></code> differs from this value.</p>
+     <p>The encoder must scale any <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe⑦">VideoFrame</a></code> whose <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-width-slot" id="ref-for-dom-videoframe-visible-width-slot">[[visible width]]</a></code> differs from this value.</p>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoEncoderConfig" data-dfn-type="dict-member" data-export id="dom-videoencoderconfig-height"><code>height</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long②③">unsigned long</a></span>
     <dd>
       The encoded height of output <code class="idl"><a data-link-type="idl" href="#encodedvideochunk" id="ref-for-encodedvideochunk①①">EncodedVideoChunk</a></code>s in pixels, prior to any
     display aspect ratio adjustments. 
-     <p>The encoder must scale any <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe⑧">VideoFrame</a></code> whose <code class="idl"><a data-link-type="idl" href="#dom-videoframe-crop-height-slot" id="ref-for-dom-videoframe-crop-height-slot">[[crop height]]</a></code> differs from this value.</p>
+     <p>The encoder must scale any <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe⑧">VideoFrame</a></code> whose <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-height-slot" id="ref-for-dom-videoframe-visible-height-slot">[[visible height]]</a></code> differs from this value.</p>
    </dl>
    <dl>
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoEncoderConfig" data-dfn-type="dict-member" data-export id="dom-videoencoderconfig-displaywidth"><code>displayWidth</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long②④">unsigned long</a></span>
@@ -2392,6 +2451,11 @@ <h3 class="heading settled" data-level="7.8" id="video-encoder-config"><span cla
     <dd> Configures hardware acceleration for this codec. See <code class="idl"><a data-link-type="idl" href="#enumdef-hardwareacceleration" id="ref-for-enumdef-hardwareacceleration⑤">HardwareAcceleration</a></code>. 
     <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoEncoderConfig" data-dfn-type="dict-member" data-export id="dom-videoencoderconfig-scalabilitymode"><code>scalabilityMode</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString⑨">DOMString</a></span>
     <dd> An encoding <a data-link-type="dfn" href="https://w3c.github.io/webrtc-svc/#scalabilitymodes*" id="ref-for-scalabilitymodes*">scalability mode identifier</a> as defined by <a data-link-type="biblio" href="#biblio-webrtc-svc">[WebRTC-SVC]</a>. 
+    <dt><dfn class="dfn-paneled idl-code" data-dfn-for="VideoEncoderConfig" data-dfn-type="dict-member" data-export id="dom-videoencoderconfig-bitratemode"><code>bitrateMode</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://www.w3.org/TR/mediastream-recording/#bitratemode" id="ref-for-bitratemode①">BitrateMode</a>, defaulting to <code>"variable"</code></span>
+    <dd>
+      Configures encoding to use a <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/mediastream-recording/#dom-bitratemode-constant" id="ref-for-dom-bitratemode-constant">constant</a></code> or <code class="idl"><a data-link-type="idl" href="https://www.w3.org/TR/mediastream-recording/#dom-bitratemode-variable" id="ref-for-dom-bitratemode-variable">variable</a></code> bitrate as defined by <a data-link-type="biblio" href="#biblio-mediastream-recording">[MEDIASTREAM-RECORDING]</a>. 
+     <p class="note" role="note"><span>NOTE:</span> The precise degree of bitrate fluctuation in either mode is
+        implementation defined.</p>
    </dl>
    <h3 class="heading settled" data-level="7.9" id="hardware-acceleration"><span class="secno">7.9. </span><span class="content">Hardware Acceleration</span><a class="self-link" href="#hardware-acceleration"></a></h3>
 <pre class="idl highlight def"><c- b>enum</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="enum" data-export id="enumdef-hardwareacceleration"><code><c- g>HardwareAcceleration</c-></code></dfn> {
@@ -2486,7 +2550,7 @@ <h3 class="heading settled" data-level="7.12" id="codec-state"><span class="secn
         been released. 
    </dl>
    <h3 class="heading settled" data-level="7.13" id="error-callback"><span class="secno">7.13. </span><span class="content">WebCodecsErrorCallback</span><a class="self-link" href="#error-callback"></a></h3>
-<pre class="idl highlight def"><c- b>callback</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="callback" data-export id="callbackdef-webcodecserrorcallback"><code><c- g>WebCodecsErrorCallback</c-></code></dfn> = <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined②④"><c- b>undefined</c-></a>(<a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException④"><c- n>DOMException</c-></a> <dfn class="idl-code" data-dfn-for="WebCodecsErrorCallback" data-dfn-type="argument" data-export id="dom-webcodecserrorcallback-error"><code><c- g>error</c-></code><a class="self-link" href="#dom-webcodecserrorcallback-error"></a></dfn>);
+<pre class="idl highlight def"><c- b>callback</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="callback" data-export id="callbackdef-webcodecserrorcallback"><code><c- g>WebCodecsErrorCallback</c-></code></dfn> = <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined②④"><c- b>undefined</c-></a>(<a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①⑥"><c- n>DOMException</c-></a> <dfn class="idl-code" data-dfn-for="WebCodecsErrorCallback" data-dfn-type="argument" data-export id="dom-webcodecserrorcallback-error"><code><c- g>error</c-></code><a class="self-link" href="#dom-webcodecserrorcallback-error"></a></dfn>);
 </pre>
    <h2 class="heading settled" data-level="8" id="encoded-media-interfaces"><span class="secno">8. </span><span class="content">Encoded Media Interfaces (Chunks)</span><a class="self-link" href="#encoded-media-interfaces"></a></h2>
     These interfaces represent chunks of encoded media. 
@@ -2828,7 +2892,7 @@ <h4 class="heading settled" data-level="9.2.4" id="audiodata-methods"><span clas
      <p>When invoked, run these steps:</p>
      <ol>
       <li data-md>
-       <p>If the value of <var>frame</var>’s <code class="idl"><a data-link-type="idl" href="#dom-audiodata-detached-slot" id="ref-for-dom-audiodata-detached-slot③">[[detached]]</a></code> internal slot is <code>true</code>, throw an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror①⑥">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException⑤">DOMException</a></code>.</p>
+       <p>If the value of <var>frame</var>’s <code class="idl"><a data-link-type="idl" href="#dom-audiodata-detached-slot" id="ref-for-dom-audiodata-detached-slot③">[[detached]]</a></code> internal slot is <code>true</code>, throw an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror①⑥">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①⑦">DOMException</a></code>.</p>
       <li data-md>
        <p>Let <var>copyElementCount</var> be the result of running the <a data-link-type="dfn" href="#compute-copy-element-count" id="ref-for-compute-copy-element-count①">Compute Copy Element Count</a> algorithm with <var>options</var>.</p>
       <li data-md>
@@ -2850,7 +2914,7 @@ <h4 class="heading settled" data-level="9.2.4" id="audiodata-methods"><span clas
      <p>When invoked, run these steps:</p>
      <ol>
       <li data-md>
-       <p>If the value of <var>frame</var>’s <code class="idl"><a data-link-type="idl" href="#dom-audiodata-detached-slot" id="ref-for-dom-audiodata-detached-slot④">[[detached]]</a></code> internal slot is <code>true</code>, throw an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror①⑦">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException⑥">DOMException</a></code>.</p>
+       <p>If the value of <var>frame</var>’s <code class="idl"><a data-link-type="idl" href="#dom-audiodata-detached-slot" id="ref-for-dom-audiodata-detached-slot④">[[detached]]</a></code> internal slot is <code>true</code>, throw an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror①⑦">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①⑧">DOMException</a></code>.</p>
       <li data-md>
        <p>Return the result of running the <a data-link-type="dfn" href="#clone-audiodata" id="ref-for-clone-audiodata①">Clone AudioData</a> algorithm with <a data-link-type="dfn" href="https://heycam.github.io/webidl/#this" id="ref-for-this">this</a>.</p>
      </ol>
@@ -3069,22 +3133,23 @@ <h3 class="heading settled" data-level="9.4" id="videoframe-interface"><span cla
 <pre class="idl highlight def">[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed" id="ref-for-Exposed⑦"><c- g>Exposed</c-></a>=(<c- n>Window</c->,<c- n>DedicatedWorker</c->)]
 <c- b>interface</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="interface" data-export id="videoframe"><code><c- g>VideoFrame</c-></code></dfn> {
   <a class="idl-code" data-link-type="constructor" href="#dom-videoframe-videoframe" id="ref-for-dom-videoframe-videoframe"><c- g>constructor</c-></a>(<a data-link-type="idl-name" href="https://html.spec.whatwg.org/multipage/canvas.html#canvasimagesource" id="ref-for-canvasimagesource②"><c- n>CanvasImageSource</c-></a> <dfn class="idl-code" data-dfn-for="VideoFrame/VideoFrame(image, init), VideoFrame/constructor(image, init), VideoFrame/VideoFrame(image), VideoFrame/constructor(image)" data-dfn-type="argument" data-export id="dom-videoframe-videoframe-image-init-image"><code><c- g>image</c-></code><a class="self-link" href="#dom-videoframe-videoframe-image-init-image"></a></dfn>, <c- b>optional</c-> <a data-link-type="idl-name" href="#dictdef-videoframeinit" id="ref-for-dictdef-videoframeinit"><c- n>VideoFrameInit</c-></a> <dfn class="idl-code" data-dfn-for="VideoFrame/VideoFrame(image, init), VideoFrame/constructor(image, init), VideoFrame/VideoFrame(image), VideoFrame/constructor(image)" data-dfn-type="argument" data-export id="dom-videoframe-videoframe-image-init-init"><code><c- g>init</c-></code><a class="self-link" href="#dom-videoframe-videoframe-image-init-init"></a></dfn> = {});
-  <a class="idl-code" data-link-type="constructor" href="#dom-videoframe-videoframe-planes-init" id="ref-for-dom-videoframe-videoframe-planes-init"><c- g>constructor</c-></a>(<a data-link-type="dfn" href="https://heycam.github.io/webidl/#idl-sequence" id="ref-for-idl-sequence"><c- b>sequence</c-></a>&lt;(<a data-link-type="idl-name" href="#plane" id="ref-for-plane"><c- n>Plane</c-></a> <c- b>or</c-> <a data-link-type="idl-name" href="#dictdef-planeinit" id="ref-for-dictdef-planeinit"><c- n>PlaneInit</c-></a>)> <dfn class="idl-code" data-dfn-for="VideoFrame/VideoFrame(planes, init), VideoFrame/constructor(planes, init)" data-dfn-type="argument" data-export id="dom-videoframe-videoframe-planes-init-planes"><code><c- g>planes</c-></code><a class="self-link" href="#dom-videoframe-videoframe-planes-init-planes"></a></dfn>,
+  <a class="idl-code" data-link-type="constructor" href="#dom-videoframe-videoframe-planes-init" id="ref-for-dom-videoframe-videoframe-planes-init"><c- g>constructor</c-></a>(<a data-link-type="dfn" href="https://heycam.github.io/webidl/#idl-sequence" id="ref-for-idl-sequence"><c- b>sequence</c-></a>&lt;<a data-link-type="idl-name" href="#dictdef-planeinit" id="ref-for-dictdef-planeinit"><c- n>PlaneInit</c-></a>> <dfn class="idl-code" data-dfn-for="VideoFrame/VideoFrame(planes, init), VideoFrame/constructor(planes, init)" data-dfn-type="argument" data-export id="dom-videoframe-videoframe-planes-init-planes"><code><c- g>planes</c-></code><a class="self-link" href="#dom-videoframe-videoframe-planes-init-planes"></a></dfn>,
               <a data-link-type="idl-name" href="#dictdef-videoframeplaneinit" id="ref-for-dictdef-videoframeplaneinit"><c- n>VideoFramePlaneInit</c-></a> <dfn class="idl-code" data-dfn-for="VideoFrame/VideoFrame(planes, init), VideoFrame/constructor(planes, init)" data-dfn-type="argument" data-export id="dom-videoframe-videoframe-planes-init-init"><code><c- g>init</c-></code><a class="self-link" href="#dom-videoframe-videoframe-planes-init-init"></a></dfn>);
 
   <c- b>readonly</c-> <c- b>attribute</c-> <a data-link-type="idl-name" href="#enumdef-pixelformat" id="ref-for-enumdef-pixelformat"><c- n>PixelFormat</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="PixelFormat" href="#dom-videoframe-format" id="ref-for-dom-videoframe-format"><c- g>format</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-frozen-array" id="ref-for-idl-frozen-array"><c- b>FrozenArray</c-></a>&lt;<a data-link-type="idl-name" href="#plane" id="ref-for-plane①"><c- n>Plane</c-></a>>? <a class="idl-code" data-link-type="attribute" data-readonly data-type="FrozenArray<Plane>?" href="#dom-videoframe-planes" id="ref-for-dom-videoframe-planes"><c- g>planes</c-></a>;
   <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long④⑤"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-codedwidth" id="ref-for-dom-videoframe-codedwidth"><c- g>codedWidth</c-></a>;
   <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long④⑥"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-codedheight" id="ref-for-dom-videoframe-codedheight"><c- g>codedHeight</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long④⑦"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-cropleft" id="ref-for-dom-videoframe-cropleft"><c- g>cropLeft</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long④⑧"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-croptop" id="ref-for-dom-videoframe-croptop"><c- g>cropTop</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long④⑨"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-cropwidth" id="ref-for-dom-videoframe-cropwidth"><c- g>cropWidth</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤⓪"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-cropheight" id="ref-for-dom-videoframe-cropheight"><c- g>cropHeight</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤①"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-displaywidth" id="ref-for-dom-videoframe-displaywidth①"><c- g>displayWidth</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤②"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-displayheight" id="ref-for-dom-videoframe-displayheight①"><c- g>displayHeight</c-></a>;
+  <c- b>readonly</c-> <c- b>attribute</c-> <a data-link-type="idl-name" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect"><c- n>VideoFrameRect</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="VideoFrameRect" href="#dom-videoframe-codedrect" id="ref-for-dom-videoframe-codedrect"><c- g>codedRect</c-></a>;
+  <c- b>readonly</c-> <c- b>attribute</c-> <a data-link-type="idl-name" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect①"><c- n>VideoFrameRect</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="VideoFrameRect" href="#dom-videoframe-visiblerect" id="ref-for-dom-videoframe-visiblerect"><c- g>visibleRect</c-></a>;
+  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long④⑦"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-displaywidth" id="ref-for-dom-videoframe-displaywidth①"><c- g>displayWidth</c-></a>;
+  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long④⑧"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-displayheight" id="ref-for-dom-videoframe-displayheight①"><c- g>displayHeight</c-></a>;
   <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long-long" id="ref-for-idl-unsigned-long-long⑨"><c- b>unsigned</c-> <c- b>long</c-> <c- b>long</c-></a>? <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long long?" href="#dom-videoframe-duration" id="ref-for-dom-videoframe-duration"><c- g>duration</c-></a>;  // microseconds
   <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-long-long" id="ref-for-idl-long-long⑨"><c- b>long</c-> <c- b>long</c-></a>? <a class="idl-code" data-link-type="attribute" data-readonly data-type="long long?" href="#dom-videoframe-timestamp" id="ref-for-dom-videoframe-timestamp"><c- g>timestamp</c-></a>;          // microseconds
-
+  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long④⑨"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="method" href="#dom-videoframe-allocationsize" id="ref-for-dom-videoframe-allocationsize"><c- g>allocationSize</c-></a>(
+      <c- b>optional</c-> <a data-link-type="idl-name" href="#dictdef-videoframecopytooptions" id="ref-for-dictdef-videoframecopytooptions"><c- n>VideoFrameCopyToOptions</c-></a> <dfn class="idl-code" data-dfn-for="VideoFrame/allocationSize(options), VideoFrame/allocationSize()" data-dfn-type="argument" data-export id="dom-videoframe-allocationsize-options-options"><code><c- g>options</c-></code><a class="self-link" href="#dom-videoframe-allocationsize-options-options"></a></dfn> = {});
+  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise⑧"><c- b>Promise</c-></a>&lt;<a data-link-type="dfn" href="https://heycam.github.io/webidl/#idl-sequence" id="ref-for-idl-sequence①"><c- b>sequence</c-></a>&lt;<a data-link-type="idl-name" href="#dictdef-planelayout" id="ref-for-dictdef-planelayout"><c- n>PlaneLayout</c-></a>>> <a class="idl-code" data-link-type="method" href="#dom-videoframe-copyto" id="ref-for-dom-videoframe-copyto"><c- g>copyTo</c-></a>(
+      [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#AllowShared" id="ref-for-AllowShared③"><c- g>AllowShared</c-></a>] <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource①⓪"><c- n>BufferSource</c-></a> <dfn class="idl-code" data-dfn-for="VideoFrame/copyTo(destination, options), VideoFrame/copyTo(destination)" data-dfn-type="argument" data-export id="dom-videoframe-copyto-destination-options-destination"><code><c- g>destination</c-></code><a class="self-link" href="#dom-videoframe-copyto-destination-options-destination"></a></dfn>,
+      <c- b>optional</c-> <a data-link-type="idl-name" href="#dictdef-videoframecopytooptions" id="ref-for-dictdef-videoframecopytooptions①"><c- n>VideoFrameCopyToOptions</c-></a> <dfn class="idl-code" data-dfn-for="VideoFrame/copyTo(destination, options), VideoFrame/copyTo(destination)" data-dfn-type="argument" data-export id="dom-videoframe-copyto-destination-options-options"><code><c- g>options</c-></code><a class="self-link" href="#dom-videoframe-copyto-destination-options-options"></a></dfn> = {});
   <a data-link-type="idl-name" href="#videoframe" id="ref-for-videoframe①⑤"><c- n>VideoFrame</c-></a> <a class="idl-code" data-link-type="method" href="#dom-videoframe-clone" id="ref-for-dom-videoframe-clone①"><c- g>clone</c-></a>();
   <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined②⑨"><c- b>undefined</c-></a> <a class="idl-code" data-link-type="method" href="#dom-videoframe-close" id="ref-for-dom-videoframe-close②"><c- g>close</c-></a>();
 };
@@ -3096,16 +3161,19 @@ <h3 class="heading settled" data-level="9.4" id="videoframe-interface"><span cla
 
 <c- b>dictionary</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="dictionary" data-export id="dictdef-videoframeplaneinit"><code><c- g>VideoFramePlaneInit</c-></code></dfn> {
   <c- b>required</c-> <a data-link-type="idl-name" href="#enumdef-pixelformat" id="ref-for-enumdef-pixelformat①"><c- n>PixelFormat</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="PixelFormat " id="dom-videoframeplaneinit-format"><code><c- g>format</c-></code></dfn>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②①"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤③"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-videoframeplaneinit-codedwidth"><code><c- g>codedWidth</c-></code></dfn>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②②"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤④"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-videoframeplaneinit-codedheight"><code><c- g>codedHeight</c-></code></dfn>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②③"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤⑤"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-videoframeplaneinit-cropleft"><code><c- g>cropLeft</c-></code></dfn>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②④"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤⑥"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-videoframeplaneinit-croptop"><code><c- g>cropTop</c-></code></dfn>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②⑤"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤⑦"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-videoframeplaneinit-cropwidth"><code><c- g>cropWidth</c-></code></dfn>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②⑥"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤⑧"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-videoframeplaneinit-cropheight"><code><c- g>cropHeight</c-></code></dfn>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②⑦"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤⑨"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-videoframeplaneinit-displaywidth"><code><c- g>displayWidth</c-></code></dfn>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②⑧"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥⓪"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-videoframeplaneinit-displayheight"><code><c- g>displayHeight</c-></code></dfn>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②⑨"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long-long" id="ref-for-idl-unsigned-long-long①①"><c- b>unsigned</c-> <c- b>long</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long long " id="dom-videoframeplaneinit-duration"><code><c- g>duration</c-></code></dfn>;  // microseconds
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③⓪"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-long-long" id="ref-for-idl-long-long①①"><c- b>long</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="long long " id="dom-videoframeplaneinit-timestamp"><code><c- g>timestamp</c-></code></dfn>;          // microseconds
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②①"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤⓪"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-videoframeplaneinit-codedwidth"><code><c- g>codedWidth</c-></code></dfn>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②②"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤①"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-videoframeplaneinit-codedheight"><code><c- g>codedHeight</c-></code></dfn>;
+  <a data-link-type="idl-name" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect②"><c- n>VideoFrameRect</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="VideoFrameRect " id="dom-videoframeplaneinit-visiblerect"><code><c- g>visibleRect</c-></code></dfn>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②③"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤②"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-videoframeplaneinit-displaywidth"><code><c- g>displayWidth</c-></code></dfn>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②④"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤③"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-videoframeplaneinit-displayheight"><code><c- g>displayHeight</c-></code></dfn>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②⑤"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long-long" id="ref-for-idl-unsigned-long-long①①"><c- b>unsigned</c-> <c- b>long</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long long " id="dom-videoframeplaneinit-duration"><code><c- g>duration</c-></code></dfn>;  // microseconds
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②⑥"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-long-long" id="ref-for-idl-long-long①①"><c- b>long</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="VideoFramePlaneInit" data-dfn-type="dict-member" data-export data-type="long long " id="dom-videoframeplaneinit-timestamp"><code><c- g>timestamp</c-></code></dfn>;          // microseconds
+};
+
+<c- b>dictionary</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="dictionary" data-export id="dictdef-planeinit"><code><c- g>PlaneInit</c-></code></dfn> {
+  <c- b>required</c-> <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource①①"><c- n>BufferSource</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="PlaneInit" data-dfn-type="dict-member" data-export data-type="BufferSource " id="dom-planeinit-data"><code><c- g>data</c-></code></dfn>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②⑦"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤④"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="PlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-planeinit-stride"><code><c- g>stride</c-></code></dfn>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②⑧"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤⑤"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-default="0" data-dfn-for="PlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-planeinit-offset"><code><c- g>offset</c-></code></dfn> = 0;
 };
 </pre>
    <h4 class="heading settled" data-level="9.4.1" id="videoframe-internal-slots"><span class="secno">9.4.1. </span><span class="content">Internal Slots</span><a class="self-link" href="#videoframe-internal-slots"></a></h4>
@@ -3121,59 +3189,53 @@ <h4 class="heading settled" data-level="9.4.1" id="videoframe-internal-slots"><s
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-format-slot"><code>[[format]]</code></dfn>
     <dd data-md>
      <p>A <code class="idl"><a data-link-type="idl" href="#enumdef-pixelformat" id="ref-for-enumdef-pixelformat②">PixelFormat</a></code> describing the pixel format of the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe①⑥">VideoFrame</a></code>.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-planes-slot"><code>[[planes]]</code></dfn>
-    <dd data-md>
-     <p>A list of <code class="idl"><a data-link-type="idl" href="#plane" id="ref-for-plane②">Plane</a></code>s describing the memory layout of the pixel data in <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe①⑦">VideoFrame</a></code>. The number of <code class="idl"><a data-link-type="idl" href="#plane" id="ref-for-plane③">Plane</a></code>s and their semantics are
-determined by <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot">[[format]]</a></code>.</p>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-coded-width-slot"><code>[[coded width]]</code></dfn>
     <dd data-md>
-     <p>Width of the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe①⑧">VideoFrame</a></code> in pixels, prior to any cropping or aspect
-ratio adjustments.</p>
+     <p>Width of the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe①⑦">VideoFrame</a></code> in pixels, potentionally including non-visible
+padding, and prior to considering potential ratio adjustments.</p>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-coded-height-slot"><code>[[coded height]]</code></dfn>
     <dd data-md>
-     <p>Height of the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe①⑨">VideoFrame</a></code> in pixels, prior to any cropping or aspect
-ratio adjustments.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-crop-left-slot"><code>[[crop left]]</code></dfn>
+     <p>Height of the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe①⑧">VideoFrame</a></code> in pixels, potentionally including non-visible
+padding, and prior to considering potential ratio adjustments.</p>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-visible-left-slot"><code>[[visible left]]</code></dfn>
     <dd data-md>
-     <p>The number of pixels to remove from the left of the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②⓪">VideoFrame</a></code>,
-prior to aspect ratio adjustments.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-crop-top-slot"><code>[[crop top]]</code></dfn>
+     <p>The number of pixels defining the left offset of the visible rectangle.</p>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-visible-top-slot"><code>[[visible top]]</code></dfn>
     <dd data-md>
-     <p>The number of pixels to remove from the top of the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②①">VideoFrame</a></code>,
-prior to aspect ratio adjustments.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-crop-width-slot"><code>[[crop width]]</code></dfn>
+     <p>The number of pixels defining the top offset of the visible rectangle.</p>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-visible-width-slot"><code>[[visible width]]</code></dfn>
     <dd data-md>
-     <p>The width of pixels to include in the crop, starting from cropLeft.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-crop-height-slot"><code>[[crop height]]</code></dfn>
+     <p>The width of pixels to include in visible rectangle, starting from <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-left-slot" id="ref-for-dom-videoframe-visible-left-slot">[[visible left]]</a></code>.</p>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-visible-height-slot"><code>[[visible height]]</code></dfn>
     <dd data-md>
-     <p>The height of pixels to include in the crop, starting from cropLeft.</p>
+     <p>The height of pixels to include in visible rectangle, starting from <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-top-slot" id="ref-for-dom-videoframe-visible-top-slot">[[visible top]]</a></code>.</p>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-display-width-slot"><code>[[display width]]</code></dfn>
     <dd data-md>
-     <p>Width of the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②②">VideoFrame</a></code> when displayed after applying aspect ratio
+     <p>Width of the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe①⑨">VideoFrame</a></code> when displayed after applying aspect ratio
 adjustments.</p>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-display-height-slot"><code>[[display height]]</code></dfn>
     <dd data-md>
-     <p>Height of the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②③">VideoFrame</a></code> when displayed after applying aspect ratio
+     <p>Height of the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②⓪">VideoFrame</a></code> when displayed after applying aspect ratio
 adjustments.</p>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-duration-slot"><code>[[duration]]</code></dfn>
     <dd data-md>
      <p>The presentation duration, given in microseconds. The duration is copied
-    from the <code class="idl"><a data-link-type="idl" href="#encodedvideochunk" id="ref-for-encodedvideochunk①⑥">EncodedVideoChunk</a></code> corresponding to this <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②④">VideoFrame</a></code>.</p>
+    from the <code class="idl"><a data-link-type="idl" href="#encodedvideochunk" id="ref-for-encodedvideochunk①⑥">EncodedVideoChunk</a></code> corresponding to this <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②①">VideoFrame</a></code>.</p>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-timestamp-slot"><code>[[timestamp]]</code></dfn>
     <dd data-md>
      <p>The presentation timestamp, given in microseconds. The timestamp is copied
-from the <code class="idl"><a data-link-type="idl" href="#encodedvideochunk" id="ref-for-encodedvideochunk①⑦">EncodedVideoChunk</a></code> corresponding to this <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②⑤">VideoFrame</a></code>.</p>
+from the <code class="idl"><a data-link-type="idl" href="#encodedvideochunk" id="ref-for-encodedvideochunk①⑦">EncodedVideoChunk</a></code> corresponding to this <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②②">VideoFrame</a></code>.</p>
    </dl>
    <h4 class="heading settled" data-level="9.4.2" id="videoframe-constructors"><span class="secno">9.4.2. </span><span class="content">Constructors</span><a class="self-link" href="#videoframe-constructors"></a></h4>
    <p><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="constructor" data-export data-lt="VideoFrame(image, init)|constructor(image, init)|VideoFrame(image)|constructor(image)" id="dom-videoframe-videoframe" title="VideoFrame(image, init)"><code> VideoFrame(image, init) </code></dfn></p>
    <ol>
     <li data-md>
      <p><a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/canvas.html#check-the-usability-of-the-image-argument" id="ref-for-check-the-usability-of-the-image-argument">Check the usability of the image argument</a>. If this throws an
-exception or returns <var>bad</var>, then throw an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror①⑧">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException⑦">DOMException</a></code>.</p>
+exception or returns <var>bad</var>, then throw an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror①⑧">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①⑨">DOMException</a></code>.</p>
     <li data-md>
-     <p>If the <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin" id="ref-for-concept-origin">origin</a> of <var>image</var>’s image data is not <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#same-origin" id="ref-for-same-origin">same origin</a> with the <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#entry-settings-object" id="ref-for-entry-settings-object">entry settings object</a>'s <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin" id="ref-for-concept-origin①">origin</a>, then throw a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#securityerror" id="ref-for-securityerror">SecurityError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException⑧">DOMException</a></code>.</p>
+     <p>If the <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin" id="ref-for-concept-origin">origin</a> of <var>image</var>’s image data is not <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#same-origin" id="ref-for-same-origin">same origin</a> with the <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/webappapis.html#entry-settings-object" id="ref-for-entry-settings-object">entry settings object</a>'s <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/origin.html#concept-origin" id="ref-for-concept-origin①">origin</a>, then throw a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#securityerror" id="ref-for-securityerror">SecurityError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException②⓪">DOMException</a></code>.</p>
     <li data-md>
-     <p>Let <var>frame</var> be a new <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②⑥">VideoFrame</a></code>.</p>
+     <p>Let <var>frame</var> be a new <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②③">VideoFrame</a></code>.</p>
     <li data-md>
      <p>Switch on <var>image</var>:</p>
      <ul>
@@ -3186,7 +3248,7 @@ <h4 class="heading settled" data-level="9.4.2" id="videoframe-constructors"><spa
          <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframeinit-timestamp" id="ref-for-dom-videoframeinit-timestamp">timestamp</a></code> does not <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists③">exist</a> in <var>init</var>, throw a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror①②">TypeError</a></code>.</p>
         <li data-md>
          <p>If <var>image</var>’s media data has no <a data-link-type="dfn" href="https://www.w3.org/TR/css-images-3/#natural-dimensions" id="ref-for-natural-dimensions">natural dimensions</a> (e.g., it’s a vector graphic with no specified content size), then
-throw an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror①⑨">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException⑨">DOMException</a></code>.</p>
+throw an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror①⑨">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException②①">DOMException</a></code>.</p>
         <li data-md>
          <p>Let <var>resource</var> be a new <a data-link-type="dfn" href="#media-resource" id="ref-for-media-resource①⑤">media resource</a> containing a copy of <var>image</var>’s media data. If this is an animated image, <var>image</var>’s <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/imagebitmap-and-animations.html#concept-imagebitmap-bitmap-data" id="ref-for-concept-imagebitmap-bitmap-data">bitmap data</a> must only be taken from the default image of the
 animation (the one that the format defines is to be used when
@@ -3201,9 +3263,9 @@ <h4 class="heading settled" data-level="9.4.2" id="videoframe-constructors"><spa
        <p><code class="idl"><a data-link-type="idl" href="https://html.spec.whatwg.org/multipage/media.html#htmlvideoelement" id="ref-for-htmlvideoelement">HTMLVideoElement</a></code></p>
        <ol>
         <li data-md>
-         <p>If <var>image</var>’s <code class="idl"><a data-link-type="idl" href="https://html.spec.whatwg.org/multipage/media.html#dom-media-networkstate" id="ref-for-dom-media-networkstate">networkState</a></code> attribute is <code class="idl"><a data-link-type="idl" href="https://html.spec.whatwg.org/multipage/media.html#dom-media-network_empty" id="ref-for-dom-media-network_empty">NETWORK_EMPTY</a></code>, then throw an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror②⓪">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①⓪">DOMException</a></code>.</p>
+         <p>If <var>image</var>’s <code class="idl"><a data-link-type="idl" href="https://html.spec.whatwg.org/multipage/media.html#dom-media-networkstate" id="ref-for-dom-media-networkstate">networkState</a></code> attribute is <code class="idl"><a data-link-type="idl" href="https://html.spec.whatwg.org/multipage/media.html#dom-media-network_empty" id="ref-for-dom-media-network_empty">NETWORK_EMPTY</a></code>, then throw an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror②⓪">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException②②">DOMException</a></code>.</p>
         <li data-md>
-         <p>Let <var>currentPlaybackFrame</var> be the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②⑦">VideoFrame</a></code> at the <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/media.html#current-playback-position" id="ref-for-current-playback-position">current
+         <p>Let <var>currentPlaybackFrame</var> be the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②④">VideoFrame</a></code> at the <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/media.html#current-playback-position" id="ref-for-current-playback-position">current
 playback position</a>.</p>
         <li data-md>
          <p>Run the <a data-link-type="dfn" href="#videoframe-initialize-frame-from-other-frame" id="ref-for-videoframe-initialize-frame-from-other-frame">Initialize Frame From Other Frame</a> algorithm
@@ -3228,7 +3290,7 @@ <h4 class="heading settled" data-level="9.4.2" id="videoframe-constructors"><spa
          <p>Run the <a data-link-type="dfn" href="#videoframe-initialize-frame-with-resource-and-size" id="ref-for-videoframe-initialize-frame-with-resource-and-size①">Initialize Frame With Resource and Size</a> algorithm with <var>init</var>, <var>frame</var>, <var>resource</var>, <var>width</var>, and <var>height</var>.</p>
        </ol>
       <li data-md>
-       <p><code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②⑧">VideoFrame</a></code></p>
+       <p><code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②⑤">VideoFrame</a></code></p>
        <ol>
         <li data-md>
          <p>Run the <a data-link-type="dfn" href="#videoframe-initialize-frame-from-other-frame" id="ref-for-videoframe-initialize-frame-from-other-frame①">Initialize Frame From Other Frame</a> algorithm
@@ -3245,75 +3307,83 @@ <h4 class="heading settled" data-level="9.4.2" id="videoframe-constructors"><spa
     <li data-md>
      <p>If <var>planes</var> is incompatible with the given <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-format" id="ref-for-dom-videoframeplaneinit-format">format</a></code> (e.g. wrong number of planes), throw a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror①⑤">TypeError</a></code>.</p>
      <p class="issue" id="issue-6bd004c9"><a class="self-link" href="#issue-6bd004c9"></a> The spec should list additional format specific validation steps (
-    e.g. number and order of planes, acceptable sizing, etc...).  See <a href="https://github.com/w3c/webcodecs/issues/165">#165</a>.</p>
+    e.g. number and order of planes, acceptable sizing, etc...). See <a href="https://github.com/w3c/webcodecs/issues/165">#165</a>.</p>
     <li data-md>
      <p>Let <var>resource</var> be a new <a data-link-type="dfn" href="#media-resource" id="ref-for-media-resource①⑦">media resource</a> allocated in accordance with <var>init</var>.</p>
      <p class="issue" id="issue-ed2f363d"><a class="self-link" href="#issue-ed2f363d"></a> The spec should define explicit rules for each <code class="idl"><a data-link-type="idl" href="#enumdef-pixelformat" id="ref-for-enumdef-pixelformat③">PixelFormat</a></code> and reference them in the steps above. See <a href="https://github.com/w3c/webcodecs/issues/165">#165</a>.</p>
      <p class="note" role="note"><span>NOTE:</span> The user agent may choose to allocate resource with a larger coded
   size and plane strides to improve memory alignment. Increases will be
-  reflected by <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedwidth" id="ref-for-dom-videoframe-codedwidth①">codedWidth</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedheight" id="ref-for-dom-videoframe-codedheight①">codedHeight</a></code>, and <code class="idl"><a data-link-type="idl" href="#dom-plane-stride" id="ref-for-dom-plane-stride">stride</a></code>.</p>
+  reflected by <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedwidth" id="ref-for-dom-videoframe-codedwidth①">codedWidth</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedheight" id="ref-for-dom-videoframe-codedheight①">codedHeight</a></code>.</p>
     <li data-md>
      <p>Let <var>resourceReference</var> be a reference to <var>resource</var>.</p>
     <li data-md>
-     <p>Let <var>frame</var> be a new <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②⑨">VideoFrame</a></code> object initialized as follows:</p>
+     <p>Let <var>frame</var> be a new <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②⑥">VideoFrame</a></code> object initialized as follows:</p>
      <ol>
       <li data-md>
        <p>Assign <var>resourceReference</var> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-resource-reference-slot" id="ref-for-dom-videoframe-resource-reference-slot①">[[resource reference]]</a></code>.</p>
       <li data-md>
-       <p>Assign <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-format" id="ref-for-dom-videoframeplaneinit-format①">format</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot①">[[format]]</a></code>.</p>
-      <li data-md>
-       <p>Assign a new <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#lists" id="ref-for-lists⑧">list</a> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-planes-slot" id="ref-for-dom-videoframe-planes-slot">[[planes]]</a></code>.</p>
+       <p>Assign <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-format" id="ref-for-dom-videoframeplaneinit-format①">format</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot">[[format]]</a></code>.</p>
       <li data-md>
        <p>For each <var>planeInit</var> in <var>planes</var>:</p>
        <ol>
         <li data-md>
-         <p>Copy <var>planeInit</var>.<code class="idl"><a data-link-type="idl" href="#dom-planeinit-src" id="ref-for-dom-planeinit-src">src</a></code> to <var>resource</var>.</p>
-         <p class="note" role="note"><span>NOTE:</span> The user agent may use <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-cropleft" id="ref-for-dom-videoframeplaneinit-cropleft">cropLeft</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-croptop" id="ref-for-dom-videoframeplaneinit-croptop">cropTop</a></code> to copy only the crop
-    region. It may also reposition the crop region within <var>resource</var>. The final position will be reflected by <code class="idl"><a data-link-type="idl" href="#dom-videoframe-cropleft" id="ref-for-dom-videoframe-cropleft①">cropLeft</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-croptop" id="ref-for-dom-videoframe-croptop①">cropTop</a></code>.</p>
+         <p>Let <var>rows</var> be the number of sample rows for the Plane coresponding
+to <var>planeInit</var> as defined by <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot①">[[format]]</a></code>.</p>
         <li data-md>
-         <p>Let <var>plane</var> be a new <code class="idl"><a data-link-type="idl" href="#plane" id="ref-for-plane④">Plane</a></code> initialized as follows:</p>
+         <p>Let <var>dataOffset</var> be <code>0</code>.</p>
+        <li data-md>
+         <p>If <code class="idl"><a data-link-type="idl" href="#dom-planeinit-offset" id="ref-for-dom-planeinit-offset">offset</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists⑤">exists</a>, assign <code class="idl"><a data-link-type="idl" href="#dom-planeinit-offset" id="ref-for-dom-planeinit-offset①">offset</a></code> to <var>dataOffset</var>.</p>
+        <li data-md>
+         <p>Let <var>row</var> be <code>0</code>.</p>
+        <li data-md>
+         <p>While <var>row</var> is less than <var>rows</var>:</p>
          <ol>
           <li data-md>
-           <p>Assign <var>frame</var> to <code class="idl"><a data-link-type="idl" href="#dom-plane-parent-frame-slot" id="ref-for-dom-plane-parent-frame-slot">[[parent frame]]</a></code>.</p>
-          <li data-md>
-           <p>Let <var>resourceStride</var> be the stride of the plane corresponding to <var>planeInit</var> in <var>resource</var>.</p>
-           <p class="issue" id="issue-e9094ad1"><a class="self-link" href="#issue-e9094ad1"></a> The spec should provide a definition (and possibly
-    diagrams) for stride. See <a href="https://github.com/w3c/webcodecs/issues/166">#166</a>.</p>
+           <p>Copy bytes from <code class="idl"><a data-link-type="idl" href="#dom-planeinit-data" id="ref-for-dom-planeinit-data">data</a></code> to <var>resource</var>, starting with
+the byte positioned at <var>dataOffset</var> and stopping after <code class="idl"><a data-link-type="idl" href="#dom-planeinit-stride" id="ref-for-dom-planeinit-stride">stride</a></code> bytes have been copied.</p>
+           <p class="note" role="note"><span>NOTE:</span> The user agent may use <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-visiblerect" id="ref-for-dom-videoframeplaneinit-visiblerect">visibleRect</a></code> to copy only the visible rectangle. It may also reposition
+    the visible rectangle within <var>resource</var>. The final position
+    will be reflected by <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visiblerect" id="ref-for-dom-videoframe-visiblerect①">visibleRect</a></code>.</p>
           <li data-md>
-           <p>Assign <var>resourceStride</var> to <code class="idl"><a data-link-type="idl" href="#dom-plane-stride" id="ref-for-dom-plane-stride①">stride</a></code>.</p>
+           <p>Increment <var>dataOffset</var> by <code class="idl"><a data-link-type="idl" href="#dom-planeinit-stride" id="ref-for-dom-planeinit-stride①">stride</a></code>.</p>
           <li data-md>
-           <p>Assign <var>planeInit</var>.<code class="idl"><a data-link-type="idl" href="#dom-planeinit-rows" id="ref-for-dom-planeinit-rows">rows</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-plane-rows" id="ref-for-dom-plane-rows">rows</a></code>.</p>
-          <li data-md>
-           <p>Assign the product of (<code class="idl"><a data-link-type="idl" href="#dom-plane-stride" id="ref-for-dom-plane-stride②">stride</a></code> * <code class="idl"><a data-link-type="idl" href="#dom-plane-rows" id="ref-for-dom-plane-rows①">rows</a></code>) to <code class="idl"><a data-link-type="idl" href="#dom-plane-length" id="ref-for-dom-plane-length">length</a></code>.</p>
+           <p>Increment <var>row</var> by <code>1</code>.</p>
          </ol>
-        <li data-md>
-         <p>Append <var>plane</var> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-planes-slot" id="ref-for-dom-videoframe-planes-slot①">[[planes]]</a></code>.</p>
        </ol>
       <li data-md>
        <p>Let <var>resourceCodedWidth</var> be the coded width of <var>resource</var>.</p>
       <li data-md>
        <p>Let <var>resourceCodedHeight</var> be the coded height of <var>resource</var>.</p>
       <li data-md>
-       <p>Let <var>resourceCropLeft</var> be the left offset of the crop origin of <var>resource</var>.</p>
+       <p>Let <var>resourceVisibleLeft</var> be the left offset for the visible rectangle of <var>resource</var>.</p>
       <li data-md>
-       <p>Let <var>resourceCropTop</var> be the top offset of the crop origin of <var>resource</var>.</p>
-       <p class="issue" id="issue-6c7fe7de"><a class="self-link" href="#issue-6c7fe7de"></a> The spec should provide definitions (and possibly diagrams) for
-    coded size, crop size, and display size. See <a href="https://github.com/w3c/webcodecs/issues/166">#166</a>.</p>
+       <p>Let <var>resourceVisibleTop</var> be the top offset for the visible rectangle of <var>resource</var>.</p>
+       <p class="issue" id="issue-3beeea62"><a class="self-link" href="#issue-3beeea62"></a> The spec should provide definitions (and possibly diagrams) for
+    coded size, visible rectangle, and display size. See <a href="https://github.com/w3c/webcodecs/issues/166">#166</a>.</p>
       <li data-md>
-       <p>Assign <var>resourceCodedWidth</var>, <var>resourceCodedHeight</var>, <var>resourceCropLeft</var>,
-and <var>resourceCropTop</var> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-width-slot" id="ref-for-dom-videoframe-coded-width-slot">[[coded width]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-height-slot" id="ref-for-dom-videoframe-coded-height-slot">[[coded height]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-crop-left-slot" id="ref-for-dom-videoframe-crop-left-slot">[[crop left]]</a></code>, and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-crop-top-slot" id="ref-for-dom-videoframe-crop-top-slot">[[crop top]]</a></code> respectively.</p>
+       <p>Assign <var>resourceCodedWidth</var>, <var>resourceCodedHeight</var>, <var>resourceVisibleLeft</var>, and <var>resourceVisibleTop</var> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-width-slot" id="ref-for-dom-videoframe-coded-width-slot">[[coded width]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-height-slot" id="ref-for-dom-videoframe-coded-height-slot">[[coded height]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-left-slot" id="ref-for-dom-videoframe-visible-left-slot①">[[visible left]]</a></code>, and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-top-slot" id="ref-for-dom-videoframe-visible-top-slot①">[[visible top]]</a></code> respectively.</p>
       <li data-md>
-       <p>If <var>init</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-cropwidth" id="ref-for-dom-videoframeplaneinit-cropwidth">cropWidth</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists⑤">exists</a>, assign
-it to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-crop-width-slot" id="ref-for-dom-videoframe-crop-width-slot①">[[crop width]]</a></code>. Otherwise, assign <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-width-slot" id="ref-for-dom-videoframe-coded-width-slot①">[[coded width]]</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-crop-width-slot" id="ref-for-dom-videoframe-crop-width-slot②">[[crop width]]</a></code>.</p>
+       <p>If <var>init</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-visiblerect" id="ref-for-dom-videoframeplaneinit-visiblerect①">visibleRect</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists⑥">exists</a>:</p>
+       <ol>
+        <li data-md>
+         <p>Assign <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-visiblerect" id="ref-for-dom-videoframeplaneinit-visiblerect②">visibleRect</a></code>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-width" id="ref-for-dom-videoframerect-width">width</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-width-slot" id="ref-for-dom-videoframe-visible-width-slot①">[[visible width]]</a></code>.</p>
+        <li data-md>
+         <p>Assign <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-visiblerect" id="ref-for-dom-videoframeplaneinit-visiblerect③">visibleRect</a></code>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-height" id="ref-for-dom-videoframerect-height">height</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-height-slot" id="ref-for-dom-videoframe-visible-height-slot①">[[visible height]]</a></code>.</p>
+       </ol>
       <li data-md>
-       <p>If <var>init</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-cropheight" id="ref-for-dom-videoframeplaneinit-cropheight">cropHeight</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists⑥">exists</a>, assign it
-to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-crop-height-slot" id="ref-for-dom-videoframe-crop-height-slot①">[[crop height]]</a></code>. Otehrwise, assign <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-height-slot" id="ref-for-dom-videoframe-coded-height-slot①">[[coded height]]</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-crop-height-slot" id="ref-for-dom-videoframe-crop-height-slot②">[[crop height]]</a></code>.</p>
+       <p>Otherwise:</p>
+       <ol>
+        <li data-md>
+         <p>Assign <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-width-slot" id="ref-for-dom-videoframe-coded-width-slot①">[[coded width]]</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-width-slot" id="ref-for-dom-videoframe-visible-width-slot②">[[visible width]]</a></code>.</p>
+        <li data-md>
+         <p>Assign <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-height-slot" id="ref-for-dom-videoframe-coded-height-slot①">[[coded height]]</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-height-slot" id="ref-for-dom-videoframe-visible-height-slot②">[[visible height]]</a></code>.</p>
+       </ol>
       <li data-md>
        <p>If <var>init</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-displaywidth" id="ref-for-dom-videoframeplaneinit-displaywidth">displayWidth</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists⑦">exists</a>, assign
-it to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-display-width-slot" id="ref-for-dom-videoframe-display-width-slot">[[display width]]</a></code>. Otherwise, assign <code class="idl"><a data-link-type="idl" href="#dom-videoframe-crop-width-slot" id="ref-for-dom-videoframe-crop-width-slot③">[[crop width]]</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-display-width-slot" id="ref-for-dom-videoframe-display-width-slot①">[[display width]]</a></code>.</p>
+it to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-display-width-slot" id="ref-for-dom-videoframe-display-width-slot">[[display width]]</a></code>. Otherwise, assign <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-width-slot" id="ref-for-dom-videoframe-visible-width-slot③">[[visible width]]</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-display-width-slot" id="ref-for-dom-videoframe-display-width-slot①">[[display width]]</a></code>.</p>
       <li data-md>
        <p>If <var>init</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-displayheight" id="ref-for-dom-videoframeplaneinit-displayheight">displayHeight</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists⑧">exists</a>, assign
-it to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-display-height-slot" id="ref-for-dom-videoframe-display-height-slot">[[display height]]</a></code>. Otherwise, assign <code class="idl"><a data-link-type="idl" href="#dom-videoframe-crop-height-slot" id="ref-for-dom-videoframe-crop-height-slot③">[[crop height]]</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-display-height-slot" id="ref-for-dom-videoframe-display-height-slot①">[[display height]]</a></code>.</p>
+it to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-display-height-slot" id="ref-for-dom-videoframe-display-height-slot">[[display height]]</a></code>. Otherwise, assign <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-height-slot" id="ref-for-dom-videoframe-visible-height-slot③">[[visible height]]</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-display-height-slot" id="ref-for-dom-videoframe-display-height-slot①">[[display height]]</a></code>.</p>
       <li data-md>
        <p>Assign <var>init</var>’s <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-timestamp" id="ref-for-dom-videoframeplaneinit-timestamp">timestamp</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-duration" id="ref-for-dom-videoframeplaneinit-duration">duration</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-timestamp-slot" id="ref-for-dom-videoframe-timestamp-slot①">[[timestamp]]</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-duration-slot" id="ref-for-dom-videoframe-duration-slot①">[[duration]]</a></code> respectively.</p>
      </ol>
@@ -3327,45 +3397,54 @@ <h4 class="heading settled" data-level="9.4.3" id="videoframe-attributes"><span
      <p>Describes the arrangement of bytes in each plane as well as the number and
 order of the planes.</p>
      <p>The <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format" id="ref-for-dom-videoframe-format①">format</a></code> getter steps are to return <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot②">[[format]]</a></code>.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-planes"><code>planes</code></dfn>, <span> of type FrozenArray&lt;<a data-link-type="idl-name" href="#plane" id="ref-for-plane⑤">Plane</a>>, readonly, nullable</span>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-codedwidth"><code>codedWidth</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤⑥">unsigned long</a>, readonly</span>
     <dd data-md>
-     <p>Holds pixel data data, laid out as described by format and Plane
-attributes.</p>
-     <p>The <code class="idl"><a data-link-type="idl" href="#dom-videoframe-planes" id="ref-for-dom-videoframe-planes①">planes</a></code> getter steps are to return <code class="idl"><a data-link-type="idl" href="#dom-videoframe-planes-slot" id="ref-for-dom-videoframe-planes-slot②">[[planes]]</a></code>.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-codedwidth"><code>codedWidth</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥①">unsigned long</a>, readonly</span>
-    <dd data-md>
-     <p>Width of the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③⓪">VideoFrame</a></code> in pixels, prior to any cropping or aspect ratio
-adjustments.</p>
+     <p>Width of the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②⑦">VideoFrame</a></code> in pixels, potentionally including non-visible
+padding, and prior to considering potential ratio adjustments.</p>
      <p>The <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedwidth" id="ref-for-dom-videoframe-codedwidth②">codedWidth</a></code> getter steps are to return <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-width-slot" id="ref-for-dom-videoframe-coded-width-slot②">[[coded width]]</a></code>.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-codedheight"><code>codedHeight</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥②">unsigned long</a>, readonly</span>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-codedheight"><code>codedHeight</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤⑦">unsigned long</a>, readonly</span>
     <dd data-md>
-     <p>Height of the VideoFrame in pixels, prior to any cropping or aspect ratio
-adjustments.</p>
+     <p>Height of the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②⑧">VideoFrame</a></code> in pixels, potentionally including non-visible
+padding, and prior to considering potential ratio adjustments.</p>
      <p>The <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedheight" id="ref-for-dom-videoframe-codedheight②">codedHeight</a></code> getter steps are to return <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-height-slot" id="ref-for-dom-videoframe-coded-height-slot②">[[coded height]]</a></code>.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-cropleft"><code>cropLeft</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥③">unsigned long</a>, readonly</span>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-codedrect"><code>codedRect</code></dfn>, <span> of type <a data-link-type="idl-name" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect③">VideoFrameRect</a>, readonly</span>
     <dd data-md>
-     <p>The number of pixels to remove from the left of the VideoFrame, prior to
-aspect ratio adjustments.</p>
-     <p>The <code class="idl"><a data-link-type="idl" href="#dom-videoframe-cropleft" id="ref-for-dom-videoframe-cropleft②">cropLeft</a></code> getter steps are to return <code class="idl"><a data-link-type="idl" href="#dom-videoframe-crop-left-slot" id="ref-for-dom-videoframe-crop-left-slot①">[[crop left]]</a></code>.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-croptop"><code>cropTop</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥④">unsigned long</a>, readonly</span>
-    <dd data-md>
-     <p>The number of pixels to remove from the top of the VideoFrame, prior to
-aspect ratio adjustments.</p>
-     <p>The <code class="idl"><a data-link-type="idl" href="#dom-videoframe-croptop" id="ref-for-dom-videoframe-croptop②">cropTop</a></code> getter steps are to return <code class="idl"><a data-link-type="idl" href="#dom-videoframe-crop-top-slot" id="ref-for-dom-videoframe-crop-top-slot①">[[crop top]]</a></code>.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-cropwidth"><code>cropWidth</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥⑤">unsigned long</a>, readonly</span>
-    <dd data-md>
-     <p>The width of pixels to include in the crop, starting from cropLeft.</p>
-     <p>The <code class="idl"><a data-link-type="idl" href="#dom-videoframe-cropwidth" id="ref-for-dom-videoframe-cropwidth①">cropWidth</a></code> getter steps are to return <code class="idl"><a data-link-type="idl" href="#dom-videoframe-crop-width-slot" id="ref-for-dom-videoframe-crop-width-slot④">[[crop width]]</a></code>.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-cropheight"><code>cropHeight</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥⑥">unsigned long</a>, readonly</span>
+     <p>A <code class="idl"><a data-link-type="idl" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect④">VideoFrameRect</a></code> with width and height matching <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedwidth" id="ref-for-dom-videoframe-codedwidth③">codedWidth</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedheight" id="ref-for-dom-videoframe-codedheight③">codedHeight</a></code> and origin always at (0,0). Offered for
+convenience for use with <code class="idl"><a data-link-type="idl" href="#dom-videoframe-allocationsize" id="ref-for-dom-videoframe-allocationsize①">allocationSize()</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-copyto" id="ref-for-dom-videoframe-copyto①">copyTo()</a></code>.</p>
+     <p>The <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedrect" id="ref-for-dom-videoframe-codedrect①">codedRect</a></code> getter steps are:</p>
+     <ol>
+      <li data-md>
+       <p>Let <var>rect</var> be a new <code class="idl"><a data-link-type="idl" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect⑤">VideoFrameRect</a></code>, initialized as follows:</p>
+       <ol>
+        <li data-md>
+         <p>Assign <code>0</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframerect-left" id="ref-for-dom-videoframerect-left">left</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframerect-top" id="ref-for-dom-videoframerect-top">top</a></code>.</p>
+        <li data-md>
+         <p>Assign <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-width-slot" id="ref-for-dom-videoframe-coded-width-slot③">[[coded width]]</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-height-slot" id="ref-for-dom-videoframe-coded-height-slot③">[[coded height]]</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframerect-width" id="ref-for-dom-videoframerect-width①">width</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframerect-height" id="ref-for-dom-videoframerect-height①">height</a></code> respectively.</p>
+       </ol>
+      <li data-md>
+       <p>Return <var>rect</var>.</p>
+     </ol>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-visiblerect"><code>visibleRect</code></dfn>, <span> of type <a data-link-type="idl-name" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect⑥">VideoFrameRect</a>, readonly</span>
     <dd data-md>
-     <p>The height of pixels to include in the crop, starting from cropLeft.</p>
-     <p>The <code class="idl"><a data-link-type="idl" href="#dom-videoframe-cropheight" id="ref-for-dom-videoframe-cropheight①">cropHeight</a></code> getter steps are to return <code class="idl"><a data-link-type="idl" href="#dom-videoframe-crop-height-slot" id="ref-for-dom-videoframe-crop-height-slot④">[[crop height]]</a></code>.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-displaywidth"><code>displayWidth</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥⑦">unsigned long</a>, readonly</span>
+     <p>A <code class="idl"><a data-link-type="idl" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect⑦">VideoFrameRect</a></code> describing the visible rectangle of pixels for this <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe②⑨">VideoFrame</a></code>.</p>
+     <p>The <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visiblerect" id="ref-for-dom-videoframe-visiblerect②">visibleRect</a></code> getter steps are:</p>
+     <ol>
+      <li data-md>
+       <p>Let <var>rect</var> be a new <code class="idl"><a data-link-type="idl" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect⑧">VideoFrameRect</a></code>, initialized as follows:</p>
+       <ol>
+        <li data-md>
+         <p>Assign <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-left-slot" id="ref-for-dom-videoframe-visible-left-slot②">[[visible left]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-top-slot" id="ref-for-dom-videoframe-visible-top-slot②">[[visible top]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-width-slot" id="ref-for-dom-videoframe-visible-width-slot④">[[visible width]]</a></code>,
+and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-height-slot" id="ref-for-dom-videoframe-visible-height-slot④">[[visible height]]</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframerect-left" id="ref-for-dom-videoframerect-left①">left</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframerect-top" id="ref-for-dom-videoframerect-top①">top</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframerect-width" id="ref-for-dom-videoframerect-width②">width</a></code>, and <code class="idl"><a data-link-type="idl" href="#dom-videoframerect-height" id="ref-for-dom-videoframerect-height②">height</a></code> respectively.</p>
+       </ol>
+      <li data-md>
+       <p>Return <var>rect</var>.</p>
+     </ol>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-displaywidth"><code>displayWidth</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤⑧">unsigned long</a>, readonly</span>
     <dd data-md>
      <p>Width of the VideoFrame when displayed after applying aspect ratio
 adjustments.</p>
      <p>The <code class="idl"><a data-link-type="idl" href="#dom-videoframe-displaywidth" id="ref-for-dom-videoframe-displaywidth②">displayWidth</a></code> getter steps are to return <code class="idl"><a data-link-type="idl" href="#dom-videoframe-display-width-slot" id="ref-for-dom-videoframe-display-width-slot②">[[display width]]</a></code>.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-displayheight"><code>displayHeight</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥⑧">unsigned long</a>, readonly</span>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="attribute" data-export id="dom-videoframe-displayheight"><code>displayHeight</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑤⑨">unsigned long</a>, readonly</span>
     <dd data-md>
      <p>Height of the VideoFrame when displayed after applying aspect ratio
 adjustments.</p>
@@ -3381,86 +3460,203 @@ <h4 class="heading settled" data-level="9.4.3" id="videoframe-attributes"><span
 from the <code class="idl"><a data-link-type="idl" href="#encodedvideochunk" id="ref-for-encodedvideochunk①⑨">EncodedVideoChunk</a></code> corresponding to this VideoFrame.</p>
      <p>The <code class="idl"><a data-link-type="idl" href="#dom-videoframe-duration" id="ref-for-dom-videoframe-duration①">duration</a></code> getter steps are to return <code class="idl"><a data-link-type="idl" href="#dom-videoframe-duration-slot" id="ref-for-dom-videoframe-duration-slot②">[[duration]]</a></code>.</p>
    </dl>
-   <h4 class="heading settled" data-level="9.4.4" id="videoframe-methods"><span class="secno">9.4.4. </span><span class="content">Methods</span><a class="self-link" href="#videoframe-methods"></a></h4>
+   <h4 class="heading settled" data-level="9.4.4" id="videoframe-internal-structures"><span class="secno">9.4.4. </span><span class="content">Internal Structures</span><a class="self-link" href="#videoframe-internal-structures"></a></h4>
+    A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="parsed-copyto-options">parsed copyto options</dfn> is a <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#struct" id="ref-for-struct">struct</a> that consists of: 
+   <ul>
+    <li data-md>
+     <p>A <dfn class="dfn-paneled" data-dfn-for="parsed copyto options" data-dfn-type="dfn" data-noexport id="parsed-copyto-options-allocationsize">allocationSize</dfn> (an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥⓪">unsigned
+long</a></code>)</p>
+    <li data-md>
+     <p>A <dfn class="dfn-paneled" data-dfn-for="parsed copyto options" data-dfn-type="dfn" data-noexport id="parsed-copyto-options-computedlayouts">computedLayouts</dfn> (a <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#lists" id="ref-for-lists⑧">list</a> of <a data-link-type="dfn" href="#computed-plane-layout" id="ref-for-computed-plane-layout">computed plane layout</a> structs).</p>
+   </ul>
+   <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="computed-plane-layout">computed plane layout</dfn> is a <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#struct" id="ref-for-struct①">struct</a> that consists of:</p>
+   <ul>
+    <li data-md>
+     <p>A <dfn class="dfn-paneled" data-dfn-for="computed plane layout" data-dfn-type="dfn" data-noexport id="computed-plane-layout-destinationoffset">destinationOffset</dfn> (an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥①">unsigned long</a></code>)</p>
+    <li data-md>
+     <p>A <dfn class="dfn-paneled" data-dfn-for="computed plane layout" data-dfn-type="dfn" data-noexport id="computed-plane-layout-destinationstride">destinationStride</dfn> (an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥②">unsigned long</a></code>)</p>
+    <li data-md>
+     <p>A <dfn class="dfn-paneled" data-dfn-for="computed plane layout" data-dfn-type="dfn" data-noexport id="computed-plane-layout-sourcetop">sourceTop</dfn> (an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥③">unsigned long</a></code>)</p>
+    <li data-md>
+     <p>A <dfn class="dfn-paneled" data-dfn-for="computed plane layout" data-dfn-type="dfn" data-noexport id="computed-plane-layout-sourceheight">sourceHeight</dfn> (an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥④">unsigned long</a></code>)</p>
+    <li data-md>
+     <p>A <dfn class="dfn-paneled" data-dfn-for="computed plane layout" data-dfn-type="dfn" data-noexport id="computed-plane-layout-sourceleftbytes">sourceLeftBytes</dfn> (an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥⑤">unsigned long</a></code>)</p>
+    <li data-md>
+     <p>A <dfn class="dfn-paneled" data-dfn-for="computed plane layout" data-dfn-type="dfn" data-noexport id="computed-plane-layout-sourcewidthbytes">sourceWidthBytes</dfn> (an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥⑥">unsigned long</a></code>)</p>
+   </ul>
+   <h4 class="heading settled" data-level="9.4.5" id="videoframe-methods"><span class="secno">9.4.5. </span><span class="content">Methods</span><a class="self-link" href="#videoframe-methods"></a></h4>
    <dl>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="method" data-export data-lt="allocationSize(options)|allocationSize()" id="dom-videoframe-allocationsize"><code>allocationSize(<var>options</var>)</code></dfn>
+    <dd data-md>
+     <p>Returns the minimum byte length for a valid destination <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource①②">BufferSource</a></code> to be used with <code class="idl"><a data-link-type="idl" href="#dom-videoframe-copyto" id="ref-for-dom-videoframe-copyto②">copyTo()</a></code> with the given options.</p>
+     <p>When invoked, run these steps:</p>
+     <ol>
+      <li data-md>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframe-detached-slot" id="ref-for-dom-videoframe-detached-slot①">[[detached]]</a></code> is <code>true</code>, return <code>0</code>.</p>
+      <li data-md>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot③">[[format]]</a></code> is <code>""</code>, throw a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#notsupportederror" id="ref-for-notsupportederror⑧">NotSupportedError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException②③">DOMException</a></code>.</p>
+      <li data-md>
+       <p>Let <var>parsedOptions</var> be the result of running the <a data-link-type="dfn" href="#videoframe-parse-videoframecopytooptions" id="ref-for-videoframe-parse-videoframecopytooptions">Parse
+VideoFrameCopyToOptions</a> algorithm with <var>options</var>.</p>
+      <li data-md>
+       <p>If <var>parsedOptions</var> is an excpetion, throw <var>parsedOptions</var>.</p>
+      <li data-md>
+       <p>Return <var>parsedOptions</var>’ <a data-link-type="dfn" href="#parsed-copyto-options-allocationsize" id="ref-for-parsed-copyto-options-allocationsize">allocationSize</a></p>
+     </ol>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="method" data-export data-lt="copyTo(destination, options)|copyTo(destination)" id="dom-videoframe-copyto"><code>copyTo(<var>destination</var>, <var>options</var>)</code></dfn>
+    <dd data-md>
+     <p>Asynchronously copies the planes of this frame into <var>destination</var> according
+to <var>options</var>. The format of the data is the same as this <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③⓪">VideoFrame</a></code>'s <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format" id="ref-for-dom-videoframe-format②">format</a></code>.</p>
+     <p class="note" role="note"><span>NOTE:</span> Promises that are returned by several calls to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-copyto" id="ref-for-dom-videoframe-copyto③">copyTo()</a></code> are not guaranteed to resolve in the order they
+    were returned.</p>
+     <p>When invoked, run these steps:</p>
+     <ol>
+      <li data-md>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframe-detached-slot" id="ref-for-dom-videoframe-detached-slot②">[[detached]]</a></code> is <code>true</code>, return <code>0</code>.</p>
+      <li data-md>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot④">[[format]]</a></code> is <code>""</code>, throw a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#notsupportederror" id="ref-for-notsupportederror⑨">NotSupportedError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException②④">DOMException</a></code>.</p>
+      <li data-md>
+       <p>Let <var>parsedOptions</var> be the result of running the <a data-link-type="dfn" href="#videoframe-parse-videoframecopytooptions" id="ref-for-videoframe-parse-videoframecopytooptions①">Parse
+VideoFrameCopyToOptions</a> algorithm with <var>options</var>.</p>
+      <li data-md>
+       <p>If <var>parsedOptions</var> is an exception, return a promise rejected with <var>parsedOptions</var>.</p>
+      <li data-md>
+       <p>If <code>destionation.byteLength</code> is less than <var>parsedOptions</var>’ <a data-link-type="dfn" href="#parsed-copyto-options-allocationsize" id="ref-for-parsed-copyto-options-allocationsize①">allocationSize</a>, return a promise rejected with a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror①⑥">TypeError</a></code>.</p>
+      <li data-md>
+       <p>Let <var>p</var> be a new <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise⑨">Promise</a></code>.</p>
+      <li data-md>
+       <p>Let <var>copyStepsQueue</var> be the result of starting a new <a data-link-type="dfn" href="https://html.spec.whatwg.org/multipage/infrastructure.html#parallel-queue" id="ref-for-parallel-queue④">parallel queue</a>.</p>
+      <li data-md>
+       <p>Enqueue the following steps to <var>copyStepsQueue</var>:</p>
+       <ol>
+        <li data-md>
+         <p>Let resource be the <a data-link-type="dfn" href="#media-resource" id="ref-for-media-resource①⑧">media resource</a> referenced by
+[[resource reference]].</p>
+        <li data-md>
+         <p>Let <var>numPlanes</var> be the number of planes as defined by <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot⑤">[[format]]</a></code>.</p>
+        <li data-md>
+         <p>Let <var>planeIndex</var> be <code>0</code>.</p>
+        <li data-md>
+         <p>While <var>planeIndex</var> is less than <var>parsedOptions</var>’ <var>numPlanes</var>:</p>
+         <ol>
+          <li data-md>
+           <p>Let <var>sourceStride</var> be the stride of the plane in <var>resource</var> as
+identified by <var>planeIndex</var>.</p>
+          <li data-md>
+           <p>Let <var>computedLayout</var> be the <a data-link-type="dfn" href="#computed-plane-layout" id="ref-for-computed-plane-layout①">computed plane layout</a> in <var>parsedOptions</var>’ <a data-link-type="dfn" href="#parsed-copyto-options-computedlayouts" id="ref-for-parsed-copyto-options-computedlayouts">computedLayouts</a> at the
+position of <var>planeIndex</var></p>
+          <li data-md>
+           <p>Let <var>sourceOffset</var> be the product of multiplying <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-sourcetop" id="ref-for-computed-plane-layout-sourcetop">sourceTop</a> by <var>sourceStride</var></p>
+          <li data-md>
+           <p>Add <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-sourceleftbytes" id="ref-for-computed-plane-layout-sourceleftbytes">sourceLeftBytes</a> to
+sourceOffset.</p>
+          <li data-md>
+           <p>Let <var>destinationOffset</var> be <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-destinationoffset" id="ref-for-computed-plane-layout-destinationoffset">destinationOffset</a>.</p>
+          <li data-md>
+           <p>Let <var>rowBytes</var> be <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-sourcewidthbytes" id="ref-for-computed-plane-layout-sourcewidthbytes">sourceWidthBytes</a>.</p>
+          <li data-md>
+           <p>Let <var>row</var> be <code>0</code>.</p>
+          <li data-md>
+           <p>While <var>row</var> is less than <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-sourceheight" id="ref-for-computed-plane-layout-sourceheight">sourceHeight</a>:</p>
+           <ol>
+            <li data-md>
+             <p>Copy <var>rowBytes</var> bytes from <var>resource</var> starting at <var>sourceOffset</var> to <var>destination</var> starting at <var>destinationOffset</var>.</p>
+            <li data-md>
+             <p>Increment <var>sourceOffset</var> by <var>sourceStride</var>.</p>
+            <li data-md>
+             <p>Increment <var>destinationOffset</var> by <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-destinationstride" id="ref-for-computed-plane-layout-destinationstride">destinationStride</a>.</p>
+            <li data-md>
+             <p>Increment <var>row</var> by <code>1</code>.</p>
+           </ol>
+          <li data-md>
+           <p>Increment <var>planeIndex</var> by <code>1</code>.</p>
+         </ol>
+        <li data-md>
+         <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread②⑦">control thread</a> event loop to resolve <var>p</var>.</p>
+       </ol>
+      <li data-md>
+       <p>Return <var>p</var>.</p>
+     </ol>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="method" data-export id="dom-videoframe-clone"><code>clone()</code></dfn>
     <dd data-md>
-     <p>Creates a new <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③①">VideoFrame</a></code> with a reference to the same <a data-link-type="dfn" href="#media-resource" id="ref-for-media-resource①⑧">media resource</a>.</p>
+     <p>Creates a new <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③①">VideoFrame</a></code> with a reference to the same <a data-link-type="dfn" href="#media-resource" id="ref-for-media-resource①⑨">media resource</a>.</p>
      <p>When invoked, run these steps:</p>
      <ol>
       <li data-md>
-       <p>If the value of <var>frame</var>’s <code class="idl"><a data-link-type="idl" href="#dom-videoframe-detached-slot" id="ref-for-dom-videoframe-detached-slot①">[[detached]]</a></code> internal slot is <code>true</code>, throw an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror②①">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①①">DOMException</a></code>.</p>
+       <p>If the value of <var>frame</var>’s <code class="idl"><a data-link-type="idl" href="#dom-videoframe-detached-slot" id="ref-for-dom-videoframe-detached-slot③">[[detached]]</a></code> internal slot is <code>true</code>, throw an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror②①">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException②⑤">DOMException</a></code>.</p>
       <li data-md>
        <p>Return the result of running the <a data-link-type="dfn" href="#clone-videoframe" id="ref-for-clone-videoframe①">Clone VideoFrame</a> algorithm with <a data-link-type="dfn" href="https://heycam.github.io/webidl/#this" id="ref-for-this①">this</a>.</p>
      </ol>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrame" data-dfn-type="method" data-export id="dom-videoframe-close"><code>close()</code></dfn>
     <dd data-md>
-     <p>Clears all state and releases the reference to the <a data-link-type="dfn" href="#media-resource" id="ref-for-media-resource①⑨">media resource</a>.
+     <p>Clears all state and releases the reference to the <a data-link-type="dfn" href="#media-resource" id="ref-for-media-resource②⓪">media resource</a>.
 Close is final.</p>
      <p>When invoked, run these steps:</p>
      <ol>
       <li data-md>
        <p>Assign <code>null</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-resource-reference-slot" id="ref-for-dom-videoframe-resource-reference-slot②">[[resource reference]]</a></code>.</p>
       <li data-md>
-       <p>Assign <code>true</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-detached-slot" id="ref-for-dom-videoframe-detached-slot②">[[detached]]</a></code>.</p>
-      <li data-md>
-       <p>Assign <code>""</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format" id="ref-for-dom-videoframe-format②">format</a></code>.</p>
+       <p>Assign <code>true</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-detached-slot" id="ref-for-dom-videoframe-detached-slot④">[[detached]]</a></code>.</p>
       <li data-md>
-       <p>Assign <code>null</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-planes" id="ref-for-dom-videoframe-planes②">planes</a></code>.</p>
+       <p>Assign <code>""</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format" id="ref-for-dom-videoframe-format③">format</a></code>.</p>
       <li data-md>
-       <p>Assign <code>0</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedwidth" id="ref-for-dom-videoframe-codedwidth③">codedWidth</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedheight" id="ref-for-dom-videoframe-codedheight③">codedHeight</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-cropleft" id="ref-for-dom-videoframe-cropleft③">cropLeft</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-croptop" id="ref-for-dom-videoframe-croptop③">cropTop</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-cropwidth" id="ref-for-dom-videoframe-cropwidth②">cropWidth</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-cropheight" id="ref-for-dom-videoframe-cropheight②">cropHeight</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-displaywidth" id="ref-for-dom-videoframe-displaywidth③">displayWidth</a></code>, and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-displayheight" id="ref-for-dom-videoframe-displayheight③">displayHeight</a></code>.</p>
+       <p>Assign <code>0</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-width-slot" id="ref-for-dom-videoframe-coded-width-slot④">[[coded width]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-height-slot" id="ref-for-dom-videoframe-coded-height-slot④">[[coded height]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-left-slot" id="ref-for-dom-videoframe-visible-left-slot③">[[visible left]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-top-slot" id="ref-for-dom-videoframe-visible-top-slot③">[[visible top]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-width-slot" id="ref-for-dom-videoframe-visible-width-slot⑤">[[visible width]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-height-slot" id="ref-for-dom-videoframe-visible-height-slot⑤">[[visible height]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-display-width-slot" id="ref-for-dom-videoframe-display-width-slot③">[[display width]]</a></code>,
+and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-display-height-slot" id="ref-for-dom-videoframe-display-height-slot③">[[display height]]</a></code>.</p>
       <li data-md>
-       <p>Assign <code>null</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-duration" id="ref-for-dom-videoframe-duration②">duration</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-timestamp" id="ref-for-dom-videoframe-timestamp②">timestamp</a></code>.</p>
+       <p>Assign <code>null</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-duration-slot" id="ref-for-dom-videoframe-duration-slot③">[[duration]]</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-timestamp-slot" id="ref-for-dom-videoframe-timestamp-slot③">[[timestamp]]</a></code>.</p>
      </ol>
    </dl>
-   <h4 class="heading settled" data-level="9.4.5" id="videoframe-algorithms"><span class="secno">9.4.5. </span><span class="content">Algorithms</span><a class="self-link" href="#videoframe-algorithms"></a></h4>
+   <h4 class="heading settled" data-level="9.4.6" id="videoframe-algorithms"><span class="secno">9.4.6. </span><span class="content">Algorithms</span><a class="self-link" href="#videoframe-algorithms"></a></h4>
     <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="create-a-videoframe">Create a VideoFrame</dfn> (with <var>output</var>, <var>timestamp</var>, <var>duration</var>, <var>displayAspectWidth</var>, and <var>displayAspectHeight</var>) 
    <ol>
     <li data-md>
-     <p>Let <var>planes</var> be a sequence of <code class="idl"><a data-link-type="idl" href="#plane" id="ref-for-plane⑥">Plane</a></code>s containing the decoded
-  video frame data from <var>output</var>.</p>
-    <li data-md>
-     <p>Let <var>pixelFormat</var> be the <code class="idl"><a data-link-type="idl" href="#enumdef-pixelformat" id="ref-for-enumdef-pixelformat⑤">PixelFormat</a></code> of <var>planes</var>.</p>
-    <li data-md>
-     <p>Let <var>init</var> be a <code class="idl"><a data-link-type="idl" href="#dictdef-videoframeplaneinit" id="ref-for-dictdef-videoframeplaneinit①">VideoFramePlaneInit</a></code> with the following
-  keys:</p>
+     <p>Let <var>frame</var> be a new <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③②">VideoFrame</a></code>, constructed as follows:</p>
      <ol>
       <li data-md>
-       <p>Assign <var>timestamp</var> to <code class="idl"><a data-link-type="idl" href="#dom-videoframeinit-timestamp" id="ref-for-dom-videoframeinit-timestamp②">timestamp</a></code>.</p>
+       <p>Assign <code>false</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-detached-slot" id="ref-for-dom-videoframe-detached-slot⑤">[[detached]]</a></code>.</p>
       <li data-md>
-       <p>Assign <var>duration</var> to <code class="idl"><a data-link-type="idl" href="#dom-videoframeinit-duration" id="ref-for-dom-videoframeinit-duration">duration</a></code>.</p>
+       <p>Let <var>resource</var> be the <a data-link-type="dfn" href="#media-resource" id="ref-for-media-resource②①">media resource</a> described by <var>output</var>.</p>
       <li data-md>
-       <p>Let <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-codedwidth" id="ref-for-dom-videoframeplaneinit-codedwidth">codedWidth</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-codedheight" id="ref-for-dom-videoframeplaneinit-codedheight">codedHeight</a></code> be the width and height of the decoded video frame <var>output</var> in
-  pixels, prior to any cropping or aspect ratio adjustments.</p>
+       <p>Let <var>resourceReference</var> be a reference to <var>resource</var>.</p>
       <li data-md>
-       <p>Let <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-cropleft" id="ref-for-dom-videoframeplaneinit-cropleft①">cropLeft</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-croptop" id="ref-for-dom-videoframeplaneinit-croptop①">cropTop</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-cropwidth" id="ref-for-dom-videoframeplaneinit-cropwidth①">cropWidth</a></code>, and <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-cropheight" id="ref-for-dom-videoframeplaneinit-cropheight①">cropHeight</a></code> be the crop region of the decoded video frame <var>output</var> in
-  pixels, prior to any aspect ratio adjustments.</p>
+       <p>Assign <var>resourceReference</var> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-resource-reference-slot" id="ref-for-dom-videoframe-resource-reference-slot③">[[resource reference]]</a></code>.</p>
       <li data-md>
-       <p>Let <var>displayWidth</var> and <var>displayHeight</var> be the display size of
-  the decoded frame in pixels.</p>
+       <p>If <var>output</var> uses a recognized <code class="idl"><a data-link-type="idl" href="#enumdef-pixelformat" id="ref-for-enumdef-pixelformat⑤">PixelFormat</a></code>, assign that format to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot⑥">[[format]]</a></code>. Otherwise, assign <code>""</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot⑦">[[format]]</a></code>.</p>
+      <li data-md>
+       <p>Let <var>codedWidth</var> and <var>codedHeight</var> be the coded width and height of the <var>output</var> in pixels.</p>
+      <li data-md>
+       <p>Let <var>visibleLeft</var>, <var>visibleTop</var>, <var>visibleWidth</var>, and <var>visibleHeight</var> be
+  the left, top, width and height for the visible rectangle of <var>output</var>.</p>
+      <li data-md>
+       <p>Let <var>displayWidth</var> and <var>displayHeight</var> be the the display size of <var>output</var> in pixels.</p>
       <li data-md>
        <p>If <var>displayAspectWidth</var> and <var>displayAspectHeight</var> are provided,
   increase <var>displayWidth</var> or <var>displayHeight</var> until the ratio of <var>displayWidth</var> to <var>displayHeight</var> matches the ratio of <var>displayAspectWidth</var> to <var>displayAspectHeight</var>.</p>
       <li data-md>
-       <p>Assign the value of <var>displayWidth</var> and <var>displayHeight</var> to <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-displaywidth" id="ref-for-dom-videoframeplaneinit-displaywidth①">displayWidth</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-displayheight" id="ref-for-dom-videoframeplaneinit-displayheight①">displayHeight</a></code> respectively.</p>
+       <p>Assign <var>codedWidth</var>, <var>codedHeight</var>, <var>visibleLeft</var>, <var>visibleTop</var>, <var>visibleWidth</var>, <var>visibleHeight</var>, <var>displayWidth</var>, and <var>displayHeight</var> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-width-slot" id="ref-for-dom-videoframe-coded-width-slot⑤">[[coded width]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-height-slot" id="ref-for-dom-videoframe-coded-height-slot⑤">[[coded height]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-left-slot" id="ref-for-dom-videoframe-visible-left-slot④">[[visible left]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-top-slot" id="ref-for-dom-videoframe-visible-top-slot④">[[visible top]]</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-width-slot" id="ref-for-dom-videoframe-visible-width-slot⑥">[[visible width]]</a></code>,
+  and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visible-height-slot" id="ref-for-dom-videoframe-visible-height-slot⑥">[[visible height]]</a></code> respectively..</p>
+      <li data-md>
+       <p>Assign <var>duration</var> and <var>timestamp</var> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-duration-slot" id="ref-for-dom-videoframe-duration-slot④">[[duration]]</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-timestamp-slot" id="ref-for-dom-videoframe-timestamp-slot④">[[timestamp]]</a></code> respectively.</p>
      </ol>
     <li data-md>
-     <p>Return a new <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③②">VideoFrame</a></code>, constructed with <var>pixelFormat</var>, <var>planes</var>, and <var>init</var>.</p>
+     <p>Return <var>frame</var>.</p>
    </ol>
    <dl>
-    <dt data-md>To check if a <code class="idl"><a data-link-type="idl" href="#dictdef-videoframeplaneinit" id="ref-for-dictdef-videoframeplaneinit②">VideoFramePlaneInit</a></code> is a <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="valid-videoframeplaneinit">valid VideoFramePlaneInit</dfn>, run these steps:
+    <dt data-md>To check if a <code class="idl"><a data-link-type="idl" href="#dictdef-videoframeplaneinit" id="ref-for-dictdef-videoframeplaneinit①">VideoFramePlaneInit</a></code> is a <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="valid-videoframeplaneinit">valid VideoFramePlaneInit</dfn>, run these steps:
     <dd data-md>
      <ol>
       <li data-md>
-       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-codedwidth" id="ref-for-dom-videoframeplaneinit-codedwidth①">codedWidth</a></code> = 0 or <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-codedheight" id="ref-for-dom-videoframeplaneinit-codedheight①">codedHeight</a></code> = 0,return <code>false</code>.</p>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-codedwidth" id="ref-for-dom-videoframeplaneinit-codedwidth">codedWidth</a></code> = 0 or <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-codedheight" id="ref-for-dom-videoframeplaneinit-codedheight">codedHeight</a></code> = 0,return <code>false</code>.</p>
       <li data-md>
-       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-cropwidth" id="ref-for-dom-videoframeplaneinit-cropwidth②">cropWidth</a></code> = 0 or <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-cropheight" id="ref-for-dom-videoframeplaneinit-cropheight②">cropHeight</a></code> = 0, return <code>false</code>.</p>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-visiblerect" id="ref-for-dom-videoframeplaneinit-visiblerect④">visibleRect</a></code>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-width" id="ref-for-dom-videoframerect-width③">width</a></code> = 0
+or <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-visiblerect" id="ref-for-dom-videoframeplaneinit-visiblerect⑤">visibleRect</a></code>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-height" id="ref-for-dom-videoframerect-height③">height</a></code> =
+0, return <code>false</code>.</p>
       <li data-md>
-       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-croptop" id="ref-for-dom-videoframeplaneinit-croptop②">cropTop</a></code> + <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-cropheight" id="ref-for-dom-videoframeplaneinit-cropheight③">cropHeight</a></code> >= <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-codedheight" id="ref-for-dom-videoframeplaneinit-codedheight②">codedHeight</a></code>, return <code>false</code>.</p>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-visiblerect" id="ref-for-dom-videoframeplaneinit-visiblerect⑥">visibleRect</a></code>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-top" id="ref-for-dom-videoframerect-top②">top</a></code> + <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-visiblerect" id="ref-for-dom-videoframeplaneinit-visiblerect⑦">visibleRect</a></code>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-height" id="ref-for-dom-videoframerect-height④">height</a></code> >= <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-codedheight" id="ref-for-dom-videoframeplaneinit-codedheight①">codedHeight</a></code>, return <code>false</code>.</p>
       <li data-md>
-       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-cropleft" id="ref-for-dom-videoframeplaneinit-cropleft②">cropLeft</a></code> + <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-cropwidth" id="ref-for-dom-videoframeplaneinit-cropwidth③">cropWidth</a></code> >= <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-codedwidth" id="ref-for-dom-videoframeplaneinit-codedwidth②">codedWidth</a></code>, return <code>false</code>.</p>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-visiblerect" id="ref-for-dom-videoframeplaneinit-visiblerect⑧">visibleRect</a></code>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-left" id="ref-for-dom-videoframerect-left②">left</a></code> + <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-visiblerect" id="ref-for-dom-videoframeplaneinit-visiblerect⑨">visibleRect</a></code>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-width" id="ref-for-dom-videoframerect-width④">width</a></code> >= <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-codedwidth" id="ref-for-dom-videoframeplaneinit-codedwidth①">codedWidth</a></code>, return <code>false</code>.</p>
       <li data-md>
-       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-displaywidth" id="ref-for-dom-videoframeplaneinit-displaywidth②">displayWidth</a></code> = 0 or <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-displayheight" id="ref-for-dom-videoframeplaneinit-displayheight②">displayHeight</a></code> = 0, return <code>false</code>.</p>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-displaywidth" id="ref-for-dom-videoframeplaneinit-displaywidth①">displayWidth</a></code> = 0 or <code class="idl"><a data-link-type="idl" href="#dom-videoframeplaneinit-displayheight" id="ref-for-dom-videoframeplaneinit-displayheight①">displayHeight</a></code> = 0, return <code>false</code>.</p>
       <li data-md>
        <p>Return <code>true</code>.</p>
      </ol>
@@ -3468,157 +3664,306 @@ <h4 class="heading settled" data-level="9.4.5" id="videoframe-algorithms"><span
     <dd data-md>
      <ol>
       <li data-md>
-       <p>Let <var>resource</var> be the <a data-link-type="dfn" href="#media-resource" id="ref-for-media-resource②⓪">media resource</a> referenced by <var>otherFrame</var>’s <code class="idl"><a data-link-type="idl" href="#dom-videoframe-resource-reference-slot" id="ref-for-dom-videoframe-resource-reference-slot③">[[resource reference]]</a></code>.</p>
+       <p>Let <var>resource</var> be the <a data-link-type="dfn" href="#media-resource" id="ref-for-media-resource②②">media resource</a> referenced by <var>otherFrame</var>’s <code class="idl"><a data-link-type="idl" href="#dom-videoframe-resource-reference-slot" id="ref-for-dom-videoframe-resource-reference-slot④">[[resource reference]]</a></code>.</p>
+      <li data-md>
+       <p>Assign a new reference for <var>resource</var> to <var>frame</var>’s <code class="idl"><a data-link-type="idl" href="#dom-videoframe-resource-reference-slot" id="ref-for-dom-videoframe-resource-reference-slot⑤">[[resource reference]]</a></code>.</p>
+      <li data-md>
+       <p>Assign the following attributes from <var>otherFrame</var> to <var>frame</var>: <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format" id="ref-for-dom-videoframe-format④">format</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedwidth" id="ref-for-dom-videoframe-codedwidth④">codedWidth</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedheight" id="ref-for-dom-videoframe-codedheight④">codedHeight</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visiblerect" id="ref-for-dom-videoframe-visiblerect③">visibleRect</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-displaywidth" id="ref-for-dom-videoframe-displaywidth③">displayWidth</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-displayheight" id="ref-for-dom-videoframe-displayheight③">displayHeight</a></code>.</p>
+      <li data-md>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframeinit-duration" id="ref-for-dom-videoframeinit-duration">duration</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists⑨">exists</a> in <var>init</var>, assign it to <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-duration" id="ref-for-dom-videoframe-duration②">duration</a></code>. Otherwise, assign <var>otherFrame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-duration" id="ref-for-dom-videoframe-duration③">duration</a></code> to <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-duration" id="ref-for-dom-videoframe-duration④">duration</a></code>.</p>
+      <li data-md>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframeinit-timestamp" id="ref-for-dom-videoframeinit-timestamp②">timestamp</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists①⓪">exists</a> in <var>init</var>, assign it to <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-timestamp" id="ref-for-dom-videoframe-timestamp②">timestamp</a></code>. Otherwise, assign <var>otherFrame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-timestamp" id="ref-for-dom-videoframe-timestamp③">timestamp</a></code> to <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-timestamp" id="ref-for-dom-videoframe-timestamp④">timestamp</a></code>.</p>
+     </ol>
+    <dt data-md><dfn class="dfn-paneled" data-dfn-for="VideoFrame" data-dfn-type="dfn" data-noexport id="videoframe-initialize-frame-with-resource-and-size">Initialize Frame With Resource and Size</dfn> (with <var>init</var>, <var>frame</var>, <var>resource</var>, <var>width</var> and <var>height</var>)
+    <dd data-md>
+     <ol>
+      <li data-md>
+       <p>Assign a new reference for <var>resource</var> to <var>frame</var>’s <code class="idl"><a data-link-type="idl" href="#dom-videoframe-resource-reference-slot" id="ref-for-dom-videoframe-resource-reference-slot⑥">[[resource reference]]</a></code>.</p>
+      <li data-md>
+       <p>If <var>resource</var> uses a recognized <code class="idl"><a data-link-type="idl" href="#enumdef-pixelformat" id="ref-for-enumdef-pixelformat⑥">PixelFormat</a></code>, assign the <code class="idl"><a data-link-type="idl" href="#enumdef-pixelformat" id="ref-for-enumdef-pixelformat⑦">PixelFormat</a></code> of <var>resource</var> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot⑧">[[format]]</a></code>.</p>
+      <li data-md>
+       <p>Otherwise, assign <code>""</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot⑨">[[format]]</a></code>.</p>
+      <li data-md>
+       <p>Assign <var>width</var> to the following attributes of <var>frame</var>: <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedwidth" id="ref-for-dom-videoframe-codedwidth⑤">codedWidth</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-displaywidth" id="ref-for-dom-videoframe-displaywidth④">displayWidth</a></code>.</p>
       <li data-md>
-       <p>Assign a new reference for <var>resource</var> to <var>frame</var>’s <code class="idl"><a data-link-type="idl" href="#dom-videoframe-resource-reference-slot" id="ref-for-dom-videoframe-resource-reference-slot④">[[resource reference]]</a></code>.</p>
+       <p>Assign <var>height</var> to the following attributes of <var>frame</var>: <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedheight" id="ref-for-dom-videoframe-codedheight⑤">codedHeight</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-displayheight" id="ref-for-dom-videoframe-displayheight④">displayHeight</a></code>.</p>
       <li data-md>
-       <p>Assign the following attributes from <var>otherFrame</var> to <var>frame</var>: <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format" id="ref-for-dom-videoframe-format③">format</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedwidth" id="ref-for-dom-videoframe-codedwidth④">codedWidth</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedheight" id="ref-for-dom-videoframe-codedheight④">codedHeight</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-cropleft" id="ref-for-dom-videoframe-cropleft④">cropLeft</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-croptop" id="ref-for-dom-videoframe-croptop④">cropTop</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-cropwidth" id="ref-for-dom-videoframe-cropwidth③">cropWidth</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-cropheight" id="ref-for-dom-videoframe-cropheight③">cropHeight</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-displaywidth" id="ref-for-dom-videoframe-displaywidth④">displayWidth</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-displayheight" id="ref-for-dom-videoframe-displayheight④">displayHeight</a></code>.</p>
+       <p>Assign «[ "left:" → <code>0</code>, "top" → <code>0</code>, "width" → <var>width</var>, "height" → <var>height</var> ]» to <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-visiblerect" id="ref-for-dom-videoframe-visiblerect④">visibleRect</a></code>.</p>
       <li data-md>
-       <p>Let <var>planes</var> be a new <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#lists" id="ref-for-lists⑨">list</a>.</p>
+       <p>Assign <code>init</code>.<code class="idl"><a data-link-type="idl" href="#dom-videoframeinit-duration" id="ref-for-dom-videoframeinit-duration①">duration</a></code> to <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-duration" id="ref-for-dom-videoframe-duration⑤">duration</a></code>.</p>
       <li data-md>
-       <p>For each <var>otherPlane</var> in <var>otherFrame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-planes" id="ref-for-dom-videoframe-planes③">planes</a></code>:</p>
+       <p>Assign <code>init</code>.<code class="idl"><a data-link-type="idl" href="#dom-videoframeinit-timestamp" id="ref-for-dom-videoframeinit-timestamp③">timestamp</a></code> to <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-timestamp" id="ref-for-dom-videoframe-timestamp⑤">timestamp</a></code>.</p>
+     </ol>
+    <dt data-md><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="clone-videoframe">Clone VideoFrame</dfn> (with <var>frame</var>)
+    <dd data-md>
+     <ol>
+      <li data-md>
+       <p>Let <var>clone</var> be a new <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③③">VideoFrame</a></code> initialized as follows:</p>
        <ol>
         <li data-md>
-         <p>Let <var>plane</var> be a new <code class="idl"><a data-link-type="idl" href="#plane" id="ref-for-plane⑦">Plane</a></code>.</p>
+         <p>Assign <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-resource-reference-slot" id="ref-for-dom-videoframe-resource-reference-slot⑦">[[resource reference]]</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-resource-reference-slot" id="ref-for-dom-videoframe-resource-reference-slot⑧">[[resource reference]]</a></code>.</p>
         <li data-md>
-         <p>Assign a reference for <var>frame</var> to <var>plane</var>’s <code class="idl"><a data-link-type="idl" href="#dom-plane-parent-frame-slot" id="ref-for-dom-plane-parent-frame-slot①">[[parent frame]]</a></code>.</p>
+         <p>Assign <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-format" id="ref-for-dom-videoframe-format⑤">format</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format" id="ref-for-dom-videoframe-format⑥">format</a></code>.</p>
         <li data-md>
-         <p>Assign the following attributes from <var>otherPlane</var> to <var>plane</var>: <code class="idl"><a data-link-type="idl" href="#dom-plane-stride" id="ref-for-dom-plane-stride③">stride</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-plane-rows" id="ref-for-dom-plane-rows②">rows</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-plane-length" id="ref-for-dom-plane-length①">length</a></code>.</p>
-        <li data-md>
-         <p>Append <var>plane</var> to <var>planes</var>.</p>
+         <p>Assign all remaining attributes of <var>frame</var> ( <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedwidth" id="ref-for-dom-videoframe-codedwidth⑥">codedWidth</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedheight" id="ref-for-dom-videoframe-codedheight⑥">codedHeight</a></code>, etc.) to
+those of the same name in <var>clone</var>.</p>
        </ol>
       <li data-md>
-       <p>Assign <var>planes</var> to <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-planes" id="ref-for-dom-videoframe-planes④">planes</a></code>.</p>
+       <p>Return <var>clone</var>.</p>
+     </ol>
+    <dt data-md><dfn class="dfn-paneled" data-dfn-for="VideoFrame" data-dfn-type="dfn" data-noexport id="videoframe-parse-videoframecopytooptions">Parse VideoFrameCopyToOptions</dfn> (with <var>options</var>)
+    <dd data-md>
+     <ol>
       <li data-md>
-       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframeinit-duration" id="ref-for-dom-videoframeinit-duration①">duration</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists⑨">exists</a> in <var>init</var>, assign it to <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-duration" id="ref-for-dom-videoframe-duration③">duration</a></code>. Otherwise, assign <var>otherFrame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-duration" id="ref-for-dom-videoframe-duration④">duration</a></code> to <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-duration" id="ref-for-dom-videoframe-duration⑤">duration</a></code>.</p>
+       <p>Let <var>parsedRect</var> be the result of running the <a data-link-type="dfn" href="#videoframe-parse-copyto-rect" id="ref-for-videoframe-parse-copyto-rect">Parse CopyTo
+Rect</a> with <var>options</var>.</p>
       <li data-md>
-       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframeinit-timestamp" id="ref-for-dom-videoframeinit-timestamp③">timestamp</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists①⓪">exists</a> in <var>init</var>, assign it to <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-timestamp" id="ref-for-dom-videoframe-timestamp③">timestamp</a></code>. Otherwise, assign <var>otherFrame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-timestamp" id="ref-for-dom-videoframe-timestamp④">timestamp</a></code> to <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-timestamp" id="ref-for-dom-videoframe-timestamp⑤">timestamp</a></code>.</p>
+       <p>If <var>parsedRect</var> is an exception, return <var>parsedRect</var>.</p>
+      <li data-md>
+       <p>Let <var>parsedOptions</var> be the result of running the <a data-link-type="dfn" href="#videoframe-compute-layout-and-allocation-size" id="ref-for-videoframe-compute-layout-and-allocation-size">Compute
+Layout and Allocation Size</a> algorithm with <var>parsedRect</var> and <var>options</var>.</p>
+      <li data-md>
+       <p>Return <var>parsedOptions</var>.</p>
      </ol>
-    <dt data-md><dfn class="dfn-paneled" data-dfn-for="VideoFrame" data-dfn-type="dfn" data-noexport id="videoframe-initialize-frame-with-resource-and-size">Initialize Frame With Resource and Size</dfn> (with <var>init</var>, <var>frame</var>, <var>resource</var>, <var>width</var> and <var>height</var>)
+    <dt data-md><dfn class="dfn-paneled" data-dfn-for="VideoFrame" data-dfn-type="dfn" data-noexport id="videoframe-parse-copyto-rect">Parse CopyTo Rect</dfn> (with <var>options</var>)
     <dd data-md>
      <ol>
       <li data-md>
-       <p>Assign a new reference for <var>resource</var> to <var>frame</var>’s <code class="idl"><a data-link-type="idl" href="#dom-videoframe-resource-reference-slot" id="ref-for-dom-videoframe-resource-reference-slot⑤">[[resource reference]]</a></code>.</p>
+       <p>Let <var>sourceRect</var> be the be the result of performing the getter steps for <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visiblerect" id="ref-for-dom-videoframe-visiblerect⑤">visibleRect</a></code>.</p>
       <li data-md>
-       <p>If <var>resource</var> uses a recognized <code class="idl"><a data-link-type="idl" href="#enumdef-pixelformat" id="ref-for-enumdef-pixelformat⑥">PixelFormat</a></code>:</p>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframecopytooptions-rect" id="ref-for-dom-videoframecopytooptions-rect">rect</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists①①">exists</a> in <var>options</var>:</p>
        <ol>
         <li data-md>
-         <p>Assign the <code class="idl"><a data-link-type="idl" href="#enumdef-pixelformat" id="ref-for-enumdef-pixelformat⑦">PixelFormat</a></code> of <var>resource</var> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format" id="ref-for-dom-videoframe-format④">format</a></code>.</p>
+         <p>Let <var>optRect</var> be <code class="idl"><a data-link-type="idl" href="#dom-videoframecopytooptions-rect" id="ref-for-dom-videoframecopytooptions-rect①">rect</a></code>:</p>
         <li data-md>
-         <p>Let <var>planes</var> be a list of <code class="idl"><a data-link-type="idl" href="#plane" id="ref-for-plane⑧">Plane</a></code>s describing the <a data-link-type="dfn" href="#media-resource" id="ref-for-media-resource②①">media resource</a> in accordance with the <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format" id="ref-for-dom-videoframe-format⑤">format</a></code>.</p>
-         <p class="issue" id="issue-ca862628"><a class="self-link" href="#issue-ca862628"></a> The spec should define explicit rules for each <code class="idl"><a data-link-type="idl" href="#enumdef-pixelformat" id="ref-for-enumdef-pixelformat⑧">PixelFormat</a></code> and reference them in the step above. See <a href="https://github.com/w3c/webcodecs/issues/165">#165</a>.</p>
+         <p>If either of <var>optRect</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-width" id="ref-for-dom-videoframerect-width⑤">width</a></code> or <code class="idl"><a data-link-type="idl" href="#dom-videoframerect-height" id="ref-for-dom-videoframerect-height⑤">height</a></code> is <code>0</code>, return a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror①⑦">TypeError</a></code>.</p>
         <li data-md>
-         <p>Assign <var>planes</var> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-planes" id="ref-for-dom-videoframe-planes⑤">planes</a></code>.</p>
+         <p>If the sum of <var>optRect</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-left" id="ref-for-dom-videoframerect-left③">left</a></code> and <var>optRect</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-width" id="ref-for-dom-videoframerect-width⑥">width</a></code> is greater than <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-width-slot" id="ref-for-dom-videoframe-coded-width-slot⑥">[[coded width]]</a></code>, return a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror①⑧">TypeError</a></code>.</p>
+        <li data-md>
+         <p>If the sum of <var>optRect</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-top" id="ref-for-dom-videoframerect-top③">top</a></code> and <var>optRect</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-height" id="ref-for-dom-videoframerect-height⑥">height</a></code> is greater than <code class="idl"><a data-link-type="idl" href="#dom-videoframe-coded-height-slot" id="ref-for-dom-videoframe-coded-height-slot⑥">[[coded height]]</a></code>, return a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror①⑨">TypeError</a></code>.</p>
+        <li data-md>
+         <p>Assign <var>optRect</var> to <var>sourceRect</var>.</p>
        </ol>
       <li data-md>
-       <p>Otherwise (<var>resource</var> does not use a recognized <code class="idl"><a data-link-type="idl" href="#enumdef-pixelformat" id="ref-for-enumdef-pixelformat⑨">PixelFormat</a></code>):</p>
+       <p>Let <var>planeIndex</var> be <code>0</code>.</p>
+      <li data-md>
+       <p>Let <var>numPlanes</var> be the number of planes as defined by <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot①⓪">[[format]]</a></code></p>
+      <li data-md>
+       <p>While <var>planeIndex</var> is less than <var>numPlanes</var>:</p>
+       <p class="note" role="note"><span>NOTE:</span> The following steps validate <var>rect</var> is sample-aligned for this
+    frame’s <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot①①">[[format]]</a></code>.</p>
        <ol>
         <li data-md>
-         <p>Assign <code>""</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format" id="ref-for-dom-videoframe-format⑥">format</a></code>.</p>
+         <p>Let <var>plane</var> be the Plane identified by <var>planeIndex</var> as defined by <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot①②">[[format]]</a></code>.</p>
+        <li data-md>
+         <p>Let <var>sampleWidth</var> be the horizontal pixel size of each subsample
+for <var>plane</var>.</p>
+        <li data-md>
+         <p>Let <var>sampleHeight</var> be the vertical pixel size of each subsample
+for <var>plane</var>.</p>
+        <li data-md>
+         <p>If <var>sourceRect</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-left" id="ref-for-dom-videoframerect-left④">left</a></code> and <var>sourceRect</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-width" id="ref-for-dom-videoframerect-width⑦">width</a></code> are not both multiples of <var>sampleWidth</var>, throw a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror②⓪">TypeError</a></code>.</p>
         <li data-md>
-         <p>Assign <code>null</code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-planes" id="ref-for-dom-videoframe-planes⑥">planes</a></code>.</p>
+         <p>If <var>sourceRect</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-top" id="ref-for-dom-videoframerect-top④">top</a></code> and <var>sourceRect</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-height" id="ref-for-dom-videoframerect-height⑦">height</a></code> are not both multiples of <var>sampleHeight</var>, throw a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror②①">TypeError</a></code>.</p>
+        <li data-md>
+         <p>Increment <var>planeIndex</var> by <code>1</code></p>
        </ol>
       <li data-md>
-       <p>Assign <var>width</var> to the following attributes of <var>frame</var>: <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedwidth" id="ref-for-dom-videoframe-codedwidth⑤">codedWidth</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-cropwidth" id="ref-for-dom-videoframe-cropwidth④">cropWidth</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-displaywidth" id="ref-for-dom-videoframe-displaywidth⑤">displayWidth</a></code>.</p>
+       <p>Return <var>sourceRect</var>.</p>
+     </ol>
+    <dt data-md><dfn class="dfn-paneled" data-dfn-for="VideoFrame" data-dfn-type="dfn" data-noexport id="videoframe-compute-layout-and-allocation-size">Compute Layout and Allocation Size</dfn> (with <var>parsedRect</var> and <var>options</var>)
+    <dd data-md>
+     <ol>
+      <li data-md>
+       <p>Let <var>numPlanes</var> be the number of planes as defined by <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot①③">[[format]]</a></code></p>
       <li data-md>
-       <p>Assign <var>height</var> to the following attributes of <var>frame</var>: <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedheight" id="ref-for-dom-videoframe-codedheight⑤">codedHeight</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-cropheight" id="ref-for-dom-videoframe-cropheight④">cropHeight</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-displayheight" id="ref-for-dom-videoframe-displayheight⑤">displayHeight</a></code>.</p>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframecopytooptions-layout" id="ref-for-dom-videoframecopytooptions-layout">layout</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists①②">exists</a> its size does not
+equal <var>numPlanes</var>, throw a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror②②">TypeError</a></code>.</p>
       <li data-md>
-       <p>Assign <code>0</code> to frame’s <code class="idl"><a data-link-type="idl" href="#dom-videoframe-croptop" id="ref-for-dom-videoframe-croptop⑤">cropTop</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-cropleft" id="ref-for-dom-videoframe-cropleft⑤">cropLeft</a></code>.</p>
+       <p>Let <var>minAllocationSize</var> be <code>0</code>.</p>
       <li data-md>
-       <p>Assign <code>init</code>.<code class="idl"><a data-link-type="idl" href="#dom-videoframeinit-duration" id="ref-for-dom-videoframeinit-duration②">duration</a></code> to <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-duration" id="ref-for-dom-videoframe-duration⑥">duration</a></code>.</p>
+       <p>Let <var>computedLayouts</var> be a new <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#lists" id="ref-for-lists⑨">list</a>.</p>
       <li data-md>
-       <p>Assign <code>init</code>.<code class="idl"><a data-link-type="idl" href="#dom-videoframeinit-timestamp" id="ref-for-dom-videoframeinit-timestamp④">timestamp</a></code> to <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-timestamp" id="ref-for-dom-videoframe-timestamp⑥">timestamp</a></code>.</p>
-     </ol>
-    <dt data-md><dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="clone-videoframe">Clone VideoFrame</dfn> (with <var>frame</var>)
-    <dd data-md>
-     <ol>
+       <p>Let <var>endOffsets</var> be a new <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#lists" id="ref-for-lists①⓪">list</a>.</p>
       <li data-md>
-       <p>Let <var>clone</var> be a new <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③③">VideoFrame</a></code> initialized as follows:</p>
+       <p>Let <var>planeIndex</var> be <code>0</code>.</p>
+      <li data-md>
+       <p>While <var>planeIndex</var> &lt; <var>numPlanes</var>:</p>
        <ol>
         <li data-md>
-         <p>Assign <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-resource-reference-slot" id="ref-for-dom-videoframe-resource-reference-slot⑥">[[resource reference]]</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-resource-reference-slot" id="ref-for-dom-videoframe-resource-reference-slot⑦">[[resource reference]]</a></code>.</p>
+         <p>Let <var>plane</var> be the Plane identified by <var>planeIndex</var> as defined by <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot①④">[[format]]</a></code>.</p>
+        <li data-md>
+         <p>Let <var>sampleBytes</var> be the number of bytes per sample for <var>plane</var>.</p>
+        <li data-md>
+         <p>Let <var>sampleWidth</var> be the horizontal pixel size of each subsample
+for <var>plane</var>.</p>
+        <li data-md>
+         <p>Let <var>sampleHeight</var> be the vertical pixel size of each subsample
+for <var>plane</var>.</p>
+        <li data-md>
+         <p>Let <var>sampleWidthBytes</var> be the product of multiplying <var>sampleWidth</var> by <var>sampleBytes</var>.</p>
+        <li data-md>
+         <p>Let <var>computedLayout</var> be a new <a data-link-type="dfn" href="#computed-plane-layout" id="ref-for-computed-plane-layout②">computed plane layout</a>.</p>
+        <li data-md>
+         <p>Set <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-sourcetop" id="ref-for-computed-plane-layout-sourcetop①">sourceTop</a> to the
+result of the integer division of <var>parsedRect</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-top" id="ref-for-dom-videoframerect-top⑤">top</a></code> by <var>sampleHeight</var>.</p>
+        <li data-md>
+         <p>Set <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-sourceheight" id="ref-for-computed-plane-layout-sourceheight①">sourceHeight</a> to the
+result of the integer division of <var>parsedRect</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-height" id="ref-for-dom-videoframerect-height⑧">height</a></code> by <var>sampleHeight</var></p>
         <li data-md>
-         <p>Assign <var>frame</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframe-format" id="ref-for-dom-videoframe-format⑦">format</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format" id="ref-for-dom-videoframe-format⑧">format</a></code>.</p>
+         <p>Set <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-sourceleftbytes" id="ref-for-computed-plane-layout-sourceleftbytes①">sourceLeftBytes</a> to
+the result of the integer division of <var>parsedRect</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-left" id="ref-for-dom-videoframerect-left⑤">left</a></code> by <var>sampleWidthBytes</var>.</p>
         <li data-md>
-         <p>Assign a new <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#lists" id="ref-for-lists①⓪">list</a> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-planes" id="ref-for-dom-videoframe-planes⑦">planes</a></code>.</p>
+         <p>Set <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-sourcewidthbytes" id="ref-for-computed-plane-layout-sourcewidthbytes①">sourceWidthBytes</a> to
+the result of the integer division of <var>parsedRect</var>.<code class="idl"><a data-link-type="idl" href="#dom-videoframerect-width" id="ref-for-dom-videoframerect-width⑧">width</a></code> by <var>sampleWidthBytes</var>.</p>
         <li data-md>
-         <p>For each <var>plane</var> in <code class="idl"><a data-link-type="idl" href="#dom-videoframe-planes" id="ref-for-dom-videoframe-planes⑧">planes</a></code>:</p>
+         <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframecopytooptions-layout" id="ref-for-dom-videoframecopytooptions-layout①">layout</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists①③">exists</a>:</p>
          <ol>
           <li data-md>
-           <p>Let <var>clonePlane</var> be a new <code class="idl"><a data-link-type="idl" href="#plane" id="ref-for-plane⑨">Plane</a></code> initialized as follows:</p>
-           <ol>
-            <li data-md>
-             <p>Assign <var>clone</var> to <var>clonePlane</var>.<code class="idl"><a data-link-type="idl" href="#dom-plane-parent-frame-slot" id="ref-for-dom-plane-parent-frame-slot②">[[parent frame]]</a></code>.</p>
-            <li data-md>
-             <p>Assign <var>plane</var>.<code class="idl"><a data-link-type="idl" href="#dom-plane-stride" id="ref-for-dom-plane-stride④">stride</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-plane-stride" id="ref-for-dom-plane-stride⑤">stride</a></code>.</p>
-            <li data-md>
-             <p>Assign <var>plane</var>.<code class="idl"><a data-link-type="idl" href="#dom-plane-rows" id="ref-for-dom-plane-rows③">rows</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-plane-rows" id="ref-for-dom-plane-rows④">rows</a></code>.</p>
-            <li data-md>
-             <p>Assign <var>plane</var>.<code class="idl"><a data-link-type="idl" href="#dom-plane-length" id="ref-for-dom-plane-length②">length</a></code> to <code class="idl"><a data-link-type="idl" href="#dom-plane-length" id="ref-for-dom-plane-length③">length</a></code>.</p>
-           </ol>
+           <p>Let <var>planeLayout</var> be the <code class="idl"><a data-link-type="idl" href="#dictdef-planelayout" id="ref-for-dictdef-planelayout①">PlaneLayout</a></code> in <code class="idl"><a data-link-type="idl" href="#dom-videoframecopytooptions-layout" id="ref-for-dom-videoframecopytooptions-layout②">layout</a></code> at position <var>planeIndex</var>.</p>
+          <li data-md>
+           <p>If <var>planeLayout</var>.<code class="idl"><a data-link-type="idl" href="#dom-planelayout-stride" id="ref-for-dom-planelayout-stride">stride</a></code> is less than <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-sourcewidthbytes" id="ref-for-computed-plane-layout-sourcewidthbytes②">sourceWidthBytes</a>,
+return a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror②③">TypeError</a></code>.</p>
           <li data-md>
-           <p>Append <var>clonePlane</var> to <code class="idl"><a data-link-type="idl" href="#dom-videoframe-planes" id="ref-for-dom-videoframe-planes⑨">planes</a></code>.</p>
+           <p>Assign <var>planeLayout</var>.<code class="idl"><a data-link-type="idl" href="#dom-planelayout-offset" id="ref-for-dom-planelayout-offset">offset</a></code> to <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-destinationoffset" id="ref-for-computed-plane-layout-destinationoffset①">destinationOffset</a>.</p>
+          <li data-md>
+           <p>Assign <var>planeLayout</var>.<code class="idl"><a data-link-type="idl" href="#dom-planelayout-stride" id="ref-for-dom-planelayout-stride①">stride</a></code> to <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-destinationstride" id="ref-for-computed-plane-layout-destinationstride①">destinationStride</a>.</p>
          </ol>
         <li data-md>
-         <p>Assign all remaining attributes of <var>frame</var> (<code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedwidth" id="ref-for-dom-videoframe-codedwidth⑥">codedWidth</a></code>, <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedheight" id="ref-for-dom-videoframe-codedheight⑥">codedHeight</a></code>, etc.) to those of the same name in <var>clone</var>.</p>
+         <p>Otherwise:</p>
+         <p class="note" role="note"><span>NOTE:</span> If an explicit layout was not provided, the following steps
+    default to tight packing.</p>
+         <ol>
+          <li data-md>
+           <p>Assign <var>minAllocationSize</var> to <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-destinationoffset" id="ref-for-computed-plane-layout-destinationoffset②">destinationOffset</a>.</p>
+          <li data-md>
+           <p>Assign <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-sourcewidthbytes" id="ref-for-computed-plane-layout-sourcewidthbytes③">sourceWidthBytes</a> to <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-destinationstride" id="ref-for-computed-plane-layout-destinationstride②">destinationStride</a>.</p>
+         </ol>
+        <li data-md>
+         <p>Let <var>planeSize</var> be the product of multiplying <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-destinationstride" id="ref-for-computed-plane-layout-destinationstride③">destinationStride</a> and <a data-link-type="dfn" href="#computed-plane-layout-sourceheight" id="ref-for-computed-plane-layout-sourceheight②">sourceHeight</a>.</p>
+        <li data-md>
+         <p>Let <var>planeEnd</var> be the sum of <var>planeSize</var> and <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-destinationoffset" id="ref-for-computed-plane-layout-destinationoffset③">destinationOffset</a>.</p>
+        <li data-md>
+         <p>If <var>planeSize</var> or <var>planeEnd</var> is greater than maximum range of <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥⑦">unsigned long</a></code>, return a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror②④">TypeError</a></code>.</p>
+        <li data-md>
+         <p>Append <var>planeEnd</var> to <var>endOffsets</var>.</p>
+        <li data-md>
+         <p>Assign the maximum of <var>minAllocationSize</var> and <var>planeEnd</var> to <var>minAllocationSize</var>.</p>
+         <p class="note" role="note"><span>NOTE:</span> The above step uses a maximum to allow for the
+        possibility that user specified plane offsets may reorder
+        planes.</p>
+        <li data-md>
+         <p>Let <var>earlierPlaneIndex</var> be <code>0</code>.</p>
+        <li data-md>
+         <p>While <var>earlierPlaneIndex</var> is less than <var>planeIndex</var>.</p>
+         <ol>
+          <li data-md>
+           <p>Let <var>earlierLayout</var> be <code>computedLayouts[earlierPlaneIndex]</code>.</p>
+          <li data-md>
+           <p>If <code>endOffsets[planeIndex]</code> is less than or equal to <var>earlierLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-destinationoffset" id="ref-for-computed-plane-layout-destinationoffset④">destinationOffset</a> or
+if <code>endOffsets[earlierPlaneIndex]</code> is less than or equal to <var>computedLayout</var>’s <a data-link-type="dfn" href="#computed-plane-layout-destinationoffset" id="ref-for-computed-plane-layout-destinationoffset⑤">destinationOffset</a>,
+continue.</p>
+           <p class="note" role="note"><span>NOTE:</span> If plane A ends before plane B starts, they do not
+    overlap.</p>
+          <li data-md>
+           <p>Otherwise, return a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror②⑤">TypeError</a></code>.</p>
+          <li data-md>
+           <p>Increment <var>earlierPlaneIndex</var> by <code>1</code>.</p>
+         </ol>
+        <li data-md>
+         <p>Append <var>computedLayout</var> to <var>computedLayouts</var>.</p>
+        <li data-md>
+         <p>Increment <var>planeIndex</var> by <code>1</code>.</p>
        </ol>
       <li data-md>
-       <p>Return <var>clone</var>.</p>
+       <p>Let <var>parsedOptions</var> be a new <a data-link-type="dfn" href="#parsed-copyto-options" id="ref-for-parsed-copyto-options">parsed copyto options</a>, initialized as
+follows:</p>
+       <ol>
+        <li data-md>
+         <p>Assign <var>computedLayouts</var> to <a data-link-type="dfn" href="#parsed-copyto-options-computedlayouts" id="ref-for-parsed-copyto-options-computedlayouts①">computedLayouts</a>.</p>
+        <li data-md>
+         <p>Assign <var>minAllocationSize</var> to <a data-link-type="dfn" href="#parsed-copyto-options-allocationsize" id="ref-for-parsed-copyto-options-allocationsize②">allocationSize</a>.</p>
+       </ol>
+      <li data-md>
+       <p>Return <var>parsedOptions</var>.</p>
      </ol>
    </dl>
-   <h3 class="heading settled" data-level="9.5" id="plane-interface"><span class="secno">9.5. </span><span class="content">Plane Interface</span><a class="self-link" href="#plane-interface"></a></h3>
-    A <code class="idl"><a data-link-type="idl" href="#plane" id="ref-for-plane①⓪">Plane</a></code> is solely constructed by its <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③④">VideoFrame</a></code>. During construction,
-    the User Agent may use knowledge of the frame’s <code class="idl"><a data-link-type="idl" href="#enumdef-pixelformat" id="ref-for-enumdef-pixelformat①⓪">PixelFormat</a></code> to add
-    padding to the <code class="idl"><a data-link-type="idl" href="#plane" id="ref-for-plane①①">Plane</a></code> to improve memory alignment. 
-   <p>A <code class="idl"><a data-link-type="idl" href="#plane" id="ref-for-plane①②">Plane</a></code> cannot be used after the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③⑤">VideoFrame</a></code> is destroyed. A new <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③⑥">VideoFrame</a></code> can be assembled from existing <code class="idl"><a data-link-type="idl" href="#plane" id="ref-for-plane①③">Plane</a></code>s, and the new <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③⑦">VideoFrame</a></code> will remain valid when the original is destroyed. This makes
-    it possible to efficiently add an alpha plane to an existing <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③⑧">VideoFrame</a></code>.</p>
-<pre class="idl highlight def">[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed" id="ref-for-Exposed⑧"><c- g>Exposed</c-></a>=(<c- n>Window</c->,<c- n>DedicatedWorker</c->)]
-<c- b>interface</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="interface" data-export id="plane"><code><c- g>Plane</c-></code></dfn> {
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥⑨"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-plane-stride" id="ref-for-dom-plane-stride⑥"><c- g>stride</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦⓪"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-plane-rows" id="ref-for-dom-plane-rows⑤"><c- g>rows</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦①"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-plane-length" id="ref-for-dom-plane-length④"><c- g>length</c-></a>;
-
-  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined③⓪"><c- b>undefined</c-></a> <a class="idl-code" data-link-type="method" href="#dom-plane-readinto" id="ref-for-dom-plane-readinto"><c- g>readInto</c-></a>(<a data-link-type="idl-name" href="https://heycam.github.io/webidl/#ArrayBufferView" id="ref-for-ArrayBufferView"><c- n>ArrayBufferView</c-></a> <dfn class="idl-code" data-dfn-for="Plane/readInto(dst)" data-dfn-type="argument" data-export id="dom-plane-readinto-dst-dst"><code><c- g>dst</c-></code><a class="self-link" href="#dom-plane-readinto-dst-dst"></a></dfn>);
+   <h3 class="heading settled" data-level="9.5" id="videoframe-copyto-options"><span class="secno">9.5. </span><span class="content">VideoFrame CopyTo() Options</span><a class="self-link" href="#videoframe-copyto-options"></a></h3>
+    Options to specify which <code class="idl"><a data-link-type="idl" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect⑨">VideoFrameRect</a></code> to copy and the offset and
+stride of planes in the destination buffer. 
+<pre class="idl highlight def"><c- b>dictionary</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="dictionary" data-export id="dictdef-videoframecopytooptions"><code><c- g>VideoFrameCopyToOptions</c-></code></dfn> {
+  <a data-link-type="idl-name" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect①⓪"><c- n>VideoFrameRect</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="VideoFrameRect " href="#dom-videoframecopytooptions-rect" id="ref-for-dom-videoframecopytooptions-rect②"><c- g>rect</c-></a>;
+  <a data-link-type="dfn" href="https://heycam.github.io/webidl/#idl-sequence" id="ref-for-idl-sequence②"><c- b>sequence</c-></a>&lt;<a data-link-type="idl-name" href="#dictdef-planelayout" id="ref-for-dictdef-planelayout②"><c- n>PlaneLayout</c-></a>> <a class="idl-code" data-link-type="dict-member" data-type="sequence<PlaneLayout> " href="#dom-videoframecopytooptions-layout" id="ref-for-dom-videoframecopytooptions-layout③"><c- g>layout</c-></a>;
 };
-
-<c- b>dictionary</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="dictionary" data-export id="dictdef-planeinit"><code><c- g>PlaneInit</c-></code></dfn> {
-  <c- b>required</c-> <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource①⓪"><c- n>BufferSource</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="PlaneInit" data-dfn-type="dict-member" data-export data-type="BufferSource " id="dom-planeinit-src"><code><c- g>src</c-></code></dfn>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③①"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦②"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="idl-code" data-dfn-for="PlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-planeinit-stride"><code><c- g>stride</c-></code><a class="self-link" href="#dom-planeinit-stride"></a></dfn>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③②"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦③"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="dfn-paneled idl-code" data-dfn-for="PlaneInit" data-dfn-type="dict-member" data-export data-type="unsigned long " id="dom-planeinit-rows"><code><c- g>rows</c-></code></dfn>;
+</pre>
+   <div class="note" role="note">
+     NOTE: The steps of <code class="idl"><a data-link-type="idl" href="#dom-videoframe-copyto" id="ref-for-dom-videoframe-copyto④">copyTo()</a></code> or <code class="idl"><a data-link-type="idl" href="#dom-videoframe-allocationsize" id="ref-for-dom-videoframe-allocationsize②">allocationSize()</a></code> will enforce the following requirements: 
+    <ul>
+     <li data-md>
+      <p>The coordinates of <code class="idl"><a data-link-type="idl" href="#dom-videoframecopytooptions-rect" id="ref-for-dom-videoframecopytooptions-rect③">rect</a></code> must be
+sample-aligned as determiend by <code class="idl"><a data-link-type="idl" href="#dom-videoframe-format-slot" id="ref-for-dom-videoframe-format-slot①⑤">[[format]]</a></code>.</p>
+     <li data-md>
+      <p>If <code class="idl"><a data-link-type="idl" href="#dom-videoframecopytooptions-layout" id="ref-for-dom-videoframecopytooptions-layout④">layout</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists①④">exists</a>, a <code class="idl"><a data-link-type="idl" href="#dictdef-planelayout" id="ref-for-dictdef-planelayout③">PlaneLayout</a></code> must be provided for all planes.</p>
+    </ul>
+   </div>
+   <dl>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrameCopyToOptions" data-dfn-type="dict-member" data-export id="dom-videoframecopytooptions-rect"><code>rect</code></dfn>, <span> of type <a data-link-type="idl-name" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect①①">VideoFrameRect</a></span>
+    <dd data-md>
+     <p>The <code class="idl"><a data-link-type="idl" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect①②">VideoFrameRect</a></code> describing the rectangle of pixels to copy from the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③④">VideoFrame</a></code>. If unspecified, the <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visiblerect" id="ref-for-dom-videoframe-visiblerect⑥">visibleRect</a></code> will be used.</p>
+     <p class="note" role="note"><span>NOTE:</span> The coded rectangle can be specified by passing <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③⑤">VideoFrame</a></code>'s <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedrect" id="ref-for-dom-videoframe-codedrect②">codedRect</a></code>.</p>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrameCopyToOptions" data-dfn-type="dict-member" data-export id="dom-videoframecopytooptions-layout"><code>layout</code></dfn>, <span> of type sequence&lt;<a data-link-type="idl-name" href="#dictdef-planelayout" id="ref-for-dictdef-planelayout④">PlaneLayout</a>></span>
+    <dd data-md>
+     <p>The <code class="idl"><a data-link-type="idl" href="#dictdef-planelayout" id="ref-for-dictdef-planelayout⑤">PlaneLayout</a></code> for each plane in <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③⑥">VideoFrame</a></code>, affording the option
+to specify an offset and stride for each plane in the destination <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource①③">BufferSource</a></code>. If unspecified, the planes will be tightly packed. It is
+invalid to specify planes that overlap.</p>
+   </dl>
+   <h3 class="heading settled" data-level="9.6" id="videoframe-rect"><span class="secno">9.6. </span><span class="content">VideoFrame Rectangle (Rect)</span><a class="self-link" href="#videoframe-rect"></a></h3>
+    A <code class="idl"><a data-link-type="idl" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect①③">VideoFrameRect</a></code> is a dictionary specifying the position and dimensions of
+a rectangle of pixels within a <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③⑦">VideoFrame</a></code>. <code class="idl"><a data-link-type="idl" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect①④">VideoFrameRect</a></code> is used with <code class="idl"><a data-link-type="idl" href="#dom-videoframe-copyto" id="ref-for-dom-videoframe-copyto⑤">copyTo()</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-allocationsize" id="ref-for-dom-videoframe-allocationsize③">allocationSize()</a></code> to describe the
+dimensions of the source rectangle. <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③⑧">VideoFrame</a></code> defines <code class="idl"><a data-link-type="idl" href="#dom-videoframe-codedrect" id="ref-for-dom-videoframe-codedrect③">codedRect</a></code> and <code class="idl"><a data-link-type="idl" href="#dom-videoframe-visiblerect" id="ref-for-dom-videoframe-visiblerect⑦">visibleRect</a></code> for convenient copying
+ of the coded size and visible region respectively. 
+<pre class="idl highlight def"><c- b>dictionary</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="dictionary" data-export id="dictdef-videoframerect"><code><c- g>VideoFrameRect</c-></code></dfn> {
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange②⑨"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥⑧"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-videoframerect-left" id="ref-for-dom-videoframerect-left⑥"><c- g>left</c-></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③⓪"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑥⑨"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-videoframerect-top" id="ref-for-dom-videoframerect-top⑥"><c- g>top</c-></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③①"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦⓪"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-videoframerect-width" id="ref-for-dom-videoframerect-width⑨"><c- g>width</c-></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③②"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦①"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-videoframerect-height" id="ref-for-dom-videoframerect-height⑨"><c- g>height</c-></a>;
 };
 </pre>
-   <h4 class="heading settled" data-level="9.5.1" id="plane-internal-slots"><span class="secno">9.5.1. </span><span class="content">Internal Slots</span><a class="self-link" href="#plane-internal-slots"></a></h4>
    <dl>
-    <dt><dfn class="dfn-paneled idl-code" data-dfn-for="Plane" data-dfn-type="attribute" data-export id="dom-plane-parent-frame-slot"><code>[[parent frame]]</code></dfn>
-    <dd>Refers to the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③⑨">VideoFrame</a></code> that constructed and owns this plane.
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrameRect" data-dfn-type="dict-member" data-export id="dom-videoframerect-left"><code>left</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦②">unsigned long</a></span>
+    <dd data-md>
+     <p>The left offset in pixels for this <code class="idl"><a data-link-type="idl" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect①⑤">VideoFrameRect</a></code>.</p>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrameRect" data-dfn-type="dict-member" data-export id="dom-videoframerect-top"><code>top</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦③">unsigned long</a></span>
+    <dd data-md>
+     <p>The top offset in pixels for this <code class="idl"><a data-link-type="idl" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect①⑥">VideoFrameRect</a></code>.</p>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrameRect" data-dfn-type="dict-member" data-export id="dom-videoframerect-width"><code>width</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦④">unsigned long</a></span>
+    <dd data-md>
+     <p>The width in pixels for this <code class="idl"><a data-link-type="idl" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect①⑦">VideoFrameRect</a></code>.</p>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="VideoFrameRect" data-dfn-type="dict-member" data-export id="dom-videoframerect-height"><code>height</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦⑤">unsigned long</a></span>
+    <dd data-md>
+     <p>The height in pixels for this <code class="idl"><a data-link-type="idl" href="#dictdef-videoframerect" id="ref-for-dictdef-videoframerect①⑧">VideoFrameRect</a></code>.</p>
    </dl>
-   <h4 class="heading settled" data-level="9.5.2" id="plane-attributes"><span class="secno">9.5.2. </span><span class="content">Attributes</span><a class="self-link" href="#plane-attributes"></a></h4>
+   <h3 class="heading settled" data-level="9.7" id="plane-layout"><span class="secno">9.7. </span><span class="content">Plane Layout</span><a class="self-link" href="#plane-layout"></a></h3>
+    A <code class="idl"><a data-link-type="idl" href="#dictdef-planelayout" id="ref-for-dictdef-planelayout⑥">PlaneLayout</a></code> is a dictionary specifying the offset and stride of a <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe③⑨">VideoFrame</a></code> plane once copied to a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource①④">BufferSource</a></code>. A sequence of <code class="idl"><a data-link-type="idl" href="#dictdef-planelayout" id="ref-for-dictdef-planelayout⑦">PlaneLayout</a></code>s may be provided to <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe④⓪">VideoFrame</a></code>'s <code class="idl"><a data-link-type="idl" href="#dom-videoframe-copyto" id="ref-for-dom-videoframe-copyto⑥">copyTo()</a></code> to
+specify how the plane is laid out in the destination <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource①⑤">BufferSource</a></code>}.
+Alternatively, callers can inspect <code class="idl"><a data-link-type="idl" href="#dom-videoframe-copyto" id="ref-for-dom-videoframe-copyto⑦">copyTo()</a></code>'s returned sequence
+of <code class="idl"><a data-link-type="idl" href="#dictdef-planelayout" id="ref-for-dictdef-planelayout⑧">PlaneLayout</a></code>s to learn the the offset and stride for planes as decided by
+the user agent. 
+<pre class="idl highlight def"><c- b>dictionary</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="dictionary" data-export id="dictdef-planelayout"><code><c- g>PlaneLayout</c-></code></dfn> {
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③③"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦⑥"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-planelayout-offset" id="ref-for-dom-planelayout-offset①"><c- g>offset</c-></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③④"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦⑦"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-planelayout-stride" id="ref-for-dom-planelayout-stride②"><c- g>stride</c-></a>;
+};
+</pre>
    <dl>
-    <dt><dfn class="dfn-paneled idl-code" data-dfn-for="Plane" data-dfn-type="attribute" data-export id="dom-plane-stride"><code>stride</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦④">unsigned long</a>, readonly</span>
-    <dd>The width of each row including any padding.
-    <dt><dfn class="dfn-paneled idl-code" data-dfn-for="Plane" data-dfn-type="attribute" data-export id="dom-plane-rows"><code>rows</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦⑤">unsigned long</a>, readonly</span>
-    <dd>The number of rows.
-    <dt><dfn class="dfn-paneled idl-code" data-dfn-for="Plane" data-dfn-type="attribute" data-export id="dom-plane-length"><code>length</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦⑥">unsigned long</a>, readonly</span>
-    <dd>The total byte length of the plane (stride * rows).
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="PlaneLayout" data-dfn-type="dict-member" data-export id="dom-planelayout-offset"><code>offset</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦⑧">unsigned long</a></span>
+    <dd data-md>
+     <p>The offset in bytes where the given plane begins within a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource①⑥">BufferSource</a></code>.</p>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="PlaneLayout" data-dfn-type="dict-member" data-export id="dom-planelayout-stride"><code>stride</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦⑨">unsigned long</a></span>
+    <dd data-md>
+     <p>The number of bytes, including padding, used by each row of the plane within
+a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource①⑦">BufferSource</a></code>.</p>
    </dl>
-   <h4 class="heading settled" data-level="9.5.3" id="plane-methods"><span class="secno">9.5.3. </span><span class="content">Methods</span><a class="self-link" href="#plane-methods"></a></h4>
-    <dfn class="dfn-paneled idl-code" data-dfn-for="Plane" data-dfn-type="method" data-export id="dom-plane-readinto"><code>readInto(<var>dst</var>)</code></dfn> 
-   <p>Copies the plane data into dst.</p>
-   <p>When invoked, run these steps:</p>
-   <ol>
-    <li data-md>
-     <p>If <code class="idl"><a data-link-type="idl" href="#dom-plane-parent-frame-slot" id="ref-for-dom-plane-parent-frame-slot③">[[parent frame]]</a></code> has been destroyed, throw an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror②②">InvalidStateError</a></code>.</p>
-    <li data-md>
-     <p>If <code class="idl"><a data-link-type="idl" href="#dom-plane-length" id="ref-for-dom-plane-length⑤">length</a></code> is greater than |<code>dst.byteLength</code>|, throw a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror①⑥">TypeError</a></code>.</p>
-    <li data-md>
-     <p>Let <var>resource</var> be the <a data-link-type="dfn" href="#media-resource" id="ref-for-media-resource②②">media resource</a> referenced by <code class="idl"><a data-link-type="idl" href="#dom-plane-parent-frame-slot" id="ref-for-dom-plane-parent-frame-slot④">[[parent frame]]</a></code>'s <code class="idl"><a data-link-type="idl" href="#dom-videoframe-resource-reference-slot" id="ref-for-dom-videoframe-resource-reference-slot⑧">[[resource reference]]</a></code>.</p>
-    <li data-md>
-     <p>Let <var>plane bytes</var> be the region of bytes in <a data-link-type="dfn" href="#media-resource" id="ref-for-media-resource②③">media resource</a> corresponding
-to this plane.</p>
-    <li data-md>
-     <p>Copy the <var>plane bytes</var> into <var>dst</var>.</p>
-   </ol>
-   <h3 class="heading settled" data-level="9.6" id="pixel-format"><span class="secno">9.6. </span><span class="content">Pixel Format</span><a class="self-link" href="#pixel-format"></a></h3>
+   <h3 class="heading settled" data-level="9.8" id="pixel-format"><span class="secno">9.8. </span><span class="content">Pixel Format</span><a class="self-link" href="#pixel-format"></a></h3>
     Pixel formats describe the arrangement of bytes in each plane as well as the
 number and order of the planes. 
    <p class="note" role="note"><span>NOTE:</span> This section needs work. We expect to add more pixel formats and offer
@@ -3639,21 +3984,21 @@ <h3 class="heading settled" data-level="10.1" id="image-decoding-background"><sp
 corresponding file format. Hence image decoders often perform both duties of
 unpacking (demuxing) as well as decoding the encoded image data. The WebCodecs <code class="idl"><a data-link-type="idl" href="#imagedecoder" id="ref-for-imagedecoder">ImageDecoder</a></code> follows this pattern, which motivates an interface design that
 is notably different from that of <code class="idl"><a data-link-type="idl" href="#videodecoder" id="ref-for-videodecoder②">VideoDecoder</a></code> and <code class="idl"><a data-link-type="idl" href="#audiodecoder" id="ref-for-audiodecoder②">AudioDecoder</a></code>.</p>
-   <p>In spite of these differences, <code class="idl"><a data-link-type="idl" href="#imagedecoder" id="ref-for-imagedecoder①">ImageDecoder</a></code> uses the same <a data-link-type="dfn" href="#codec-processing-model" id="ref-for-codec-processing-model">codec processing model</a> as the other codec interfaces. Additionally, <code class="idl"><a data-link-type="idl" href="#imagedecoder" id="ref-for-imagedecoder②">ImageDecoder</a></code> uses the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe④⓪">VideoFrame</a></code> interface to describe decoded outputs.</p>
+   <p>In spite of these differences, <code class="idl"><a data-link-type="idl" href="#imagedecoder" id="ref-for-imagedecoder①">ImageDecoder</a></code> uses the same <a data-link-type="dfn" href="#codec-processing-model" id="ref-for-codec-processing-model">codec processing model</a> as the other codec interfaces. Additionally, <code class="idl"><a data-link-type="idl" href="#imagedecoder" id="ref-for-imagedecoder②">ImageDecoder</a></code> uses the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe④①">VideoFrame</a></code> interface to describe decoded outputs.</p>
    <h3 class="heading settled" data-level="10.2" id="imagedecoder-interface"><span class="secno">10.2. </span><span class="content">ImageDecoder Interface</span><a class="self-link" href="#imagedecoder-interface"></a></h3>
-<pre class="idl highlight def">[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed" id="ref-for-Exposed⑨"><c- g>Exposed</c-></a>=(<c- n>Window</c->,<c- n>DedicatedWorker</c->)]
+<pre class="idl highlight def">[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed" id="ref-for-Exposed⑧"><c- g>Exposed</c-></a>=(<c- n>Window</c->,<c- n>DedicatedWorker</c->)]
 <c- b>interface</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="interface" data-export id="imagedecoder"><code><c- g>ImageDecoder</c-></code></dfn> {
   <a class="idl-code" data-link-type="constructor" href="#dom-imagedecoder-imagedecoder" id="ref-for-dom-imagedecoder-imagedecoder"><c- g>constructor</c-></a>(<a data-link-type="idl-name" href="#dictdef-imagedecoderinit" id="ref-for-dictdef-imagedecoderinit"><c- n>ImageDecoderInit</c-></a> <dfn class="idl-code" data-dfn-for="ImageDecoder/ImageDecoder(init), ImageDecoder/constructor(init)" data-dfn-type="argument" data-export id="dom-imagedecoder-imagedecoder-init-init"><code><c- g>init</c-></code><a class="self-link" href="#dom-imagedecoder-imagedecoder-init-init"></a></dfn>);
 
   <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-boolean" id="ref-for-idl-boolean①①"><c- b>boolean</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="boolean" href="#dom-imagedecoder-complete" id="ref-for-dom-imagedecoder-complete"><c- g>complete</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise⑧"><c- b>Promise</c-></a>&lt;<a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined③①"><c- b>undefined</c-></a>> <a class="idl-code" data-link-type="attribute" data-readonly data-type="Promise<undefined>" href="#dom-imagedecoder-completed" id="ref-for-dom-imagedecoder-completed"><c- g>completed</c-></a>;
+  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①⓪"><c- b>Promise</c-></a>&lt;<a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined③⓪"><c- b>undefined</c-></a>> <a class="idl-code" data-link-type="attribute" data-readonly data-type="Promise<undefined>" href="#dom-imagedecoder-completed" id="ref-for-dom-imagedecoder-completed"><c- g>completed</c-></a>;
   <c- b>readonly</c-> <c- b>attribute</c-> <a data-link-type="idl-name" href="#imagetracklist" id="ref-for-imagetracklist"><c- n>ImageTrackList</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="ImageTrackList" href="#dom-imagedecoder-tracks" id="ref-for-dom-imagedecoder-tracks"><c- g>tracks</c-></a>;
 
-  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise⑨"><c- b>Promise</c-></a>&lt;<a data-link-type="idl-name" href="#dictdef-imagedecoderesult" id="ref-for-dictdef-imagedecoderesult"><c- n>ImageDecodeResult</c-></a>> <a class="idl-code" data-link-type="method" href="#dom-imagedecoder-decode" id="ref-for-dom-imagedecoder-decode"><c- g>decode</c-></a>(<c- b>optional</c-> <a data-link-type="idl-name" href="#dictdef-imagedecodeoptions" id="ref-for-dictdef-imagedecodeoptions"><c- n>ImageDecodeOptions</c-></a> <dfn class="idl-code" data-dfn-for="ImageDecoder/decode(options), ImageDecoder/decode()" data-dfn-type="argument" data-export id="dom-imagedecoder-decode-options-options"><code><c- g>options</c-></code><a class="self-link" href="#dom-imagedecoder-decode-options-options"></a></dfn> = {});
-  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined③②"><c- b>undefined</c-></a> <a class="idl-code" data-link-type="method" href="#dom-imagedecoder-reset" id="ref-for-dom-imagedecoder-reset"><c- g>reset</c-></a>();
-  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined③③"><c- b>undefined</c-></a> <a class="idl-code" data-link-type="method" href="#dom-imagedecoder-close" id="ref-for-dom-imagedecoder-close"><c- g>close</c-></a>();
+  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①①"><c- b>Promise</c-></a>&lt;<a data-link-type="idl-name" href="#dictdef-imagedecoderesult" id="ref-for-dictdef-imagedecoderesult"><c- n>ImageDecodeResult</c-></a>> <a class="idl-code" data-link-type="method" href="#dom-imagedecoder-decode" id="ref-for-dom-imagedecoder-decode"><c- g>decode</c-></a>(<c- b>optional</c-> <a data-link-type="idl-name" href="#dictdef-imagedecodeoptions" id="ref-for-dictdef-imagedecodeoptions"><c- n>ImageDecodeOptions</c-></a> <dfn class="idl-code" data-dfn-for="ImageDecoder/decode(options), ImageDecoder/decode()" data-dfn-type="argument" data-export id="dom-imagedecoder-decode-options-options"><code><c- g>options</c-></code><a class="self-link" href="#dom-imagedecoder-decode-options-options"></a></dfn> = {});
+  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined③①"><c- b>undefined</c-></a> <a class="idl-code" data-link-type="method" href="#dom-imagedecoder-reset" id="ref-for-dom-imagedecoder-reset"><c- g>reset</c-></a>();
+  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined③②"><c- b>undefined</c-></a> <a class="idl-code" data-link-type="method" href="#dom-imagedecoder-close" id="ref-for-dom-imagedecoder-close"><c- g>close</c-></a>();
 
-  <c- b>static</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①⓪"><c- b>Promise</c-></a>&lt;<a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-boolean" id="ref-for-idl-boolean①②"><c- b>boolean</c-></a>> <a class="idl-code" data-link-type="method" href="#dom-imagedecoder-istypesupported" id="ref-for-dom-imagedecoder-istypesupported"><c- g>isTypeSupported</c-></a>(<a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString①⓪"><c- b>DOMString</c-></a> <dfn class="idl-code" data-dfn-for="ImageDecoder/isTypeSupported(type)" data-dfn-type="argument" data-export id="dom-imagedecoder-istypesupported-type-type"><code><c- g>type</c-></code><a class="self-link" href="#dom-imagedecoder-istypesupported-type-type"></a></dfn>);
+  <c- b>static</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①②"><c- b>Promise</c-></a>&lt;<a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-boolean" id="ref-for-idl-boolean①②"><c- b>boolean</c-></a>> <a class="idl-code" data-link-type="method" href="#dom-imagedecoder-istypesupported" id="ref-for-dom-imagedecoder-istypesupported"><c- g>isTypeSupported</c-></a>(<a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString①⓪"><c- b>DOMString</c-></a> <dfn class="idl-code" data-dfn-for="ImageDecoder/isTypeSupported(type)" data-dfn-type="argument" data-export id="dom-imagedecoder-istypesupported-type-type"><code><c- g>type</c-></code><a class="self-link" href="#dom-imagedecoder-istypesupported-type-type"></a></dfn>);
 };
 
 </pre>
@@ -3696,18 +4041,18 @@ <h4 class="heading settled" data-level="10.2.1" id="imagedecoder-internal-slots"
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecoder" data-dfn-type="attribute" data-export id="dom-imagedecoder-progressive-frame-generations-slot"><code>[[progressive frame generations]]</code></dfn>
     <dd data-md>
      <p>A mapping of frame indices to <a data-link-type="dfn" href="#progressive-image-frame-generation" id="ref-for-progressive-image-frame-generation">Progressive Image Frame Generations</a>. The
-values represent the Progressive Image Frame Generation for the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe④①">VideoFrame</a></code> which was most recently output by a call to <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-decode" id="ref-for-dom-imagedecoder-decode①">decode()</a></code> with the given frame index.</p>
+values represent the Progressive Image Frame Generation for the <code class="idl"><a data-link-type="idl" href="#videoframe" id="ref-for-videoframe④②">VideoFrame</a></code> which was most recently output by a call to <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-decode" id="ref-for-dom-imagedecoder-decode①">decode()</a></code> with the given frame index.</p>
    </dl>
    <h4 class="heading settled" data-level="10.2.2" id="imagedecoder-constructor"><span class="secno">10.2.2. </span><span class="content">Constructor</span><a class="self-link" href="#imagedecoder-constructor"></a></h4>
    <dl>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecoder" data-dfn-type="constructor" data-export data-lt="ImageDecoder(init)|constructor(init)" id="dom-imagedecoder-imagedecoder" title="ImageDecoder(init)"><code> ImageDecoder(init) </code></dfn>
     <dd data-md>
-     <p class="note" role="note"><span>NOTE:</span> Calling <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-decode" id="ref-for-dom-imagedecoder-decode②">decode()</a></code> on the constructed <code class="idl"><a data-link-type="idl" href="#imagedecoder" id="ref-for-imagedecoder③">ImageDecoder</a></code> will trigger a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#notsupportederror" id="ref-for-notsupportederror⑧">NotSupportedError</a></code> if the user agent does not support <var>type</var>. Authors should first check support by calling <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-istypesupported" id="ref-for-dom-imagedecoder-istypesupported①">isTypeSupported()</a></code> with <var>type</var>. User agents are not
+     <p class="note" role="note"><span>NOTE:</span> Calling <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-decode" id="ref-for-dom-imagedecoder-decode②">decode()</a></code> on the constructed <code class="idl"><a data-link-type="idl" href="#imagedecoder" id="ref-for-imagedecoder③">ImageDecoder</a></code> will trigger a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#notsupportederror" id="ref-for-notsupportederror①⓪">NotSupportedError</a></code> if the user agent does not support <var>type</var>. Authors should first check support by calling <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-istypesupported" id="ref-for-dom-imagedecoder-istypesupported①">isTypeSupported()</a></code> with <var>type</var>. User agents are not
 required to support any particular type.</p>
      <p>When invoked, run these steps:</p>
      <ol>
       <li data-md>
-       <p>If <var>init</var> is not <a data-link-type="dfn" href="#valid-imagedecoderinit" id="ref-for-valid-imagedecoderinit">valid ImageDecoderInit</a>, throw a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror①⑦">TypeError</a></code>.</p>
+       <p>If <var>init</var> is not <a data-link-type="dfn" href="#valid-imagedecoderinit" id="ref-for-valid-imagedecoderinit">valid ImageDecoderInit</a>, throw a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror②⑥">TypeError</a></code>.</p>
       <li data-md>
        <p>Let <var>d</var> be a new <code class="idl"><a data-link-type="idl" href="#imagedecoder" id="ref-for-imagedecoder④">ImageDecoder</a></code> object. In the steps below, all
 mentions of <code class="idl"><a data-link-type="idl" href="#imagedecoder" id="ref-for-imagedecoder⑤">ImageDecoder</a></code> members apply to <var>d</var> unless stated
@@ -3723,7 +4068,7 @@ <h4 class="heading settled" data-level="10.2.2" id="imagedecoder-constructor"><s
       <li data-md>
        <p>Assign <code>null</code> to <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-codec-implementation-slot" id="ref-for-dom-imagedecoder-codec-implementation-slot">[[codec implementation]]</a></code>.</p>
       <li data-md>
-       <p>If <code>init.preferAnimation</code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists①①">exists</a>, assign <code>init.preferAnimation</code> to the <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-prefer-animation-slot" id="ref-for-dom-imagedecoder-prefer-animation-slot">[[prefer animation]]</a></code> internal slot. Otherwise,
+       <p>If <code>init.preferAnimation</code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists①⑤">exists</a>, assign <code>init.preferAnimation</code> to the <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-prefer-animation-slot" id="ref-for-dom-imagedecoder-prefer-animation-slot">[[prefer animation]]</a></code> internal slot. Otherwise,
 assign 'null' to <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-prefer-animation-slot" id="ref-for-dom-imagedecoder-prefer-animation-slot①">[[prefer animation]]</a></code> internal slot.</p>
       <li data-md>
        <p>Assign a new <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#lists" id="ref-for-lists①②">list</a> to <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-pending-decode-promises-slot" id="ref-for-dom-imagedecoder-pending-decode-promises-slot">[[pending decode promises]]</a></code>.</p>
@@ -3754,7 +4099,7 @@ <h4 class="heading settled" data-level="10.2.2" id="imagedecoder-constructor"><s
        <p>Otherwise:</p>
        <ol>
         <li data-md>
-         <p>Assert that <code>init.data</code> is of type <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource①①">BufferSource</a></code>.</p>
+         <p>Assert that <code>init.data</code> is of type <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource①⑧">BufferSource</a></code>.</p>
         <li data-md>
          <p>Assign a copy of <code>init.data</code> to <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-encoded-data-slot" id="ref-for-dom-imagedecoder-encoded-data-slot④">[[encoded data]]</a></code>.</p>
         <li data-md>
@@ -3775,9 +4120,9 @@ <h4 class="heading settled" data-level="10.2.2" id="imagedecoder-constructor"><s
        <p>Let <var>supported</var> be the result of running the <a data-link-type="dfn" href="#imagedecoder-check-type-support" id="ref-for-imagedecoder-check-type-support">Check Type
 Support</a> algorithm with <code>init.type</code>.</p>
       <li data-md>
-       <p>If <var>supported</var> is <code>false</code>, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread②⑦">control thread</a> event
+       <p>If <var>supported</var> is <code>false</code>, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread②⑧">control thread</a> event
 loop to run the <a data-link-type="dfn" href="#imagedecoder-close-imagedecoder" id="ref-for-imagedecoder-close-imagedecoder">Close ImageDecoder</a> algorithm
-with a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#notsupportederror" id="ref-for-notsupportederror⑨">NotSupportedError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①②">DOMException</a></code> and abort
+with a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#notsupportederror" id="ref-for-notsupportederror①①">NotSupportedError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException②⑥">DOMException</a></code> and abort
 these steps.</p>
       <li data-md>
        <p>If <var>supported</var> is <code>true</code>, assign the <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-codec-implementation-slot" id="ref-for-dom-imagedecoder-codec-implementation-slot①">[[codec implementation]]</a></code> internal slot with an
@@ -3799,7 +4144,7 @@ <h4 class="heading settled" data-level="10.2.3" id="imagedecoder-attributes"><sp
     <dd data-md>
      <p>Indicates whether <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-encoded-data-slot" id="ref-for-dom-imagedecoder-encoded-data-slot⑤">[[encoded data]]</a></code> is completely buffered.</p>
      <p>The <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-complete" id="ref-for-dom-imagedecoder-complete①">complete</a></code> getter steps are to return <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-complete-slot" id="ref-for-dom-imagedecoder-complete-slot③">[[complete]]</a></code>.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecoder" data-dfn-type="attribute" data-export id="dom-imagedecoder-completed"><code>completed</code></dfn>, <span> of type Promise&lt;<a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined③④">undefined</a>>, readonly</span>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecoder" data-dfn-type="attribute" data-export id="dom-imagedecoder-completed"><code>completed</code></dfn>, <span> of type Promise&lt;<a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined③③">undefined</a>>, readonly</span>
     <dd data-md>
      <p>The promise used to signal when <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-complete" id="ref-for-dom-imagedecoder-complete②">complete</a></code> becomes <code>true</code>.</p>
      <p>The <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-completed" id="ref-for-dom-imagedecoder-completed①">completed</a></code> getter steps are to return <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-completed-promise-slot" id="ref-for-dom-imagedecoder-completed-promise-slot①">[[completed promise]]</a></code>.</p>
@@ -3817,13 +4162,13 @@ <h4 class="heading settled" data-level="10.2.4" id="imagedecoder-methods"><span
      <p>When invoked, run these steps:</p>
      <ol>
       <li data-md>
-       <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-closed-slot" id="ref-for-dom-imagedecoder-closed-slot①">[[closed]]</a></code> is <code>true</code>, return a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①①">Promise</a></code> rejected with an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror②③">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①③">DOMException</a></code>.</p>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-closed-slot" id="ref-for-dom-imagedecoder-closed-slot①">[[closed]]</a></code> is <code>true</code>, return a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①③">Promise</a></code> rejected with an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror②②">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException②⑦">DOMException</a></code>.</p>
       <li data-md>
-       <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-imagetracklist-slot" id="ref-for-dom-imagedecoder-imagetracklist-slot③">[[ImageTrackList]]</a></code>'s <code class="idl"><a data-link-type="idl" href="#dom-imagetracklist-selected-index-slot" id="ref-for-dom-imagetracklist-selected-index-slot①">[[selected index]]</a></code> is '-1', return a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①②">Promise</a></code> rejected with an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror②④">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①④">DOMException</a></code>.</p>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-imagetracklist-slot" id="ref-for-dom-imagedecoder-imagetracklist-slot③">[[ImageTrackList]]</a></code>'s <code class="idl"><a data-link-type="idl" href="#dom-imagetracklist-selected-index-slot" id="ref-for-dom-imagetracklist-selected-index-slot①">[[selected index]]</a></code> is '-1', return a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①④">Promise</a></code> rejected with an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror②③">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException②⑧">DOMException</a></code>.</p>
       <li data-md>
        <p>If <var>options</var> is <code>undefined</code>, assign a new <code class="idl"><a data-link-type="idl" href="#dictdef-imagedecodeoptions" id="ref-for-dictdef-imagedecodeoptions①">ImageDecodeOptions</a></code> to <var>options</var>.</p>
       <li data-md>
-       <p>Let <var>promise</var> be a new <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①③">Promise</a></code>.</p>
+       <p>Let <var>promise</var> be a new <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①⑤">Promise</a></code>.</p>
       <li data-md>
        <p><a data-link-type="dfn" href="#enqueues-a-control-message" id="ref-for-enqueues-a-control-message②①">Queue a control message</a> to decode the image with <var>options</var>, and <var>promise</var>.</p>
       <li data-md>
@@ -3847,13 +4192,13 @@ <h4 class="heading settled" data-level="10.2.4" id="imagedecoder-methods"><span
     <dd data-md>
      <p>Immediately aborts all pending work.</p>
      <p>When invoked, run the <a data-link-type="dfn" href="#imagedecoder-reset-imagedecoder" id="ref-for-imagedecoder-reset-imagedecoder">Reset ImageDecoder</a> algorithm with
-and <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①⑤">DOMException</a></code>.</p>
+an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror①②">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException②⑨">DOMException</a></code>.</p>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecoder" data-dfn-type="method" data-export id="dom-imagedecoder-close"><code>close()</code></dfn>
     <dd data-md>
      <p>Immediately aborts all pending work and releases system resources. Close is
 final.</p>
      <p>When invoked, run the <a data-link-type="dfn" href="#imagedecoder-close-imagedecoder" id="ref-for-imagedecoder-close-imagedecoder①">Close ImageDecoder</a> algorithm with
-and <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror①">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①⑥">DOMException</a></code>.</p>
+an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#aborterror" id="ref-for-aborterror①③">AbortError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException③⓪">DOMException</a></code>.</p>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecoder" data-dfn-type="method" data-export id="dom-imagedecoder-istypesupported"><code>isTypeSupported(type)</code></dfn>
     <dd data-md>
      <p>Returns a promise indicating whether the provided config is supported by the
@@ -3861,9 +4206,9 @@ <h4 class="heading settled" data-level="10.2.4" id="imagedecoder-methods"><span
      <p>When invoked, run these steps:</p>
      <ol>
       <li data-md>
-       <p>If <var>type</var> is not a <a data-link-type="dfn" href="#valid-image-mime-type" id="ref-for-valid-image-mime-type">valid image MIME type</a>, return a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①④">Promise</a></code> rejected with <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror①⑧">TypeError</a></code>.</p>
+       <p>If <var>type</var> is not a <a data-link-type="dfn" href="#valid-image-mime-type" id="ref-for-valid-image-mime-type">valid image MIME type</a>, return a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①⑥">Promise</a></code> rejected with <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-typeerror" id="ref-for-exceptiondef-typeerror②⑦">TypeError</a></code>.</p>
       <li data-md>
-       <p>Let <var>p</var> be a new <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①⑤">Promise</a></code>.</p>
+       <p>Let <var>p</var> be a new <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①⑦">Promise</a></code>.</p>
       <li data-md>
        <p>In parallel, resolve <var>p</var> with the result of running the <a data-link-type="dfn" href="#imagedecoder-check-type-support" id="ref-for-imagedecoder-check-type-support①">Check Type Support</a> algorithm with <var>type</var>.</p>
       <li data-md>
@@ -3885,7 +4230,7 @@ <h4 class="heading settled" data-level="10.2.5" id="imagedecoder-algorithms"><sp
           <li data-md>
            <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-closed-slot" id="ref-for-dom-imagedecoder-closed-slot②">[[closed]]</a></code> is <code>true</code>, abort these steps.</p>
           <li data-md>
-           <p>If <var>chunk</var> is not a Uint8Array object, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread②⑧">control thread</a> event loop to run the <a data-link-type="dfn" href="#imagedecoder-close-imagedecoder" id="ref-for-imagedecoder-close-imagedecoder②">Close ImageDecoder</a> algorithm with a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#dataerror" id="ref-for-dataerror④">DataError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①⑦">DOMException</a></code> and abort these steps.</p>
+           <p>If <var>chunk</var> is not a Uint8Array object, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread②⑨">control thread</a> event loop to run the <a data-link-type="dfn" href="#imagedecoder-close-imagedecoder" id="ref-for-imagedecoder-close-imagedecoder②">Close ImageDecoder</a> algorithm with a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#dataerror" id="ref-for-dataerror④">DataError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException③①">DOMException</a></code> and abort these steps.</p>
           <li data-md>
            <p>Let <var>bytes</var> be the byte sequence represented by the Uint8Array
 object.</p>
@@ -3910,7 +4255,7 @@ <h4 class="heading settled" data-level="10.2.5" id="imagedecoder-algorithms"><sp
         <dd data-md>
          <ol>
           <li data-md>
-           <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread②⑨">control thread</a> event loop to run the <a data-link-type="dfn" href="#imagedecoder-close-imagedecoder" id="ref-for-imagedecoder-close-imagedecoder③">Close ImageDecoder</a> algorithm with a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#notreadableerror" id="ref-for-notreadableerror">NotReadableError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①⑧">DOMException</a></code></p>
+           <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread③⓪">control thread</a> event loop to run the <a data-link-type="dfn" href="#imagedecoder-close-imagedecoder" id="ref-for-imagedecoder-close-imagedecoder③">Close ImageDecoder</a> algorithm with a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#notreadableerror" id="ref-for-notreadableerror">NotReadableError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException③②">DOMException</a></code></p>
          </ol>
        </dl>
       <li data-md>
@@ -3927,12 +4272,12 @@ <h4 class="heading settled" data-level="10.2.5" id="imagedecoder-algorithms"><sp
 determine the number of tracks:</p>
        <ol>
         <li data-md>
-         <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-complete" id="ref-for-dom-imagedecoder-complete③">complete</a></code> is <code>true</code>, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread③⓪">control thread</a> event loop to run the <a data-link-type="dfn" href="#imagedecoder-close-imagedecoder" id="ref-for-imagedecoder-close-imagedecoder④">Close ImageDecoder</a> algorithm.</p>
+         <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-complete" id="ref-for-dom-imagedecoder-complete③">complete</a></code> is <code>true</code>, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread③①">control thread</a> event loop to run the <a data-link-type="dfn" href="#imagedecoder-close-imagedecoder" id="ref-for-imagedecoder-close-imagedecoder④">Close ImageDecoder</a> algorithm.</p>
         <li data-md>
          <p>Abort these steps.</p>
        </ol>
       <li data-md>
-       <p>If the number of tracks is found to be <code>0</code>, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread③①">control thread</a> event loop to run the <a data-link-type="dfn" href="#imagedecoder-close-imagedecoder" id="ref-for-imagedecoder-close-imagedecoder⑤">Close ImageDecoder</a> algorithm and abort these steps.</p>
+       <p>If the number of tracks is found to be <code>0</code>, queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread③②">control thread</a> event loop to run the <a data-link-type="dfn" href="#imagedecoder-close-imagedecoder" id="ref-for-imagedecoder-close-imagedecoder⑤">Close ImageDecoder</a> algorithm and abort these steps.</p>
       <li data-md>
        <p>Let <var>newTrackList</var> be a new <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#lists" id="ref-for-lists①④">list</a>.</p>
       <li data-md>
@@ -3976,7 +4321,7 @@ <h4 class="heading settled" data-level="10.2.5" id="imagedecoder-algorithms"><sp
       <li data-md>
        <p>Assign <code>true</code> to <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-tracks-established-slot" id="ref-for-dom-imagedecoder-tracks-established-slot④">[[tracks established]]</a></code>.</p>
       <li data-md>
-       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread③②">control thread</a> event loop to perform the
+       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread③③">control thread</a> event loop to perform the
 following steps:</p>
        <ol>
         <li data-md>
@@ -4014,8 +4359,8 @@ <h4 class="heading settled" data-level="10.2.5" id="imagedecoder-algorithms"><sp
      </ol>
     <dt data-md><dfn class="dfn-paneled" data-dfn-for="ImageDecoder" data-dfn-type="dfn" data-noexport id="imagedecoder-update-tracks">Update Tracks</dfn>
     <dd data-md>
-     <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="track-update-struct">track update struct</dfn> is a <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#struct" id="ref-for-struct">struct</a> that consists of a <dfn class="dfn-paneled" data-dfn-for="track update struct" data-dfn-type="dfn" data-noexport id="track-update-struct-track-index">track index</dfn> (<code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦⑦">unsigned long</a></code>)
-and a <dfn class="dfn-paneled" data-dfn-for="track update struct" data-dfn-type="dfn" data-noexport id="track-update-struct-frame-count">frame count</dfn> (<code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦⑧">unsigned long</a></code>).</p>
+     <p>A <dfn class="dfn-paneled" data-dfn-type="dfn" data-noexport id="track-update-struct">track update struct</dfn> is a <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#struct" id="ref-for-struct②">struct</a> that consists of a <dfn class="dfn-paneled" data-dfn-for="track update struct" data-dfn-type="dfn" data-noexport id="track-update-struct-track-index">track index</dfn> (<code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧⓪">unsigned long</a></code>)
+and a <dfn class="dfn-paneled" data-dfn-for="track update struct" data-dfn-type="dfn" data-noexport id="track-update-struct-frame-count">frame count</dfn> (<code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧①">unsigned long</a></code>).</p>
      <p>Run these steps:</p>
      <ol>
       <li data-md>
@@ -4045,7 +4390,7 @@ <h4 class="heading settled" data-level="10.2.5" id="imagedecoder-algorithms"><sp
       <li data-md>
        <p>If <var>tracksChanges</var> is <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#list-empty" id="ref-for-list-empty">empty</a>, abort these steps.</p>
       <li data-md>
-       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread③③">control thread</a> event loop to perform the
+       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread③④">control thread</a> event loop to perform the
 following steps:</p>
        <ol>
         <li data-md>
@@ -4196,7 +4541,7 @@ <h4 class="heading settled" data-level="10.2.5" id="imagedecoder-algorithms"><sp
     <dd data-md>
      <ol>
       <li data-md>
-       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread③④">control thread</a> event loop to run these steps:</p>
+       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread③⑤">control thread</a> event loop to run these steps:</p>
        <ol>
         <li data-md>
          <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-closed-slot" id="ref-for-dom-imagedecoder-closed-slot⑤">[[closed]]</a></code>, abort these steps.</p>
@@ -4214,9 +4559,9 @@ <h4 class="heading settled" data-level="10.2.5" id="imagedecoder-algorithms"><sp
       <li data-md>
        <p>Assert that <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-complete" id="ref-for-dom-imagedecoder-complete⑥">complete</a></code> is <code>true</code> or <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-closed-slot" id="ref-for-dom-imagedecoder-closed-slot⑥">[[closed]]</a></code> is <code>true</code>.</p>
       <li data-md>
-       <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-complete" id="ref-for-dom-imagedecoder-complete⑦">complete</a></code> is <code>true</code>, let <var>exception</var> be a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-rangeerror" id="ref-for-exceptiondef-rangeerror③">RangeError</a></code>. Otherwise, let <var>exception</var> be an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror②⑤">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException①⑨">DOMException</a></code>.</p>
+       <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-complete" id="ref-for-dom-imagedecoder-complete⑦">complete</a></code> is <code>true</code>, let <var>exception</var> be a <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#exceptiondef-rangeerror" id="ref-for-exceptiondef-rangeerror③">RangeError</a></code>. Otherwise, let <var>exception</var> be an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#invalidstateerror" id="ref-for-invalidstateerror②④">InvalidStateError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException③③">DOMException</a></code>.</p>
       <li data-md>
-       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread③⑤">control thread</a> event loop to run these steps:</p>
+       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread③⑥">control thread</a> event loop to run these steps:</p>
        <ol>
         <li data-md>
          <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-closed-slot" id="ref-for-dom-imagedecoder-closed-slot⑦">[[closed]]</a></code>, abort these steps.</p>
@@ -4232,12 +4577,12 @@ <h4 class="heading settled" data-level="10.2.5" id="imagedecoder-algorithms"><sp
     <dd data-md>
      <ol>
       <li data-md>
-       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread③⑥">control thread</a> event loop to run these steps:</p>
+       <p>Queue a task on the <a data-link-type="dfn" href="#control-thread" id="ref-for-control-thread③⑦">control thread</a> event loop to run these steps:</p>
        <ol>
         <li data-md>
          <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-closed-slot" id="ref-for-dom-imagedecoder-closed-slot⑧">[[closed]]</a></code>, abort these steps.</p>
         <li data-md>
-         <p>Run the <a data-link-type="dfn" href="#imagedecoder-close-imagedecoder" id="ref-for-imagedecoder-close-imagedecoder⑥">Close ImageDecoder</a> algorithm with an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#encodingerror" id="ref-for-encodingerror④">EncodingError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException②⓪">DOMException</a></code>.</p>
+         <p>Run the <a data-link-type="dfn" href="#imagedecoder-close-imagedecoder" id="ref-for-imagedecoder-close-imagedecoder⑥">Close ImageDecoder</a> algorithm with an <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#encodingerror" id="ref-for-encodingerror④">EncodingError</a></code> <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#idl-DOMException" id="ref-for-idl-DOMException③④">DOMException</a></code>.</p>
        </ol>
      </ol>
     <dt data-md><dfn class="dfn-paneled" data-dfn-for="ImageDecoder" data-dfn-type="dfn" data-noexport id="imagedecoder-check-type-support">Check Type Support</dfn> (with <var>type</var>)
@@ -4279,14 +4624,14 @@ <h4 class="heading settled" data-level="10.2.5" id="imagedecoder-algorithms"><sp
      </ol>
    </dl>
    <h3 class="heading settled" data-level="10.3" id="imagedecoderinit-interface"><span class="secno">10.3. </span><span class="content">ImageDecoderInit Interface</span><a class="self-link" href="#imagedecoderinit-interface"></a></h3>
-<pre class="idl highlight def"><c- b>typedef</c-> (<a data-link-type="idl-name" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource①②"><c- n>BufferSource</c-></a> <c- b>or</c-> <a data-link-type="idl-name" href="https://streams.spec.whatwg.org/#readablestream" id="ref-for-readablestream②"><c- n>ReadableStream</c-></a>) <dfn class="dfn-paneled idl-code" data-dfn-type="typedef" data-export id="typedefdef-imagebuffersource"><code><c- g>ImageBufferSource</c-></code></dfn>;
+<pre class="idl highlight def"><c- b>typedef</c-> (<a data-link-type="idl-name" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource①⑨"><c- n>BufferSource</c-></a> <c- b>or</c-> <a data-link-type="idl-name" href="https://streams.spec.whatwg.org/#readablestream" id="ref-for-readablestream②"><c- n>ReadableStream</c-></a>) <dfn class="dfn-paneled idl-code" data-dfn-type="typedef" data-export id="typedefdef-imagebuffersource"><code><c- g>ImageBufferSource</c-></code></dfn>;
 <c- b>dictionary</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="dictionary" data-export id="dictdef-imagedecoderinit"><code><c- g>ImageDecoderInit</c-></code></dfn> {
   <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString" id="ref-for-idl-DOMString①①"><c- b>DOMString</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="DOMString " href="#dom-imagedecoderinit-type" id="ref-for-dom-imagedecoderinit-type"><c- g>type</c-></a>;
   <c- b>required</c-> <a data-link-type="idl-name" href="#typedefdef-imagebuffersource" id="ref-for-typedefdef-imagebuffersource"><c- n>ImageBufferSource</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="ImageBufferSource " href="#dom-imagedecoderinit-data" id="ref-for-dom-imagedecoderinit-data③"><c- g>data</c-></a>;
   <a data-link-type="idl-name" href="https://html.spec.whatwg.org/multipage/imagebitmap-and-animations.html#premultiplyalpha" id="ref-for-premultiplyalpha"><c- n>PremultiplyAlpha</c-></a> <a class="idl-code" data-default="&quot;default&quot;" data-link-type="dict-member" data-type="PremultiplyAlpha " href="#dom-imagedecoderinit-premultiplyalpha" id="ref-for-dom-imagedecoderinit-premultiplyalpha①"><c- g>premultiplyAlpha</c-></a> = "default";
   <a data-link-type="idl-name" href="https://html.spec.whatwg.org/multipage/imagebitmap-and-animations.html#colorspaceconversion" id="ref-for-colorspaceconversion"><c- n>ColorSpaceConversion</c-></a> <a class="idl-code" data-default="&quot;default&quot;" data-link-type="dict-member" data-type="ColorSpaceConversion " href="#dom-imagedecoderinit-colorspaceconversion" id="ref-for-dom-imagedecoderinit-colorspaceconversion①"><c- g>colorSpaceConversion</c-></a> = "default";
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③③"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑦⑨"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-imagedecoderinit-desiredwidth" id="ref-for-dom-imagedecoderinit-desiredwidth①"><c- g>desiredWidth</c-></a>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③④"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧⓪"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-imagedecoderinit-desiredheight" id="ref-for-dom-imagedecoderinit-desiredheight①"><c- g>desiredHeight</c-></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③⑤"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧②"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-imagedecoderinit-desiredwidth" id="ref-for-dom-imagedecoderinit-desiredwidth①"><c- g>desiredWidth</c-></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③⑥"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧③"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-imagedecoderinit-desiredheight" id="ref-for-dom-imagedecoderinit-desiredheight①"><c- g>desiredHeight</c-></a>;
   <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-boolean" id="ref-for-idl-boolean①④"><c- b>boolean</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="boolean " href="#dom-imagedecoderinit-preferanimation" id="ref-for-dom-imagedecoderinit-preferanimation①"><c- g>preferAnimation</c-></a>;
 };
 
@@ -4299,7 +4644,7 @@ <h3 class="heading settled" data-level="10.3" id="imagedecoderinit-interface"><s
     <li data-md>
      <p>If <var>data</var> is of type <code class="idl"><a data-link-type="idl" href="https://streams.spec.whatwg.org/#readablestream" id="ref-for-readablestream③">ReadableStream</a></code> and the ReadableStream is <a data-link-type="dfn" href="https://streams.spec.whatwg.org/#is-readable-stream-disturbed" id="ref-for-is-readable-stream-disturbed">disturbed</a> or <a data-link-type="dfn" href="https://streams.spec.whatwg.org/#readablestream-locked" id="ref-for-readablestream-locked">locked</a>, return <code>false</code>.</p>
     <li data-md>
-     <p>If <var>data</var> is of type <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource①③">BufferSource</a></code>:</p>
+     <p>If <var>data</var> is of type <code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource②⓪">BufferSource</a></code>:</p>
      <ol>
       <li data-md>
        <p>If the result of running  IsDetachedBuffer (described in <a data-link-type="biblio" href="#biblio-ecmascript">[ECMASCRIPT]</a>) on <var>data</var> is <code>false</code>, return <code>false</code>.</p>
@@ -4307,9 +4652,9 @@ <h3 class="heading settled" data-level="10.3" id="imagedecoderinit-interface"><s
        <p>If <var>data</var> is <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#list-is-empty" id="ref-for-list-is-empty">empty</a>, return <code>false</code>.</p>
      </ol>
     <li data-md>
-     <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoderinit-desiredwidth" id="ref-for-dom-imagedecoderinit-desiredwidth②">desiredWidth</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists①②">exists</a> and <code class="idl"><a data-link-type="idl" href="#dom-imagedecoderinit-desiredheight" id="ref-for-dom-imagedecoderinit-desiredheight②">desiredHeight</a></code> does not exist, return <code>false</code>.</p>
+     <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoderinit-desiredwidth" id="ref-for-dom-imagedecoderinit-desiredwidth②">desiredWidth</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists①⑥">exists</a> and <code class="idl"><a data-link-type="idl" href="#dom-imagedecoderinit-desiredheight" id="ref-for-dom-imagedecoderinit-desiredheight②">desiredHeight</a></code> does not exist, return <code>false</code>.</p>
     <li data-md>
-     <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoderinit-desiredheight" id="ref-for-dom-imagedecoderinit-desiredheight③">desiredHeight</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists①③">exists</a> and <code class="idl"><a data-link-type="idl" href="#dom-imagedecoderinit-desiredwidth" id="ref-for-dom-imagedecoderinit-desiredwidth③">desiredWidth</a></code> does not exist, return <code>false</code>.</p>
+     <p>If <code class="idl"><a data-link-type="idl" href="#dom-imagedecoderinit-desiredheight" id="ref-for-dom-imagedecoderinit-desiredheight③">desiredHeight</a></code> <a data-link-type="dfn" href="https://infra.spec.whatwg.org/#map-exists" id="ref-for-map-exists①⑦">exists</a> and <code class="idl"><a data-link-type="idl" href="#dom-imagedecoderinit-desiredwidth" id="ref-for-dom-imagedecoderinit-desiredwidth③">desiredWidth</a></code> does not exist, return <code>false</code>.</p>
     <li data-md>
      <p>Return <code>true</code>.</p>
    </ol>
@@ -4321,7 +4666,7 @@ <h3 class="heading settled" data-level="10.3" id="imagedecoderinit-interface"><s
      <p>String containing the MIME type of the image file to be decoded.</p>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecoderInit" data-dfn-type="dict-member" data-export id="dom-imagedecoderinit-data"><code>data</code></dfn>, <span> of type <a data-link-type="idl-name" href="#typedefdef-imagebuffersource" id="ref-for-typedefdef-imagebuffersource①">ImageBufferSource</a></span>
     <dd data-md>
-     <p><code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource①④">BufferSource</a></code> or <code class="idl"><a data-link-type="idl" href="https://streams.spec.whatwg.org/#readablestream" id="ref-for-readablestream④">ReadableStream</a></code> of bytes representing an encoded
+     <p><code class="idl"><a data-link-type="idl" href="https://heycam.github.io/webidl/#BufferSource" id="ref-for-BufferSource②①">BufferSource</a></code> or <code class="idl"><a data-link-type="idl" href="https://streams.spec.whatwg.org/#readablestream" id="ref-for-readablestream④">ReadableStream</a></code> of bytes representing an encoded
 image file as described by <code class="idl"><a data-link-type="idl" href="#dom-imagedecoderinit-type" id="ref-for-dom-imagedecoderinit-type①">type</a></code>.</p>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecoderInit" data-dfn-type="dict-member" data-export id="dom-imagedecoderinit-premultiplyalpha"><code>premultiplyAlpha</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://html.spec.whatwg.org/multipage/imagebitmap-and-animations.html#premultiplyalpha" id="ref-for-premultiplyalpha①">PremultiplyAlpha</a>, defaulting to <code>"default"</code></span>
     <dd data-md>
@@ -4331,12 +4676,12 @@ <h3 class="heading settled" data-level="10.3" id="imagedecoderinit-interface"><s
     <dd data-md>
      <p>Controls whether decoded outputs' color space is converted or ignored, as
 defined by <code class="idl"><a data-link-type="idl" href="https://html.spec.whatwg.org/multipage/imagebitmap-and-animations.html#dom-imagebitmapoptions-colorspaceconversion" id="ref-for-dom-imagebitmapoptions-colorspaceconversion">colorSpaceConversion</a></code> in <code class="idl"><a data-link-type="idl" href="https://html.spec.whatwg.org/multipage/imagebitmap-and-animations.html#imagebitmapoptions" id="ref-for-imagebitmapoptions①">ImageBitmapOptions</a></code>.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecoderInit" data-dfn-type="dict-member" data-export id="dom-imagedecoderinit-desiredwidth"><code>desiredWidth</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧①">unsigned long</a></span>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecoderInit" data-dfn-type="dict-member" data-export id="dom-imagedecoderinit-desiredwidth"><code>desiredWidth</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧④">unsigned long</a></span>
     <dd data-md>
      <p>Indicates a desired width for decoded outputs. Implementation is best
 effort; decoding to a desired width may not be supported by all formats/
 decoders.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecoderInit" data-dfn-type="dict-member" data-export id="dom-imagedecoderinit-desiredheight"><code>desiredHeight</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧②">unsigned long</a></span>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecoderInit" data-dfn-type="dict-member" data-export id="dom-imagedecoderinit-desiredheight"><code>desiredHeight</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧⑤">unsigned long</a></span>
     <dd data-md>
      <p>Indicates a desired height for decoded outputs. Implementation is best
 effort; decoding to a desired height may not be supported by all
@@ -4349,13 +4694,13 @@ <h3 class="heading settled" data-level="10.3" id="imagedecoderinit-interface"><s
    </dl>
    <h3 class="heading settled" data-level="10.4" id="imagedecodeoptions-interface"><span class="secno">10.4. </span><span class="content">ImageDecodeOptions Interface</span><a class="self-link" href="#imagedecodeoptions-interface"></a></h3>
 <pre class="idl highlight def"><c- b>dictionary</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="dictionary" data-export id="dictdef-imagedecodeoptions"><code><c- g>ImageDecodeOptions</c-></code></dfn> {
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③⑤"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧③"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-default="0" data-link-type="dict-member" data-type="unsigned long " href="#dom-imagedecodeoptions-frameindex" id="ref-for-dom-imagedecodeoptions-frameindex②"><c- g>frameIndex</c-></a> = 0;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③⑦"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧⑥"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-default="0" data-link-type="dict-member" data-type="unsigned long " href="#dom-imagedecodeoptions-frameindex" id="ref-for-dom-imagedecodeoptions-frameindex②"><c- g>frameIndex</c-></a> = 0;
   <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-boolean" id="ref-for-idl-boolean①⑥"><c- b>boolean</c-></a> <a class="idl-code" data-default="true" data-link-type="dict-member" data-type="boolean " href="#dom-imagedecodeoptions-completeframesonly" id="ref-for-dom-imagedecodeoptions-completeframesonly①"><c- g>completeFramesOnly</c-></a> = <c- b>true</c->;
 };
 
 </pre>
    <dl>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecodeOptions" data-dfn-type="dict-member" data-export id="dom-imagedecodeoptions-frameindex"><code>frameIndex</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧④">unsigned long</a>, defaulting to <code>0</code></span>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecodeOptions" data-dfn-type="dict-member" data-export id="dom-imagedecodeoptions-frameindex"><code>frameIndex</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧⑦">unsigned long</a>, defaulting to <code>0</code></span>
     <dd data-md>
      <p>The index of the frame to decode.</p>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecodeOptions" data-dfn-type="dict-member" data-export id="dom-imagedecodeoptions-completeframesonly"><code>completeFramesOnly</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-boolean" id="ref-for-idl-boolean①⑦">boolean</a>, defaulting to <code>true</code></span>
@@ -4378,13 +4723,13 @@ <h3 class="heading settled" data-level="10.4" id="imagedecodeoptions-interface">
    </dl>
    <h3 class="heading settled" data-level="10.5" id="imagedecoderesult-interface"><span class="secno">10.5. </span><span class="content">ImageDecodeResult Interface</span><a class="self-link" href="#imagedecoderesult-interface"></a></h3>
 <pre class="idl highlight def"><c- b>dictionary</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="dictionary" data-export id="dictdef-imagedecoderesult"><code><c- g>ImageDecodeResult</c-></code></dfn> {
-  <c- b>required</c-> <a data-link-type="idl-name" href="#videoframe" id="ref-for-videoframe④②"><c- n>VideoFrame</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="VideoFrame " href="#dom-imagedecoderesult-image" id="ref-for-dom-imagedecoderesult-image③"><c- g>image</c-></a>;
+  <c- b>required</c-> <a data-link-type="idl-name" href="#videoframe" id="ref-for-videoframe④③"><c- n>VideoFrame</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="VideoFrame " href="#dom-imagedecoderesult-image" id="ref-for-dom-imagedecoderesult-image③"><c- g>image</c-></a>;
   <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-boolean" id="ref-for-idl-boolean①⑧"><c- b>boolean</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="boolean " href="#dom-imagedecoderesult-complete" id="ref-for-dom-imagedecoderesult-complete④"><c- g>complete</c-></a>;
 };
 
 </pre>
    <dl>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecodeResult" data-dfn-type="dict-member" data-export id="dom-imagedecoderesult-image"><code>image</code></dfn>, <span> of type <a data-link-type="idl-name" href="#videoframe" id="ref-for-videoframe④③">VideoFrame</a></span>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecodeResult" data-dfn-type="dict-member" data-export id="dom-imagedecoderesult-image"><code>image</code></dfn>, <span> of type <a data-link-type="idl-name" href="#videoframe" id="ref-for-videoframe④④">VideoFrame</a></span>
     <dd data-md>
      <p>The decoded image.</p>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageDecodeResult" data-dfn-type="dict-member" data-export id="dom-imagedecoderesult-complete"><code>complete</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-boolean" id="ref-for-idl-boolean①⑨">boolean</a></span>
@@ -4394,13 +4739,13 @@ <h3 class="heading settled" data-level="10.5" id="imagedecoderesult-interface"><
      <p class="note" role="note"><span>NOTE:</span> <code class="idl"><a data-link-type="idl" href="#dom-imagedecoderesult-complete" id="ref-for-dom-imagedecoderesult-complete⑤">complete</a></code> is always <code>true</code> when <code class="idl"><a data-link-type="idl" href="#dom-imagedecoder-decode" id="ref-for-dom-imagedecoder-decode⑤">decode()</a></code> is invoked with <code class="idl"><a data-link-type="idl" href="#dom-imagedecodeoptions-completeframesonly" id="ref-for-dom-imagedecodeoptions-completeframesonly④">completeFramesOnly</a></code> set to <code>true</code>.</p>
    </dl>
    <h3 class="heading settled" data-level="10.6" id="imagetracklist-interface"><span class="secno">10.6. </span><span class="content">ImageTrackList Interface</span><a class="self-link" href="#imagetracklist-interface"></a></h3>
-<pre class="idl highlight def">[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed" id="ref-for-Exposed①⓪"><c- g>Exposed</c-></a>=(<c- n>Window</c->,<c- n>DedicatedWorker</c->)]
+<pre class="idl highlight def">[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed" id="ref-for-Exposed⑨"><c- g>Exposed</c-></a>=(<c- n>Window</c->,<c- n>DedicatedWorker</c->)]
 <c- b>interface</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="interface" data-export id="imagetracklist"><code><c- g>ImageTrackList</c-></code></dfn> {
-  <c- b>getter</c-> <a data-link-type="idl-name" href="#imagetrack" id="ref-for-imagetrack④"><c- n>ImageTrack</c-></a> (<a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧⑤"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="idl-code" data-dfn-for="ImageTrackList/__getter__(index)" data-dfn-type="argument" data-export id="dom-imagetracklist-__getter__-index-index"><code><c- g>index</c-></code><a class="self-link" href="#dom-imagetracklist-__getter__-index-index"></a></dfn>);
+  <c- b>getter</c-> <a data-link-type="idl-name" href="#imagetrack" id="ref-for-imagetrack④"><c- n>ImageTrack</c-></a> (<a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧⑧"><c- b>unsigned</c-> <c- b>long</c-></a> <dfn class="idl-code" data-dfn-for="ImageTrackList/__getter__(index)" data-dfn-type="argument" data-export id="dom-imagetracklist-__getter__-index-index"><code><c- g>index</c-></code><a class="self-link" href="#dom-imagetracklist-__getter__-index-index"></a></dfn>);
 
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①⑥"><c- b>Promise</c-></a>&lt;<a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined③⑤"><c- b>undefined</c-></a>> <a class="idl-code" data-link-type="attribute" data-readonly data-type="Promise<undefined>" href="#dom-imagetracklist-ready" id="ref-for-dom-imagetracklist-ready"><c- g>ready</c-></a>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③⑥"><c- g>EnforceRange</c-></a>] <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧⑥"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-imagetracklist-length" id="ref-for-dom-imagetracklist-length"><c- g>length</c-></a>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③⑦"><c- g>EnforceRange</c-></a>] <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-long" id="ref-for-idl-long⑧"><c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="long" href="#dom-imagetracklist-selectedindex" id="ref-for-dom-imagetracklist-selectedindex"><c- g>selectedIndex</c-></a>;
+  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-promise" id="ref-for-idl-promise①⑧"><c- b>Promise</c-></a>&lt;<a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined③④"><c- b>undefined</c-></a>> <a class="idl-code" data-link-type="attribute" data-readonly data-type="Promise<undefined>" href="#dom-imagetracklist-ready" id="ref-for-dom-imagetracklist-ready"><c- g>ready</c-></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③⑧"><c- g>EnforceRange</c-></a>] <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧⑨"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-imagetracklist-length" id="ref-for-dom-imagetracklist-length"><c- g>length</c-></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③⑨"><c- g>EnforceRange</c-></a>] <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-long" id="ref-for-idl-long⑧"><c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="long" href="#dom-imagetracklist-selectedindex" id="ref-for-dom-imagetracklist-selectedindex"><c- g>selectedIndex</c-></a>;
   <c- b>readonly</c-> <c- b>attribute</c-> <a data-link-type="idl-name" href="#imagetrack" id="ref-for-imagetrack⑤"><c- n>ImageTrack</c-></a>? <a class="idl-code" data-link-type="attribute" data-readonly data-type="ImageTrack?" href="#dom-imagetracklist-selectedtrack" id="ref-for-dom-imagetracklist-selectedtrack"><c- g>selectedTrack</c-></a>;
 };
 
@@ -4423,10 +4768,10 @@ <h4 class="heading settled" data-level="10.6.1" id="imagetracklist-internal-slot
    </dl>
    <h4 class="heading settled" data-level="10.6.2" id="imagetracklist-attributes"><span class="secno">10.6.2. </span><span class="content">Attributes</span><a class="self-link" href="#imagetracklist-attributes"></a></h4>
    <dl>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageTrackList" data-dfn-type="attribute" data-export id="dom-imagetracklist-ready"><code>ready</code></dfn>, <span> of type Promise&lt;<a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined③⑥">undefined</a>>, readonly</span>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageTrackList" data-dfn-type="attribute" data-export id="dom-imagetracklist-ready"><code>ready</code></dfn>, <span> of type Promise&lt;<a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-undefined" id="ref-for-idl-undefined③⑤">undefined</a>>, readonly</span>
     <dd data-md>
      <p>The <code class="idl"><a data-link-type="idl" href="#dom-imagetracklist-ready" id="ref-for-dom-imagetracklist-ready①">ready</a></code> getter steps are to return the <code class="idl"><a data-link-type="idl" href="#dom-imagetracklist-ready-promise-slot" id="ref-for-dom-imagetracklist-ready-promise-slot①">[[ready promise]]</a></code>.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageTrackList" data-dfn-type="attribute" data-export id="dom-imagetracklist-length"><code>length</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧⑦">unsigned long</a>, readonly</span>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageTrackList" data-dfn-type="attribute" data-export id="dom-imagetracklist-length"><code>length</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑨⓪">unsigned long</a>, readonly</span>
     <dd data-md>
      <p>The <code class="idl"><a data-link-type="idl" href="#dom-imagetracklist-length" id="ref-for-dom-imagetracklist-length①">length</a></code> getter steps are to return the length of <code class="idl"><a data-link-type="idl" href="#dom-imagetracklist-track-list-slot" id="ref-for-dom-imagetracklist-track-list-slot⑤">[[track list]]</a></code>.</p>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageTrackList" data-dfn-type="attribute" data-export id="dom-imagetracklist-selectedindex"><code>selectedIndex</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-long" id="ref-for-idl-long⑨">long</a>, readonly</span>
@@ -4443,11 +4788,11 @@ <h4 class="heading settled" data-level="10.6.2" id="imagetracklist-attributes"><
      </ol>
    </dl>
    <h3 class="heading settled" data-level="10.7" id="imagetrack-interface"><span class="secno">10.7. </span><span class="content">ImageTrack Interface</span><a class="self-link" href="#imagetrack-interface"></a></h3>
-<pre class="idl highlight def">[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed" id="ref-for-Exposed①①"><c- g>Exposed</c-></a>=(<c- n>Window</c->,<c- n>DedicatedWorker</c->)]
+<pre class="idl highlight def">[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed" id="ref-for-Exposed①⓪"><c- g>Exposed</c-></a>=(<c- n>Window</c->,<c- n>DedicatedWorker</c->)]
 <c- b>interface</c-> <dfn class="dfn-paneled idl-code" data-dfn-type="interface" data-export id="imagetrack"><code><c- g>ImageTrack</c-></code></dfn> : <a data-link-type="idl-name" href="https://dom.spec.whatwg.org/#eventtarget" id="ref-for-eventtarget"><c- n>EventTarget</c-></a> {
   <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-boolean" id="ref-for-idl-boolean②⓪"><c- b>boolean</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="boolean" href="#dom-imagetrack-animated" id="ref-for-dom-imagetrack-animated②"><c- g>animated</c-></a>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③⑧"><c- g>EnforceRange</c-></a>] <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧⑧"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-imagetrack-framecount" id="ref-for-dom-imagetrack-framecount②"><c- g>frameCount</c-></a>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange③⑨"><c- g>EnforceRange</c-></a>] <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unrestricted-float" id="ref-for-idl-unrestricted-float"><c- b>unrestricted</c-> <c- b>float</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unrestricted float" href="#dom-imagetrack-repetitioncount" id="ref-for-dom-imagetrack-repetitioncount"><c- g>repetitionCount</c-></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange④⓪"><c- g>EnforceRange</c-></a>] <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑨①"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-imagetrack-framecount" id="ref-for-dom-imagetrack-framecount②"><c- g>frameCount</c-></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange" id="ref-for-EnforceRange④①"><c- g>EnforceRange</c-></a>] <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unrestricted-float" id="ref-for-idl-unrestricted-float"><c- b>unrestricted</c-> <c- b>float</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unrestricted float" href="#dom-imagetrack-repetitioncount" id="ref-for-dom-imagetrack-repetitioncount"><c- g>repetitionCount</c-></a>;
   <c- b>attribute</c-> <a data-link-type="idl-name" href="https://html.spec.whatwg.org/multipage/webappapis.html#eventhandler" id="ref-for-eventhandler"><c- n>EventHandler</c-></a> <a class="idl-code" data-link-type="attribute" data-type="EventHandler" href="#dom-imagetrack-onchange" id="ref-for-dom-imagetrack-onchange"><c- g>onchange</c-></a>;
   <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-boolean" id="ref-for-idl-boolean②①"><c- b>boolean</c-></a> <a class="idl-code" data-link-type="attribute" data-type="boolean" href="#dom-imagetrack-selected" id="ref-for-dom-imagetrack-selected"><c- g>selected</c-></a>;
 };
@@ -4482,7 +4827,7 @@ <h4 class="heading settled" data-level="10.7.2" id="imagetrack-attributes"><span
      <p>The <code class="idl"><a data-link-type="idl" href="#dom-imagetrack-animated" id="ref-for-dom-imagetrack-animated③">animated</a></code> getter steps are to return the value of <code class="idl"><a data-link-type="idl" href="#dom-imagetrack-animated-slot" id="ref-for-dom-imagetrack-animated-slot①">[[animated]]</a></code>.</p>
      <p class="note" role="note"><span>NOTE:</span> This attribute provides an early indication that <code class="idl"><a data-link-type="idl" href="#dom-imagetrack-framecount" id="ref-for-dom-imagetrack-framecount③">frameCount</a></code> will ultimately exceed 0 for images where the <code class="idl"><a data-link-type="idl" href="#dom-imagetrack-framecount" id="ref-for-dom-imagetrack-framecount④">frameCount</a></code> starts at <code>0</code> and later increments as new
     chunks of the <code class="idl"><a data-link-type="idl" href="https://streams.spec.whatwg.org/#readablestream" id="ref-for-readablestream⑥">ReadableStream</a></code> <code class="idl"><a data-link-type="idl" href="#dom-imagedecoderinit-data" id="ref-for-dom-imagedecoderinit-data⑤">data</a></code> arrive.</p>
-    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageTrack" data-dfn-type="attribute" data-export id="dom-imagetrack-framecount"><code>frameCount</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑧⑨">unsigned long</a>, readonly</span>
+    <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageTrack" data-dfn-type="attribute" data-export id="dom-imagetrack-framecount"><code>frameCount</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unsigned-long" id="ref-for-idl-unsigned-long⑨②">unsigned long</a>, readonly</span>
     <dd data-md>
      <p>The <code class="idl"><a data-link-type="idl" href="#dom-imagetrack-framecount" id="ref-for-dom-imagetrack-framecount⑤">frameCount</a></code> getter steps are to return the value of <code class="idl"><a data-link-type="idl" href="#dom-imagetrack-frame-count-slot" id="ref-for-dom-imagetrack-frame-count-slot②">[[frame count]]</a></code>.</p>
     <dt data-md><dfn class="dfn-paneled idl-code" data-dfn-for="ImageTrack" data-dfn-type="attribute" data-export id="dom-imagetrack-repetitioncount"><code>repetitionCount</code></dfn>, <span> of type <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#idl-unrestricted-float" id="ref-for-idl-unrestricted-float①">unrestricted float</a>, readonly</span>
@@ -4523,7 +4868,7 @@ <h4 class="heading settled" data-level="10.7.2" id="imagetrack-attributes"><span
       <li data-md>
        <p>Run the <a data-link-type="dfn" href="#imagedecoder-reset-imagedecoder" id="ref-for-imagedecoder-reset-imagedecoder②">Reset ImageDecoder</a> algorithm on <code class="idl"><a data-link-type="idl" href="#dom-imagetrack-imagedecoder-slot" id="ref-for-dom-imagetrack-imagedecoder-slot②">[[ImageDecoder]]</a></code>.</p>
       <li data-md>
-       <p><a data-link-type="dfn" href="#enqueues-a-control-message" id="ref-for-enqueues-a-control-message②②">Queue a control message</a> to <code class="idl"><a data-link-type="idl" href="#dom-imagetrack-imagedecoder-slot" id="ref-for-dom-imagetrack-imagedecoder-slot③">[[ImageDecoder]]</a></code>'s <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue①②">control message queue</a> to update the internal selected track
+       <p><a data-link-type="dfn" href="#enqueues-a-control-message" id="ref-for-enqueues-a-control-message②②">Queue a control message</a> to <code class="idl"><a data-link-type="idl" href="#dom-imagetrack-imagedecoder-slot" id="ref-for-dom-imagetrack-imagedecoder-slot③">[[ImageDecoder]]</a></code>'s <a data-link-type="dfn" href="#control-message-queue" id="ref-for-control-message-queue①⑤">control message queue</a> to update the internal selected track
 index with <var>selectedIndex</var>.</p>
      </ol>
      <p><a data-link-type="dfn" href="#running-a-control-message" id="ref-for-running-a-control-message①⑥">Running a control message</a> to update the internal selected track index
@@ -4619,7 +4964,14 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
      <li><a href="#dom-audioencoder-active-output-config-slot">attribute for AudioEncoder</a><span>, in §5.1</span>
      <li><a href="#dom-videoencoder-active-output-config-slot">attribute for VideoEncoder</a><span>, in §6.1</span>
     </ul>
-   <li><a href="#dom-audiodata-allocationsize">allocationSize(options)</a><span>, in §9.2.4</span>
+   <li><a href="#parsed-copyto-options-allocationsize">allocationSize</a><span>, in §9.4.4</span>
+   <li><a href="#dom-videoframe-allocationsize">allocationSize()</a><span>, in §9.4.5</span>
+   <li>
+    allocationSize(options)
+    <ul>
+     <li><a href="#dom-audiodata-allocationsize">method for AudioData</a><span>, in §9.2.4</span>
+     <li><a href="#dom-videoframe-allocationsize">method for VideoFrame</a><span>, in §9.4.5</span>
+    </ul>
    <li><a href="#dom-hardwareacceleration-allow">"allow"</a><span>, in §7.9</span>
    <li><a href="#dom-hardwareacceleration-allow">allow</a><span>, in §7.9</span>
    <li><a href="#dom-imagetrack-animated-slot">[[animated]]</a><span>, in §10.7.1</span>
@@ -4648,6 +5000,7 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
      <li><a href="#dom-audioencoderconfig-bitrate">dict-member for AudioEncoderConfig</a><span>, in §7.7</span>
      <li><a href="#dom-videoencoderconfig-bitrate">dict-member for VideoEncoderConfig</a><span>, in §7.8</span>
     </ul>
+   <li><a href="#dom-videoencoderconfig-bitratemode">bitrateMode</a><span>, in §7.8</span>
    <li>
     [[byte length]]
     <ul>
@@ -4667,11 +5020,11 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     clone()
     <ul>
      <li><a href="#dom-audiodata-clone">method for AudioData</a><span>, in §9.2.4</span>
-     <li><a href="#dom-videoframe-clone">method for VideoFrame</a><span>, in §9.4.4</span>
+     <li><a href="#dom-videoframe-clone">method for VideoFrame</a><span>, in §9.4.5</span>
     </ul>
    <li><a href="#clone-audiodata">Clone AudioData</a><span>, in §9.2.5</span>
    <li><a href="#clone-configuration">Clone Configuration</a><span>, in §7.2</span>
-   <li><a href="#clone-videoframe">Clone VideoFrame</a><span>, in §9.4.5</span>
+   <li><a href="#clone-videoframe">Clone VideoFrame</a><span>, in §9.4.6</span>
    <li>
     close()
     <ul>
@@ -4681,7 +5034,7 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
      <li><a href="#dom-imagedecoder-close">method for ImageDecoder</a><span>, in §10.2.4</span>
      <li><a href="#dom-videodecoder-close">method for VideoDecoder</a><span>, in §4.4</span>
      <li><a href="#dom-videoencoder-close">method for VideoEncoder</a><span>, in §6.4</span>
-     <li><a href="#dom-videoframe-close">method for VideoFrame</a><span>, in §9.4.4</span>
+     <li><a href="#dom-videoframe-close">method for VideoFrame</a><span>, in §9.4.5</span>
     </ul>
    <li><a href="#close-audiodecoder">Close AudioDecoder</a><span>, in §3.5</span>
    <li><a href="#close-audioencoder">Close AudioEncoder</a><span>, in §5.5</span>
@@ -4722,6 +5075,7 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
      <li><a href="#dom-videodecoderconfig-codedheight">dict-member for VideoDecoderConfig</a><span>, in §7.6</span>
      <li><a href="#dom-videoframeplaneinit-codedheight">dict-member for VideoFramePlaneInit</a><span>, in §9.4</span>
     </ul>
+   <li><a href="#dom-videoframe-codedrect">codedRect</a><span>, in §9.4.3</span>
    <li><a href="#dom-videoframe-coded-width-slot">[[coded width]]</a><span>, in §9.4.1</span>
    <li>
     codedWidth
@@ -4742,6 +5096,9 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
    <li><a href="#dom-imagedecoder-completed-promise-slot">[[completed promise]]</a><span>, in §10.2.1</span>
    <li><a href="#dom-imagedecodeoptions-completeframesonly">completeFramesOnly</a><span>, in §10.4</span>
    <li><a href="#compute-copy-element-count">Compute Copy Element Count</a><span>, in §9.2.5</span>
+   <li><a href="#parsed-copyto-options-computedlayouts">computedLayouts</a><span>, in §9.4.4</span>
+   <li><a href="#computed-plane-layout">computed plane layout</a><span>, in §9.4.4</span>
+   <li><a href="#videoframe-compute-layout-and-allocation-size">Compute Layout and Allocation Size</a><span>, in §9.4.6</span>
    <li>
     config
     <ul>
@@ -4785,37 +5142,15 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     <ul>
      <li><a href="#dom-encodedaudiochunk-copyto">method for EncodedAudioChunk</a><span>, in §8.1.4</span>
      <li><a href="#dom-encodedvideochunk-copyto">method for EncodedVideoChunk</a><span>, in §8.2.4</span>
+     <li><a href="#dom-videoframe-copyto">method for VideoFrame</a><span>, in §9.4.5</span>
     </ul>
-   <li><a href="#dom-audiodata-copyto">copyTo(destination, options)</a><span>, in §9.2.4</span>
-   <li><a href="#create-a-videoframe">Create a VideoFrame</a><span>, in §9.4.5</span>
-   <li><a href="#dom-videoframe-crop-height-slot">[[crop height]]</a><span>, in §9.4.1</span>
-   <li>
-    cropHeight
-    <ul>
-     <li><a href="#dom-videoframe-cropheight">attribute for VideoFrame</a><span>, in §9.4.3</span>
-     <li><a href="#dom-videoframeplaneinit-cropheight">dict-member for VideoFramePlaneInit</a><span>, in §9.4</span>
-    </ul>
-   <li><a href="#dom-videoframe-crop-left-slot">[[crop left]]</a><span>, in §9.4.1</span>
-   <li>
-    cropLeft
-    <ul>
-     <li><a href="#dom-videoframe-cropleft">attribute for VideoFrame</a><span>, in §9.4.3</span>
-     <li><a href="#dom-videoframeplaneinit-cropleft">dict-member for VideoFramePlaneInit</a><span>, in §9.4</span>
-    </ul>
-   <li><a href="#dom-videoframe-crop-top-slot">[[crop top]]</a><span>, in §9.4.1</span>
-   <li>
-    cropTop
-    <ul>
-     <li><a href="#dom-videoframe-croptop">attribute for VideoFrame</a><span>, in §9.4.3</span>
-     <li><a href="#dom-videoframeplaneinit-croptop">dict-member for VideoFramePlaneInit</a><span>, in §9.4</span>
-    </ul>
-   <li><a href="#dom-videoframe-crop-width-slot">[[crop width]]</a><span>, in §9.4.1</span>
    <li>
-    cropWidth
+    copyTo(destination, options)
     <ul>
-     <li><a href="#dom-videoframe-cropwidth">attribute for VideoFrame</a><span>, in §9.4.3</span>
-     <li><a href="#dom-videoframeplaneinit-cropwidth">dict-member for VideoFramePlaneInit</a><span>, in §9.4</span>
+     <li><a href="#dom-audiodata-copyto">method for AudioData</a><span>, in §9.2.4</span>
+     <li><a href="#dom-videoframe-copyto">method for VideoFrame</a><span>, in §9.4.5</span>
     </ul>
+   <li><a href="#create-a-videoframe">Create a VideoFrame</a><span>, in §9.4.6</span>
    <li>
     data
     <ul>
@@ -4823,6 +5158,7 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
      <li><a href="#dom-encodedaudiochunkinit-data">dict-member for EncodedAudioChunkInit</a><span>, in §8.1</span>
      <li><a href="#dom-encodedvideochunkinit-data">dict-member for EncodedVideoChunkInit</a><span>, in §8.2</span>
      <li><a href="#dom-imagedecoderinit-data">dict-member for ImageDecoderInit</a><span>, in §10.3</span>
+     <li><a href="#dom-planeinit-data">dict-member for PlaneInit</a><span>, in §9.4</span>
     </ul>
    <li><a href="#dom-imagedecoder-decode">decode()</a><span>, in §10.2.4</span>
    <li>
@@ -4869,6 +5205,8 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     </ul>
    <li><a href="#dom-imagedecoderinit-desiredheight">desiredHeight</a><span>, in §10.3</span>
    <li><a href="#dom-imagedecoderinit-desiredwidth">desiredWidth</a><span>, in §10.3</span>
+   <li><a href="#computed-plane-layout-destinationoffset">destinationOffset</a><span>, in §9.4.4</span>
+   <li><a href="#computed-plane-layout-destinationstride">destinationStride</a><span>, in §9.4.4</span>
    <li>
     [[detached]]
     <ul>
@@ -5005,9 +5343,14 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
      <li><a href="#dom-videodecoderconfig-hardwareacceleration">dict-member for VideoDecoderConfig</a><span>, in §7.6</span>
      <li><a href="#dom-videoencoderconfig-hardwareacceleration">dict-member for VideoEncoderConfig</a><span>, in §7.8</span>
     </ul>
-   <li><a href="#dom-videoencoderconfig-height">height</a><span>, in §7.8</span>
-   <li><a href="#dom-pixelformat-i420">"I420"</a><span>, in §9.6</span>
-   <li><a href="#dom-pixelformat-i420">I420</a><span>, in §9.6</span>
+   <li>
+    height
+    <ul>
+     <li><a href="#dom-videoencoderconfig-height">dict-member for VideoEncoderConfig</a><span>, in §7.8</span>
+     <li><a href="#dom-videoframerect-height">dict-member for VideoFrameRect</a><span>, in §9.6</span>
+    </ul>
+   <li><a href="#dom-pixelformat-i420">"I420"</a><span>, in §9.8</span>
+   <li><a href="#dom-pixelformat-i420">I420</a><span>, in §9.8</span>
    <li><a href="#dom-imagedecoderesult-image">image</a><span>, in §10.5</span>
    <li><a href="#typedefdef-imagebuffersource">ImageBufferSource</a><span>, in §10.3</span>
    <li><a href="#dictdef-imagedecodeoptions">ImageDecodeOptions</a><span>, in §10.4</span>
@@ -5024,9 +5367,8 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
      <li><a href="#dom-imagetrack-imagetracklist-slot">attribute for ImageTrack</a><span>, in §10.7.1</span>
     </ul>
    <li><a href="#imagetracklist">ImageTrackList</a><span>, in §10.6</span>
-   <li><a href="#videoframe-initialize-frame-from-other-frame">Initialize Frame From Other Frame</a><span>, in §9.4.5</span>
-   <li><a href="#videoframe-initialize-frame-with-resource-and-size">Initialize Frame With Resource and Size</a><span>, in §9.4.5</span>
-   <li><a href="#injected-state">injected state</a><span>, in §2.2</span>
+   <li><a href="#videoframe-initialize-frame-from-other-frame">Initialize Frame From Other Frame</a><span>, in §9.4.6</span>
+   <li><a href="#videoframe-initialize-frame-with-resource-and-size">Initialize Frame With Resource and Size</a><span>, in §9.4.6</span>
    <li><a href="#interleaved">interleaved</a><span>, in §9.3.1</span>
    <li>
     [[internal data]]
@@ -5060,12 +5402,9 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     </ul>
    <li><a href="#key-chunk">Key Frame</a><span>, in §1</span>
    <li><a href="#dom-videoencoderencodeoptions-keyframe">keyFrame</a><span>, in §7.11</span>
-   <li>
-    length
-    <ul>
-     <li><a href="#dom-imagetracklist-length">attribute for ImageTrackList</a><span>, in §10.6.2</span>
-     <li><a href="#dom-plane-length">attribute for Plane</a><span>, in §9.5.2</span>
-    </ul>
+   <li><a href="#dom-videoframecopytooptions-layout">layout</a><span>, in §9.5</span>
+   <li><a href="#dom-videoframerect-left">left</a><span>, in §9.6</span>
+   <li><a href="#dom-imagetracklist-length">length</a><span>, in §10.6.2</span>
    <li><a href="#maximum-value">maximum value</a><span>, in §9.3.2</span>
    <li><a href="#media-resource">media resource</a><span>, in §9.1.2</span>
    <li><a href="#minimum-value">minimum value</a><span>, in §9.3.2</span>
@@ -5085,6 +5424,12 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
      <li><a href="#dom-audiodata-numberofframes">attribute for AudioData</a><span>, in §9.2.3</span>
      <li><a href="#dom-audiodatainit-numberofframes">dict-member for AudioDataInit</a><span>, in §9.2</span>
     </ul>
+   <li>
+    offset
+    <ul>
+     <li><a href="#dom-planeinit-offset">dict-member for PlaneInit</a><span>, in §9.4</span>
+     <li><a href="#dom-planelayout-offset">dict-member for PlaneLayout</a><span>, in §9.7</span>
+    </ul>
    <li><a href="#dom-imagetrack-onchange">onchange</a><span>, in §10.7.2</span>
    <li>
     output
@@ -5106,15 +5451,23 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
    <li><a href="#output-encodedaudiochunks">Output EncodedAudioChunks</a><span>, in §5.5</span>
    <li><a href="#output-encodedvideochunks">Output EncodedVideoChunks</a><span>, in §6.5</span>
    <li><a href="#output-videoframes">Output VideoFrames</a><span>, in §4.5</span>
-   <li><a href="#dom-plane-parent-frame-slot">[[parent frame]]</a><span>, in §9.5.1</span>
+   <li><a href="#videoframe-parse-copyto-rect">Parse CopyTo Rect</a><span>, in §9.4.6</span>
+   <li><a href="#parsed-copyto-options">parsed copyto options</a><span>, in §9.4.4</span>
+   <li><a href="#videoframe-parse-videoframecopytooptions">Parse VideoFrameCopyToOptions</a><span>, in §9.4.6</span>
    <li><a href="#dom-imagedecoder-pending-decode-promises-slot">[[pending decode promises]]</a><span>, in §10.2.1</span>
-   <li><a href="#enumdef-pixelformat">PixelFormat</a><span>, in §9.6</span>
+   <li>
+    [[pending flush promises]]
+    <ul>
+     <li><a href="#dom-audiodecoder-pending-flush-promises-slot">attribute for AudioDecoder</a><span>, in §3.1</span>
+     <li><a href="#dom-audioencoder-pending-flush-promises-slot">attribute for AudioEncoder</a><span>, in §5.1</span>
+     <li><a href="#dom-videodecoder-pending-flush-promises-slot">attribute for VideoDecoder</a><span>, in §4.1</span>
+     <li><a href="#dom-videoencoder-pending-flush-promises-slot">attribute for VideoEncoder</a><span>, in §6.1</span>
+    </ul>
+   <li><a href="#enumdef-pixelformat">PixelFormat</a><span>, in §9.8</span>
    <li><a href="#planar">planar</a><span>, in §9.3.1</span>
-   <li><a href="#plane">Plane</a><span>, in §9.5</span>
    <li><a href="#dom-audiodatacopytooptions-planeindex">planeIndex</a><span>, in §9.2.6</span>
-   <li><a href="#dictdef-planeinit">PlaneInit</a><span>, in §9.5</span>
-   <li><a href="#dom-videoframe-planes-slot">[[planes]]</a><span>, in §9.4.1</span>
-   <li><a href="#dom-videoframe-planes">planes</a><span>, in §9.4.3</span>
+   <li><a href="#dictdef-planeinit">PlaneInit</a><span>, in §9.4</span>
+   <li><a href="#dictdef-planelayout">PlaneLayout</a><span>, in §9.7</span>
    <li><a href="#dom-imagedecoder-prefer-animation-slot">[[prefer animation]]</a><span>, in §10.2.1</span>
    <li><a href="#dom-imagedecoderinit-preferanimation">preferAnimation</a><span>, in §10.3</span>
    <li><a href="#dom-imagedecoderinit-premultiplyalpha">premultiplyAlpha</a><span>, in §10.3</span>
@@ -5123,9 +5476,9 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
    <li><a href="#progressive-image">Progressive Image</a><span>, in §1</span>
    <li><a href="#progressive-image-frame-generation">Progressive Image Frame Generation</a><span>, in §1</span>
    <li><a href="#enqueues-a-control-message">Queue a control message</a><span>, in §2.2</span>
-   <li><a href="#dom-plane-readinto">readInto(dst)</a><span>, in §9.5.3</span>
    <li><a href="#dom-imagetracklist-ready">ready</a><span>, in §10.6.2</span>
    <li><a href="#dom-imagetracklist-ready-promise-slot">[[ready promise]]</a><span>, in §10.6.1</span>
+   <li><a href="#dom-videoframecopytooptions-rect">rect</a><span>, in §9.5</span>
    <li><a href="#imagedecoder-reject-infeasible-decode">Reject Infeasible Decode</a><span>, in §10.2.5</span>
    <li><a href="#dom-imagetrack-repetition-count-slot">[[repetition count]]</a><span>, in §10.7.1</span>
    <li><a href="#dom-imagetrack-repetitioncount">repetitionCount</a><span>, in §10.7.2</span>
@@ -5143,7 +5496,6 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
    <li><a href="#reset-audiodecoder">Reset AudioDecoder</a><span>, in §3.5</span>
    <li><a href="#reset-audioencoder">Reset AudioEncoder</a><span>, in §5.5</span>
    <li><a href="#imagedecoder-reset-imagedecoder">Reset ImageDecoder</a><span>, in §10.2.5</span>
-   <li><a href="#reset-the-control-message-queue">Reset the control message queue</a><span>, in §2.2</span>
    <li><a href="#reset-videodecoder">Reset VideoDecoder</a><span>, in §4.5</span>
    <li><a href="#reset-videoencoder">Reset VideoEncoder</a><span>, in §6.5</span>
    <li><a href="#imagedecoder-resolve-decode">Resolve Decode</a><span>, in §10.2.5</span>
@@ -5153,12 +5505,6 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
      <li><a href="#dom-audiodata-resource-reference-slot">attribute for AudioData</a><span>, in §9.2.1</span>
      <li><a href="#dom-videoframe-resource-reference-slot">attribute for VideoFrame</a><span>, in §9.4.1</span>
     </ul>
-   <li>
-    rows
-    <ul>
-     <li><a href="#dom-plane-rows">attribute for Plane</a><span>, in §9.5.2</span>
-     <li><a href="#dom-planeinit-rows">dict-member for PlaneInit</a><span>, in §9.5</span>
-    </ul>
    <li><a href="#running-a-control-message">running a control message</a><span>, in §2.2</span>
    <li><a href="#dom-audiosampleformat-s16">"S16"</a><span>, in §9.3</span>
    <li><a href="#dom-audiosampleformat-s16">S16</a><span>, in §9.3</span>
@@ -5188,7 +5534,10 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
    <li><a href="#dom-imagetracklist-selected-index-slot">[[selected index]]</a><span>, in §10.6.1</span>
    <li><a href="#dom-imagetracklist-selectedindex">selectedIndex</a><span>, in §10.6.2</span>
    <li><a href="#dom-imagetracklist-selectedtrack">selectedTrack</a><span>, in §10.6.2</span>
-   <li><a href="#dom-planeinit-src">src</a><span>, in §9.5</span>
+   <li><a href="#computed-plane-layout-sourceheight">sourceHeight</a><span>, in §9.4.4</span>
+   <li><a href="#computed-plane-layout-sourceleftbytes">sourceLeftBytes</a><span>, in §9.4.4</span>
+   <li><a href="#computed-plane-layout-sourcetop">sourceTop</a><span>, in §9.4.4</span>
+   <li><a href="#computed-plane-layout-sourcewidthbytes">sourceWidthBytes</a><span>, in §9.4.4</span>
    <li>
     [[state]]
     <ul>
@@ -5208,8 +5557,8 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
    <li>
     stride
     <ul>
-     <li><a href="#dom-plane-stride">attribute for Plane</a><span>, in §9.5.2</span>
-     <li><a href="#dom-planeinit-stride">dict-member for PlaneInit</a><span>, in §9.5</span>
+     <li><a href="#dom-planeinit-stride">dict-member for PlaneInit</a><span>, in §9.4</span>
+     <li><a href="#dom-planelayout-stride">dict-member for PlaneLayout</a><span>, in §9.7</span>
     </ul>
    <li>
     supported
@@ -5243,6 +5592,7 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
      <li><a href="#dom-videoframeinit-timestamp">dict-member for VideoFrameInit</a><span>, in §9.4</span>
      <li><a href="#dom-videoframeplaneinit-timestamp">dict-member for VideoFramePlaneInit</a><span>, in §9.4</span>
     </ul>
+   <li><a href="#dom-videoframerect-top">top</a><span>, in §9.6</span>
    <li><a href="#track-update-struct-track-index">track index</a><span>, in §10.2.5</span>
    <li><a href="#dom-imagetracklist-track-list-slot">[[track list]]</a><span>, in §10.6.1</span>
    <li><a href="#dom-imagedecoder-tracks">tracks</a><span>, in §10.2.3</span>
@@ -5277,7 +5627,7 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
    <li><a href="#valid-image-mime-type">valid image MIME type</a><span>, in §10.3</span>
    <li><a href="#valid-videodecoderconfig">valid VideoDecoderConfig</a><span>, in §7.6</span>
    <li><a href="#valid-videoencoderconfig">valid VideoEncoderConfig</a><span>, in §7.8</span>
-   <li><a href="#valid-videoframeplaneinit">valid VideoFramePlaneInit</a><span>, in §9.4.5</span>
+   <li><a href="#valid-videoframeplaneinit">valid VideoFramePlaneInit</a><span>, in §9.4.6</span>
    <li><a href="#videodecoder">VideoDecoder</a><span>, in §4</span>
    <li><a href="#dictdef-videodecoderconfig">VideoDecoderConfig</a><span>, in §7.6</span>
    <li><a href="#dom-videodecoder-videodecoder">VideoDecoder(init)</a><span>, in §4.2</span>
@@ -5290,14 +5640,31 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
    <li><a href="#dictdef-videoencoderinit">VideoEncoderInit</a><span>, in §6</span>
    <li><a href="#dictdef-videoencodersupport">VideoEncoderSupport</a><span>, in §7.3.4</span>
    <li><a href="#videoframe">VideoFrame</a><span>, in §9.4</span>
+   <li><a href="#dictdef-videoframecopytooptions">VideoFrameCopyToOptions</a><span>, in §9.5</span>
    <li><a href="#dom-videoframe-videoframe">VideoFrame(image)</a><span>, in §9.4.2</span>
    <li><a href="#dom-videoframe-videoframe">VideoFrame(image, init)</a><span>, in §9.4.2</span>
    <li><a href="#dictdef-videoframeinit">VideoFrameInit</a><span>, in §9.4</span>
    <li><a href="#callbackdef-videoframeoutputcallback">VideoFrameOutputCallback</a><span>, in §4</span>
    <li><a href="#dictdef-videoframeplaneinit">VideoFramePlaneInit</a><span>, in §9.4</span>
    <li><a href="#dom-videoframe-videoframe-planes-init">VideoFrame(planes, init)</a><span>, in §9.4.2</span>
+   <li><a href="#dictdef-videoframerect">VideoFrameRect</a><span>, in §9.6</span>
+   <li><a href="#dom-videoframe-visible-height-slot">[[visible height]]</a><span>, in §9.4.1</span>
+   <li><a href="#dom-videoframe-visible-left-slot">[[visible left]]</a><span>, in §9.4.1</span>
+   <li>
+    visibleRect
+    <ul>
+     <li><a href="#dom-videoframe-visiblerect">attribute for VideoFrame</a><span>, in §9.4.3</span>
+     <li><a href="#dom-videoframeplaneinit-visiblerect">dict-member for VideoFramePlaneInit</a><span>, in §9.4</span>
+    </ul>
+   <li><a href="#dom-videoframe-visible-top-slot">[[visible top]]</a><span>, in §9.4.1</span>
+   <li><a href="#dom-videoframe-visible-width-slot">[[visible width]]</a><span>, in §9.4.1</span>
    <li><a href="#callbackdef-webcodecserrorcallback">WebCodecsErrorCallback</a><span>, in §7.13</span>
-   <li><a href="#dom-videoencoderconfig-width">width</a><span>, in §7.8</span>
+   <li>
+    width
+    <ul>
+     <li><a href="#dom-videoencoderconfig-width">dict-member for VideoEncoderConfig</a><span>, in §7.8</span>
+     <li><a href="#dom-videoframerect-width">dict-member for VideoFrameRect</a><span>, in §9.6</span>
+    </ul>
   </ul>
   <aside class="dfn-panel" data-for="term-for-natural-dimensions">
    <a href="https://www.w3.org/TR/css-images-3/#natural-dimensions">https://www.w3.org/TR/css-images-3/#natural-dimensions</a><b>Referenced in:</b>
@@ -5487,6 +5854,7 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     <li><a href="#ref-for-parallel-queue①">4.4. Methods</a>
     <li><a href="#ref-for-parallel-queue②">5.4. Methods</a>
     <li><a href="#ref-for-parallel-queue③">6.4. Methods</a>
+    <li><a href="#ref-for-parallel-queue④">9.4.5. Methods</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-dom-imagebitmapoptions-premultiplyalpha">
@@ -5545,9 +5913,10 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     <li><a href="#ref-for-map-exists①">7.2. Clone Configuration (with config)</a>
     <li><a href="#ref-for-map-exists②">9.2.5. Algorithms</a>
     <li><a href="#ref-for-map-exists③">9.4.2. Constructors</a> <a href="#ref-for-map-exists④">(2)</a> <a href="#ref-for-map-exists⑤">(3)</a> <a href="#ref-for-map-exists⑥">(4)</a> <a href="#ref-for-map-exists⑦">(5)</a> <a href="#ref-for-map-exists⑧">(6)</a>
-    <li><a href="#ref-for-map-exists⑨">9.4.5. Algorithms</a> <a href="#ref-for-map-exists①⓪">(2)</a>
-    <li><a href="#ref-for-map-exists①①">10.2.2. Constructor</a>
-    <li><a href="#ref-for-map-exists①②">10.3. ImageDecoderInit Interface</a> <a href="#ref-for-map-exists①③">(2)</a>
+    <li><a href="#ref-for-map-exists⑨">9.4.6. Algorithms</a> <a href="#ref-for-map-exists①⓪">(2)</a> <a href="#ref-for-map-exists①①">(3)</a> <a href="#ref-for-map-exists①②">(4)</a> <a href="#ref-for-map-exists①③">(5)</a>
+    <li><a href="#ref-for-map-exists①④">9.5. VideoFrame CopyTo() Options</a>
+    <li><a href="#ref-for-map-exists①⑤">10.2.2. Constructor</a>
+    <li><a href="#ref-for-map-exists①⑥">10.3. ImageDecoderInit Interface</a> <a href="#ref-for-map-exists①⑦">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-lists">
@@ -5557,8 +5926,8 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     <li><a href="#ref-for-lists②">4.4. Methods</a> <a href="#ref-for-lists③">(2)</a>
     <li><a href="#ref-for-lists④">5.4. Methods</a> <a href="#ref-for-lists⑤">(2)</a>
     <li><a href="#ref-for-lists⑥">6.4. Methods</a> <a href="#ref-for-lists⑦">(2)</a>
-    <li><a href="#ref-for-lists⑧">9.4.2. Constructors</a>
-    <li><a href="#ref-for-lists⑨">9.4.5. Algorithms</a> <a href="#ref-for-lists①⓪">(2)</a>
+    <li><a href="#ref-for-lists⑧">9.4.4. Internal Structures</a>
+    <li><a href="#ref-for-lists⑨">9.4.6. Algorithms</a> <a href="#ref-for-lists①⓪">(2)</a>
     <li><a href="#ref-for-lists①①">10.2.2. Constructor</a> <a href="#ref-for-lists①②">(2)</a> <a href="#ref-for-lists①③">(3)</a>
     <li><a href="#ref-for-lists①④">10.2.5. Algorithms</a> <a href="#ref-for-lists①⑤">(2)</a>
    </ul>
@@ -5578,7 +5947,8 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
   <aside class="dfn-panel" data-for="term-for-struct">
    <a href="https://infra.spec.whatwg.org/#struct">https://infra.spec.whatwg.org/#struct</a><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-struct">10.2.5. Algorithms</a>
+    <li><a href="#ref-for-struct">9.4.4. Internal Structures</a> <a href="#ref-for-struct①">(2)</a>
+    <li><a href="#ref-for-struct②">10.2.5. Algorithms</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-dom-mediacapabilities-decodinginfo">
@@ -5599,6 +5969,24 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     <li><a href="#ref-for-dom-mediasource-istypesupported">7.4. Codec String</a>
    </ul>
   </aside>
+  <aside class="dfn-panel" data-for="term-for-bitratemode">
+   <a href="https://www.w3.org/TR/mediastream-recording/#bitratemode">https://www.w3.org/TR/mediastream-recording/#bitratemode</a><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-bitratemode">7.8. VideoEncoderConfig</a> <a href="#ref-for-bitratemode①">(2)</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="term-for-dom-bitratemode-constant">
+   <a href="https://www.w3.org/TR/mediastream-recording/#dom-bitratemode-constant">https://www.w3.org/TR/mediastream-recording/#dom-bitratemode-constant</a><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dom-bitratemode-constant">7.8. VideoEncoderConfig</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="term-for-dom-bitratemode-variable">
+   <a href="https://www.w3.org/TR/mediastream-recording/#dom-bitratemode-variable">https://www.w3.org/TR/mediastream-recording/#dom-bitratemode-variable</a><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dom-bitratemode-variable">7.8. VideoEncoderConfig</a>
+   </ul>
+  </aside>
   <aside class="dfn-panel" data-for="term-for-mime-type">
    <a href="https://mimesniff.spec.whatwg.org/#mime-type">https://mimesniff.spec.whatwg.org/#mime-type</a><b>Referenced in:</b>
    <ul>
@@ -5672,7 +6060,15 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
   <aside class="dfn-panel" data-for="term-for-aborterror">
    <a href="https://heycam.github.io/webidl/#aborterror">https://heycam.github.io/webidl/#aborterror</a><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-aborterror">10.2.4. Methods</a> <a href="#ref-for-aborterror①">(2)</a>
+    <li><a href="#ref-for-aborterror">3.4. Methods</a> <a href="#ref-for-aborterror①">(2)</a>
+    <li><a href="#ref-for-aborterror②">3.5. Algorithms</a>
+    <li><a href="#ref-for-aborterror③">4.4. Methods</a> <a href="#ref-for-aborterror④">(2)</a>
+    <li><a href="#ref-for-aborterror⑤">4.5. Algorithms</a>
+    <li><a href="#ref-for-aborterror⑥">5.4. Methods</a> <a href="#ref-for-aborterror⑦">(2)</a>
+    <li><a href="#ref-for-aborterror⑧">5.5. Algorithms</a>
+    <li><a href="#ref-for-aborterror⑨">6.4. Methods</a> <a href="#ref-for-aborterror①⓪">(2)</a>
+    <li><a href="#ref-for-aborterror①①">6.5. Algorithms</a>
+    <li><a href="#ref-for-aborterror①②">10.2.4. Methods</a> <a href="#ref-for-aborterror①③">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-AllowShared">
@@ -5681,12 +6077,7 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     <li><a href="#ref-for-AllowShared">8.1. EncodedAudioChunk Interface</a>
     <li><a href="#ref-for-AllowShared①">8.2. EncodedVideoChunk Interface</a>
     <li><a href="#ref-for-AllowShared②">9.2. AudioData Interface</a>
-   </ul>
-  </aside>
-  <aside class="dfn-panel" data-for="term-for-ArrayBufferView">
-   <a href="https://heycam.github.io/webidl/#ArrayBufferView">https://heycam.github.io/webidl/#ArrayBufferView</a><b>Referenced in:</b>
-   <ul>
-    <li><a href="#ref-for-ArrayBufferView">9.5. Plane Interface</a>
+    <li><a href="#ref-for-AllowShared③">9.4. VideoFrame Interface</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-BufferSource">
@@ -5697,25 +6088,32 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     <li><a href="#ref-for-BufferSource④">8.1. EncodedAudioChunk Interface</a> <a href="#ref-for-BufferSource⑤">(2)</a>
     <li><a href="#ref-for-BufferSource⑥">8.2. EncodedVideoChunk Interface</a> <a href="#ref-for-BufferSource⑦">(2)</a>
     <li><a href="#ref-for-BufferSource⑧">9.2. AudioData Interface</a> <a href="#ref-for-BufferSource⑨">(2)</a>
-    <li><a href="#ref-for-BufferSource①⓪">9.5. Plane Interface</a>
-    <li><a href="#ref-for-BufferSource①①">10.2.2. Constructor</a>
-    <li><a href="#ref-for-BufferSource①②">10.3. ImageDecoderInit Interface</a> <a href="#ref-for-BufferSource①③">(2)</a> <a href="#ref-for-BufferSource①④">(3)</a>
+    <li><a href="#ref-for-BufferSource①⓪">9.4. VideoFrame Interface</a> <a href="#ref-for-BufferSource①①">(2)</a>
+    <li><a href="#ref-for-BufferSource①②">9.4.5. Methods</a>
+    <li><a href="#ref-for-BufferSource①③">9.5. VideoFrame CopyTo() Options</a>
+    <li><a href="#ref-for-BufferSource①④">9.7. Plane Layout</a> <a href="#ref-for-BufferSource①⑤">(2)</a> <a href="#ref-for-BufferSource①⑥">(3)</a> <a href="#ref-for-BufferSource①⑦">(4)</a>
+    <li><a href="#ref-for-BufferSource①⑧">10.2.2. Constructor</a>
+    <li><a href="#ref-for-BufferSource①⑨">10.3. ImageDecoderInit Interface</a> <a href="#ref-for-BufferSource②⓪">(2)</a> <a href="#ref-for-BufferSource②①">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-idl-DOMException">
    <a href="https://heycam.github.io/webidl/#idl-DOMException">https://heycam.github.io/webidl/#idl-DOMException</a><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-idl-DOMException">3.4. Methods</a>
-    <li><a href="#ref-for-idl-DOMException①">4.4. Methods</a>
-    <li><a href="#ref-for-idl-DOMException②">5.4. Methods</a>
-    <li><a href="#ref-for-idl-DOMException③">6.4. Methods</a>
-    <li><a href="#ref-for-idl-DOMException④">7.13. WebCodecsErrorCallback</a>
-    <li><a href="#ref-for-idl-DOMException⑤">9.2.4. Methods</a> <a href="#ref-for-idl-DOMException⑥">(2)</a>
-    <li><a href="#ref-for-idl-DOMException⑦">9.4.2. Constructors</a> <a href="#ref-for-idl-DOMException⑧">(2)</a> <a href="#ref-for-idl-DOMException⑨">(3)</a> <a href="#ref-for-idl-DOMException①⓪">(4)</a>
-    <li><a href="#ref-for-idl-DOMException①①">9.4.4. Methods</a>
-    <li><a href="#ref-for-idl-DOMException①②">10.2.2. Constructor</a>
-    <li><a href="#ref-for-idl-DOMException①③">10.2.4. Methods</a> <a href="#ref-for-idl-DOMException①④">(2)</a> <a href="#ref-for-idl-DOMException①⑤">(3)</a> <a href="#ref-for-idl-DOMException①⑥">(4)</a>
-    <li><a href="#ref-for-idl-DOMException①⑦">10.2.5. Algorithms</a> <a href="#ref-for-idl-DOMException①⑧">(2)</a> <a href="#ref-for-idl-DOMException①⑨">(3)</a> <a href="#ref-for-idl-DOMException②⓪">(4)</a>
+    <li><a href="#ref-for-idl-DOMException">3.4. Methods</a> <a href="#ref-for-idl-DOMException①">(2)</a> <a href="#ref-for-idl-DOMException②">(3)</a>
+    <li><a href="#ref-for-idl-DOMException③">3.5. Algorithms</a>
+    <li><a href="#ref-for-idl-DOMException④">4.4. Methods</a> <a href="#ref-for-idl-DOMException⑤">(2)</a> <a href="#ref-for-idl-DOMException⑥">(3)</a>
+    <li><a href="#ref-for-idl-DOMException⑦">4.5. Algorithms</a>
+    <li><a href="#ref-for-idl-DOMException⑧">5.4. Methods</a> <a href="#ref-for-idl-DOMException⑨">(2)</a> <a href="#ref-for-idl-DOMException①⓪">(3)</a>
+    <li><a href="#ref-for-idl-DOMException①①">5.5. Algorithms</a>
+    <li><a href="#ref-for-idl-DOMException①②">6.4. Methods</a> <a href="#ref-for-idl-DOMException①③">(2)</a> <a href="#ref-for-idl-DOMException①④">(3)</a>
+    <li><a href="#ref-for-idl-DOMException①⑤">6.5. Algorithms</a>
+    <li><a href="#ref-for-idl-DOMException①⑥">7.13. WebCodecsErrorCallback</a>
+    <li><a href="#ref-for-idl-DOMException①⑦">9.2.4. Methods</a> <a href="#ref-for-idl-DOMException①⑧">(2)</a>
+    <li><a href="#ref-for-idl-DOMException①⑨">9.4.2. Constructors</a> <a href="#ref-for-idl-DOMException②⓪">(2)</a> <a href="#ref-for-idl-DOMException②①">(3)</a> <a href="#ref-for-idl-DOMException②②">(4)</a>
+    <li><a href="#ref-for-idl-DOMException②③">9.4.5. Methods</a> <a href="#ref-for-idl-DOMException②④">(2)</a> <a href="#ref-for-idl-DOMException②⑤">(3)</a>
+    <li><a href="#ref-for-idl-DOMException②⑥">10.2.2. Constructor</a>
+    <li><a href="#ref-for-idl-DOMException②⑦">10.2.4. Methods</a> <a href="#ref-for-idl-DOMException②⑧">(2)</a> <a href="#ref-for-idl-DOMException②⑨">(3)</a> <a href="#ref-for-idl-DOMException③⓪">(4)</a>
+    <li><a href="#ref-for-idl-DOMException③①">10.2.5. Algorithms</a> <a href="#ref-for-idl-DOMException③②">(2)</a> <a href="#ref-for-idl-DOMException③③">(3)</a> <a href="#ref-for-idl-DOMException③④">(4)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-idl-DOMString">
@@ -5757,12 +6155,13 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     <li><a href="#ref-for-EnforceRange①④">8.1. EncodedAudioChunk Interface</a>
     <li><a href="#ref-for-EnforceRange①⑤">8.2. EncodedVideoChunk Interface</a> <a href="#ref-for-EnforceRange①⑥">(2)</a>
     <li><a href="#ref-for-EnforceRange①⑦">9.2. AudioData Interface</a> <a href="#ref-for-EnforceRange①⑧">(2)</a> <a href="#ref-for-EnforceRange①⑨">(3)</a> <a href="#ref-for-EnforceRange②⓪">(4)</a>
-    <li><a href="#ref-for-EnforceRange②①">9.4. VideoFrame Interface</a> <a href="#ref-for-EnforceRange②②">(2)</a> <a href="#ref-for-EnforceRange②③">(3)</a> <a href="#ref-for-EnforceRange②④">(4)</a> <a href="#ref-for-EnforceRange②⑤">(5)</a> <a href="#ref-for-EnforceRange②⑥">(6)</a> <a href="#ref-for-EnforceRange②⑦">(7)</a> <a href="#ref-for-EnforceRange②⑧">(8)</a> <a href="#ref-for-EnforceRange②⑨">(9)</a> <a href="#ref-for-EnforceRange③⓪">(10)</a>
-    <li><a href="#ref-for-EnforceRange③①">9.5. Plane Interface</a> <a href="#ref-for-EnforceRange③②">(2)</a>
-    <li><a href="#ref-for-EnforceRange③③">10.3. ImageDecoderInit Interface</a> <a href="#ref-for-EnforceRange③④">(2)</a>
-    <li><a href="#ref-for-EnforceRange③⑤">10.4. ImageDecodeOptions Interface</a>
-    <li><a href="#ref-for-EnforceRange③⑥">10.6. ImageTrackList Interface</a> <a href="#ref-for-EnforceRange③⑦">(2)</a>
-    <li><a href="#ref-for-EnforceRange③⑧">10.7. ImageTrack Interface</a> <a href="#ref-for-EnforceRange③⑨">(2)</a>
+    <li><a href="#ref-for-EnforceRange②①">9.4. VideoFrame Interface</a> <a href="#ref-for-EnforceRange②②">(2)</a> <a href="#ref-for-EnforceRange②③">(3)</a> <a href="#ref-for-EnforceRange②④">(4)</a> <a href="#ref-for-EnforceRange②⑤">(5)</a> <a href="#ref-for-EnforceRange②⑥">(6)</a> <a href="#ref-for-EnforceRange②⑦">(7)</a> <a href="#ref-for-EnforceRange②⑧">(8)</a>
+    <li><a href="#ref-for-EnforceRange②⑨">9.6. VideoFrame Rectangle (Rect)</a> <a href="#ref-for-EnforceRange③⓪">(2)</a> <a href="#ref-for-EnforceRange③①">(3)</a> <a href="#ref-for-EnforceRange③②">(4)</a>
+    <li><a href="#ref-for-EnforceRange③③">9.7. Plane Layout</a> <a href="#ref-for-EnforceRange③④">(2)</a>
+    <li><a href="#ref-for-EnforceRange③⑤">10.3. ImageDecoderInit Interface</a> <a href="#ref-for-EnforceRange③⑥">(2)</a>
+    <li><a href="#ref-for-EnforceRange③⑦">10.4. ImageDecodeOptions Interface</a>
+    <li><a href="#ref-for-EnforceRange③⑧">10.6. ImageTrackList Interface</a> <a href="#ref-for-EnforceRange③⑨">(2)</a>
+    <li><a href="#ref-for-EnforceRange④⓪">10.7. ImageTrack Interface</a> <a href="#ref-for-EnforceRange④①">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-Exposed">
@@ -5776,16 +6175,9 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     <li><a href="#ref-for-Exposed⑤">8.2. EncodedVideoChunk Interface</a>
     <li><a href="#ref-for-Exposed⑥">9.2. AudioData Interface</a>
     <li><a href="#ref-for-Exposed⑦">9.4. VideoFrame Interface</a>
-    <li><a href="#ref-for-Exposed⑧">9.5. Plane Interface</a>
-    <li><a href="#ref-for-Exposed⑨">10.2. ImageDecoder Interface</a>
-    <li><a href="#ref-for-Exposed①⓪">10.6. ImageTrackList Interface</a>
-    <li><a href="#ref-for-Exposed①①">10.7. ImageTrack Interface</a>
-   </ul>
-  </aside>
-  <aside class="dfn-panel" data-for="term-for-idl-frozen-array">
-   <a href="https://heycam.github.io/webidl/#idl-frozen-array">https://heycam.github.io/webidl/#idl-frozen-array</a><b>Referenced in:</b>
-   <ul>
-    <li><a href="#ref-for-idl-frozen-array">9.4. VideoFrame Interface</a>
+    <li><a href="#ref-for-Exposed⑧">10.2. ImageDecoder Interface</a>
+    <li><a href="#ref-for-Exposed⑨">10.6. ImageTrackList Interface</a>
+    <li><a href="#ref-for-Exposed①⓪">10.7. ImageTrack Interface</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-invalidstateerror">
@@ -5801,10 +6193,9 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     <li><a href="#ref-for-invalidstateerror①⑤">6.5. Algorithms</a>
     <li><a href="#ref-for-invalidstateerror①⑥">9.2.4. Methods</a> <a href="#ref-for-invalidstateerror①⑦">(2)</a>
     <li><a href="#ref-for-invalidstateerror①⑧">9.4.2. Constructors</a> <a href="#ref-for-invalidstateerror①⑨">(2)</a> <a href="#ref-for-invalidstateerror②⓪">(3)</a>
-    <li><a href="#ref-for-invalidstateerror②①">9.4.4. Methods</a>
-    <li><a href="#ref-for-invalidstateerror②②">9.5.3. Methods</a>
-    <li><a href="#ref-for-invalidstateerror②③">10.2.4. Methods</a> <a href="#ref-for-invalidstateerror②④">(2)</a>
-    <li><a href="#ref-for-invalidstateerror②⑤">10.2.5. Algorithms</a>
+    <li><a href="#ref-for-invalidstateerror②①">9.4.5. Methods</a>
+    <li><a href="#ref-for-invalidstateerror②②">10.2.4. Methods</a> <a href="#ref-for-invalidstateerror②③">(2)</a>
+    <li><a href="#ref-for-invalidstateerror②④">10.2.5. Algorithms</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-notreadableerror">
@@ -5820,7 +6211,8 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     <li><a href="#ref-for-notsupportederror②">4.4. Methods</a> <a href="#ref-for-notsupportederror③">(2)</a>
     <li><a href="#ref-for-notsupportederror④">5.4. Methods</a> <a href="#ref-for-notsupportederror⑤">(2)</a>
     <li><a href="#ref-for-notsupportederror⑥">6.4. Methods</a> <a href="#ref-for-notsupportederror⑦">(2)</a>
-    <li><a href="#ref-for-notsupportederror⑧">10.2.2. Constructor</a> <a href="#ref-for-notsupportederror⑨">(2)</a>
+    <li><a href="#ref-for-notsupportederror⑧">9.4.5. Methods</a> <a href="#ref-for-notsupportederror⑨">(2)</a>
+    <li><a href="#ref-for-notsupportederror①⓪">10.2.2. Constructor</a> <a href="#ref-for-notsupportederror①①">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-idl-promise">
@@ -5830,9 +6222,11 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     <li><a href="#ref-for-idl-promise②">4. VideoDecoder Interface</a> <a href="#ref-for-idl-promise③">(2)</a>
     <li><a href="#ref-for-idl-promise④">5. AudioEncoder Interface</a> <a href="#ref-for-idl-promise⑤">(2)</a>
     <li><a href="#ref-for-idl-promise⑥">6. VideoEncoder Interface</a> <a href="#ref-for-idl-promise⑦">(2)</a>
-    <li><a href="#ref-for-idl-promise⑧">10.2. ImageDecoder Interface</a> <a href="#ref-for-idl-promise⑨">(2)</a> <a href="#ref-for-idl-promise①⓪">(3)</a>
-    <li><a href="#ref-for-idl-promise①①">10.2.4. Methods</a> <a href="#ref-for-idl-promise①②">(2)</a> <a href="#ref-for-idl-promise①③">(3)</a> <a href="#ref-for-idl-promise①④">(4)</a> <a href="#ref-for-idl-promise①⑤">(5)</a>
-    <li><a href="#ref-for-idl-promise①⑥">10.6. ImageTrackList Interface</a>
+    <li><a href="#ref-for-idl-promise⑧">9.4. VideoFrame Interface</a>
+    <li><a href="#ref-for-idl-promise⑨">9.4.5. Methods</a>
+    <li><a href="#ref-for-idl-promise①⓪">10.2. ImageDecoder Interface</a> <a href="#ref-for-idl-promise①①">(2)</a> <a href="#ref-for-idl-promise①②">(3)</a>
+    <li><a href="#ref-for-idl-promise①③">10.2.4. Methods</a> <a href="#ref-for-idl-promise①④">(2)</a> <a href="#ref-for-idl-promise①⑤">(3)</a> <a href="#ref-for-idl-promise①⑥">(4)</a> <a href="#ref-for-idl-promise①⑦">(5)</a>
+    <li><a href="#ref-for-idl-promise①⑧">10.6. ImageTrackList Interface</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-exceptiondef-rangeerror">
@@ -5859,9 +6253,10 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     <li><a href="#ref-for-exceptiondef-typeerror①⓪">8.1.4. Methods</a>
     <li><a href="#ref-for-exceptiondef-typeerror①①">8.2.4. Methods</a>
     <li><a href="#ref-for-exceptiondef-typeerror①②">9.4.2. Constructors</a> <a href="#ref-for-exceptiondef-typeerror①③">(2)</a> <a href="#ref-for-exceptiondef-typeerror①④">(3)</a> <a href="#ref-for-exceptiondef-typeerror①⑤">(4)</a>
-    <li><a href="#ref-for-exceptiondef-typeerror①⑥">9.5.3. Methods</a>
-    <li><a href="#ref-for-exceptiondef-typeerror①⑦">10.2.2. Constructor</a>
-    <li><a href="#ref-for-exceptiondef-typeerror①⑧">10.2.4. Methods</a>
+    <li><a href="#ref-for-exceptiondef-typeerror①⑥">9.4.5. Methods</a>
+    <li><a href="#ref-for-exceptiondef-typeerror①⑦">9.4.6. Algorithms</a> <a href="#ref-for-exceptiondef-typeerror①⑧">(2)</a> <a href="#ref-for-exceptiondef-typeerror①⑨">(3)</a> <a href="#ref-for-exceptiondef-typeerror②⓪">(4)</a> <a href="#ref-for-exceptiondef-typeerror②①">(5)</a> <a href="#ref-for-exceptiondef-typeerror②②">(6)</a> <a href="#ref-for-exceptiondef-typeerror②③">(7)</a> <a href="#ref-for-exceptiondef-typeerror②④">(8)</a> <a href="#ref-for-exceptiondef-typeerror②⑤">(9)</a>
+    <li><a href="#ref-for-exceptiondef-typeerror②⑥">10.2.2. Constructor</a>
+    <li><a href="#ref-for-exceptiondef-typeerror②⑦">10.2.4. Methods</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-a-promise-rejected-with">
@@ -5929,7 +6324,8 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
   <aside class="dfn-panel" data-for="term-for-idl-sequence">
    <a href="https://heycam.github.io/webidl/#idl-sequence">https://heycam.github.io/webidl/#idl-sequence</a><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-idl-sequence">9.4. VideoFrame Interface</a>
+    <li><a href="#ref-for-idl-sequence">9.4. VideoFrame Interface</a> <a href="#ref-for-idl-sequence①">(2)</a>
+    <li><a href="#ref-for-idl-sequence②">9.5. VideoFrame CopyTo() Options</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-the-given-value">
@@ -5942,7 +6338,7 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
    <a href="https://heycam.github.io/webidl/#this">https://heycam.github.io/webidl/#this</a><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-this">9.2.4. Methods</a>
-    <li><a href="#ref-for-this①">9.4.4. Methods</a>
+    <li><a href="#ref-for-this①">9.4.5. Methods</a>
     <li><a href="#ref-for-this②">10.2.5. Algorithms</a> <a href="#ref-for-this③">(2)</a>
     <li><a href="#ref-for-this④">10.7.2. Attributes</a>
    </ul>
@@ -5959,11 +6355,10 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     <li><a href="#ref-for-idl-undefined②⑥">8.2. EncodedVideoChunk Interface</a>
     <li><a href="#ref-for-idl-undefined②⑦">9.2. AudioData Interface</a> <a href="#ref-for-idl-undefined②⑧">(2)</a>
     <li><a href="#ref-for-idl-undefined②⑨">9.4. VideoFrame Interface</a>
-    <li><a href="#ref-for-idl-undefined③⓪">9.5. Plane Interface</a>
-    <li><a href="#ref-for-idl-undefined③①">10.2. ImageDecoder Interface</a> <a href="#ref-for-idl-undefined③②">(2)</a> <a href="#ref-for-idl-undefined③③">(3)</a>
-    <li><a href="#ref-for-idl-undefined③④">10.2.3. Attributes</a>
-    <li><a href="#ref-for-idl-undefined③⑤">10.6. ImageTrackList Interface</a>
-    <li><a href="#ref-for-idl-undefined③⑥">10.6.2. Attributes</a>
+    <li><a href="#ref-for-idl-undefined③⓪">10.2. ImageDecoder Interface</a> <a href="#ref-for-idl-undefined③①">(2)</a> <a href="#ref-for-idl-undefined③②">(3)</a>
+    <li><a href="#ref-for-idl-undefined③③">10.2.3. Attributes</a>
+    <li><a href="#ref-for-idl-undefined③④">10.6. ImageTrackList Interface</a>
+    <li><a href="#ref-for-idl-undefined③⑤">10.6.2. Attributes</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-idl-unrestricted-float">
@@ -5988,17 +6383,19 @@ <h3 class="no-num no-ref heading settled" id="index-defined-here"><span class="c
     <li><a href="#ref-for-idl-unsigned-long③②">9.2. AudioData Interface</a> <a href="#ref-for-idl-unsigned-long③③">(2)</a> <a href="#ref-for-idl-unsigned-long③④">(3)</a> <a href="#ref-for-idl-unsigned-long③⑤">(4)</a> <a href="#ref-for-idl-unsigned-long③⑥">(5)</a>
     <li><a href="#ref-for-idl-unsigned-long③⑦">9.2.3. Attributes</a> <a href="#ref-for-idl-unsigned-long③⑧">(2)</a>
     <li><a href="#ref-for-idl-unsigned-long③⑨">9.2.6. AudioDataCopyToOptions</a> <a href="#ref-for-idl-unsigned-long④⓪">(2)</a> <a href="#ref-for-idl-unsigned-long④①">(3)</a> <a href="#ref-for-idl-unsigned-long④②">(4)</a> <a href="#ref-for-idl-unsigned-long④③">(5)</a> <a href="#ref-for-idl-unsigned-long④④">(6)</a>
-    <li><a href="#ref-for-idl-unsigned-long④⑤">9.4. VideoFrame Interface</a> <a href="#ref-for-idl-unsigned-long④⑥">(2)</a> <a href="#ref-for-idl-unsigned-long④⑦">(3)</a> <a href="#ref-for-idl-unsigned-long④⑧">(4)</a> <a href="#ref-for-idl-unsigned-long④⑨">(5)</a> <a href="#ref-for-idl-unsigned-long⑤⓪">(6)</a> <a href="#ref-for-idl-unsigned-long⑤①">(7)</a> <a href="#ref-for-idl-unsigned-long⑤②">(8)</a> <a href="#ref-for-idl-unsigned-long⑤③">(9)</a> <a href="#ref-for-idl-unsigned-long⑤④">(10)</a> <a href="#ref-for-idl-unsigned-long⑤⑤">(11)</a> <a href="#ref-for-idl-unsigned-long⑤⑥">(12)</a> <a href="#ref-for-idl-unsigned-long⑤⑦">(13)</a> <a href="#ref-for-idl-unsigned-long⑤⑧">(14)</a> <a href="#ref-for-idl-unsigned-long⑤⑨">(15)</a> <a href="#ref-for-idl-unsigned-long⑥⓪">(16)</a>
-    <li><a href="#ref-for-idl-unsigned-long⑥①">9.4.3. Attributes</a> <a href="#ref-for-idl-unsigned-long⑥②">(2)</a> <a href="#ref-for-idl-unsigned-long⑥③">(3)</a> <a href="#ref-for-idl-unsigned-long⑥④">(4)</a> <a href="#ref-for-idl-unsigned-long⑥⑤">(5)</a> <a href="#ref-for-idl-unsigned-long⑥⑥">(6)</a> <a href="#ref-for-idl-unsigned-long⑥⑦">(7)</a> <a href="#ref-for-idl-unsigned-long⑥⑧">(8)</a>
-    <li><a href="#ref-for-idl-unsigned-long⑥⑨">9.5. Plane Interface</a> <a href="#ref-for-idl-unsigned-long⑦⓪">(2)</a> <a href="#ref-for-idl-unsigned-long⑦①">(3)</a> <a href="#ref-for-idl-unsigned-long⑦②">(4)</a> <a href="#ref-for-idl-unsigned-long⑦③">(5)</a>
-    <li><a href="#ref-for-idl-unsigned-long⑦④">9.5.2. Attributes</a> <a href="#ref-for-idl-unsigned-long⑦⑤">(2)</a> <a href="#ref-for-idl-unsigned-long⑦⑥">(3)</a>
-    <li><a href="#ref-for-idl-unsigned-long⑦⑦">10.2.5. Algorithms</a> <a href="#ref-for-idl-unsigned-long⑦⑧">(2)</a>
-    <li><a href="#ref-for-idl-unsigned-long⑦⑨">10.3. ImageDecoderInit Interface</a> <a href="#ref-for-idl-unsigned-long⑧⓪">(2)</a> <a href="#ref-for-idl-unsigned-long⑧①">(3)</a> <a href="#ref-for-idl-unsigned-long⑧②">(4)</a>
-    <li><a href="#ref-for-idl-unsigned-long⑧③">10.4. ImageDecodeOptions Interface</a> <a href="#ref-for-idl-unsigned-long⑧④">(2)</a>
-    <li><a href="#ref-for-idl-unsigned-long⑧⑤">10.6. ImageTrackList Interface</a> <a href="#ref-for-idl-unsigned-long⑧⑥">(2)</a>
-    <li><a href="#ref-for-idl-unsigned-long⑧⑦">10.6.2. Attributes</a>
-    <li><a href="#ref-for-idl-unsigned-long⑧⑧">10.7. ImageTrack Interface</a>
-    <li><a href="#ref-for-idl-unsigned-long⑧⑨">10.7.2. Attributes</a>
+    <li><a href="#ref-for-idl-unsigned-long④⑤">9.4. VideoFrame Interface</a> <a href="#ref-for-idl-unsigned-long④⑥">(2)</a> <a href="#ref-for-idl-unsigned-long④⑦">(3)</a> <a href="#ref-for-idl-unsigned-long④⑧">(4)</a> <a href="#ref-for-idl-unsigned-long④⑨">(5)</a> <a href="#ref-for-idl-unsigned-long⑤⓪">(6)</a> <a href="#ref-for-idl-unsigned-long⑤①">(7)</a> <a href="#ref-for-idl-unsigned-long⑤②">(8)</a> <a href="#ref-for-idl-unsigned-long⑤③">(9)</a> <a href="#ref-for-idl-unsigned-long⑤④">(10)</a> <a href="#ref-for-idl-unsigned-long⑤⑤">(11)</a>
+    <li><a href="#ref-for-idl-unsigned-long⑤⑥">9.4.3. Attributes</a> <a href="#ref-for-idl-unsigned-long⑤⑦">(2)</a> <a href="#ref-for-idl-unsigned-long⑤⑧">(3)</a> <a href="#ref-for-idl-unsigned-long⑤⑨">(4)</a>
+    <li><a href="#ref-for-idl-unsigned-long⑥⓪">9.4.4. Internal Structures</a> <a href="#ref-for-idl-unsigned-long⑥①">(2)</a> <a href="#ref-for-idl-unsigned-long⑥②">(3)</a> <a href="#ref-for-idl-unsigned-long⑥③">(4)</a> <a href="#ref-for-idl-unsigned-long⑥④">(5)</a> <a href="#ref-for-idl-unsigned-long⑥⑤">(6)</a> <a href="#ref-for-idl-unsigned-long⑥⑥">(7)</a>
+    <li><a href="#ref-for-idl-unsigned-long⑥⑦">9.4.6. Algorithms</a>
+    <li><a href="#ref-for-idl-unsigned-long⑥⑧">9.6. VideoFrame Rectangle (Rect)</a> <a href="#ref-for-idl-unsigned-long⑥⑨">(2)</a> <a href="#ref-for-idl-unsigned-long⑦⓪">(3)</a> <a href="#ref-for-idl-unsigned-long⑦①">(4)</a> <a href="#ref-for-idl-unsigned-long⑦②">(5)</a> <a href="#ref-for-idl-unsigned-long⑦③">(6)</a> <a href="#ref-for-idl-unsigned-long⑦④">(7)</a> <a href="#ref-for-idl-unsigned-long⑦⑤">(8)</a>
+    <li><a href="#ref-for-idl-unsigned-long⑦⑥">9.7. Plane Layout</a> <a href="#ref-for-idl-unsigned-long⑦⑦">(2)</a> <a href="#ref-for-idl-unsigned-long⑦⑧">(3)</a> <a href="#ref-for-idl-unsigned-long⑦⑨">(4)</a>
+    <li><a href="#ref-for-idl-unsigned-long⑧⓪">10.2.5. Algorithms</a> <a href="#ref-for-idl-unsigned-long⑧①">(2)</a>
+    <li><a href="#ref-for-idl-unsigned-long⑧②">10.3. ImageDecoderInit Interface</a> <a href="#ref-for-idl-unsigned-long⑧③">(2)</a> <a href="#ref-for-idl-unsigned-long⑧④">(3)</a> <a href="#ref-for-idl-unsigned-long⑧⑤">(4)</a>
+    <li><a href="#ref-for-idl-unsigned-long⑧⑥">10.4. ImageDecodeOptions Interface</a> <a href="#ref-for-idl-unsigned-long⑧⑦">(2)</a>
+    <li><a href="#ref-for-idl-unsigned-long⑧⑧">10.6. ImageTrackList Interface</a> <a href="#ref-for-idl-unsigned-long⑧⑨">(2)</a>
+    <li><a href="#ref-for-idl-unsigned-long⑨⓪">10.6.2. Attributes</a>
+    <li><a href="#ref-for-idl-unsigned-long⑨①">10.7. ImageTrack Interface</a>
+    <li><a href="#ref-for-idl-unsigned-long⑨②">10.7.2. Attributes</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="term-for-idl-unsigned-long-long">
@@ -6111,6 +6508,13 @@ <h3 class="no-num no-ref heading settled" id="index-defined-elsewhere"><span cla
     <ul>
      <li><span class="dfn-paneled" id="term-for-dom-mediasource-istypesupported">isTypeSupported()</span>
     </ul>
+   <li>
+    <a data-link-type="biblio">[MEDIASTREAM-RECORDING]</a> defines the following terms:
+    <ul>
+     <li><span class="dfn-paneled" id="term-for-bitratemode">BitrateMode</span>
+     <li><span class="dfn-paneled" id="term-for-dom-bitratemode-constant">constant</span>
+     <li><span class="dfn-paneled" id="term-for-dom-bitratemode-variable">variable</span>
+    </ul>
    <li>
     <a data-link-type="biblio">[MIMESNIFF]</a> defines the following terms:
     <ul>
@@ -6139,7 +6543,6 @@ <h3 class="no-num no-ref heading settled" id="index-defined-elsewhere"><span cla
     <ul>
      <li><span class="dfn-paneled" id="term-for-aborterror">AbortError</span>
      <li><span class="dfn-paneled" id="term-for-AllowShared">AllowShared</span>
-     <li><span class="dfn-paneled" id="term-for-ArrayBufferView">ArrayBufferView</span>
      <li><span class="dfn-paneled" id="term-for-BufferSource">BufferSource</span>
      <li><span class="dfn-paneled" id="term-for-idl-DOMException">DOMException</span>
      <li><span class="dfn-paneled" id="term-for-idl-DOMString">DOMString</span>
@@ -6147,7 +6550,6 @@ <h3 class="no-num no-ref heading settled" id="index-defined-elsewhere"><span cla
      <li><span class="dfn-paneled" id="term-for-encodingerror">EncodingError</span>
      <li><span class="dfn-paneled" id="term-for-EnforceRange">EnforceRange</span>
      <li><span class="dfn-paneled" id="term-for-Exposed">Exposed</span>
-     <li><span class="dfn-paneled" id="term-for-idl-frozen-array">FrozenArray</span>
      <li><span class="dfn-paneled" id="term-for-invalidstateerror">InvalidStateError</span>
      <li><span class="dfn-paneled" id="term-for-notreadableerror">NotReadableError</span>
      <li><span class="dfn-paneled" id="term-for-notsupportederror">NotSupportedError</span>
@@ -6200,6 +6602,8 @@ <h3 class="no-num no-ref heading settled" id="normative"><span class="content">N
    <dd>Anne van Kesteren; Domenic Denicola. <a href="https://infra.spec.whatwg.org/">Infra Standard</a>. Living Standard. URL: <a href="https://infra.spec.whatwg.org/">https://infra.spec.whatwg.org/</a>
    <dt id="biblio-media-capabilities">[MEDIA-CAPABILITIES]
    <dd>Mounir Lamouri; Chris Cunningham; Vi Nguyen. <a href="https://www.w3.org/TR/media-capabilities/">Media Capabilities</a>. 4 June 2021. WD. URL: <a href="https://www.w3.org/TR/media-capabilities/">https://www.w3.org/TR/media-capabilities/</a>
+   <dt id="biblio-mediastream-recording">[MEDIASTREAM-RECORDING]
+   <dd>Miguel Casas-sanchez; James Barnett; Travis Leithead. <a href="https://www.w3.org/TR/mediastream-recording/">MediaStream Recording</a>. 4 June 2021. WD. URL: <a href="https://www.w3.org/TR/mediastream-recording/">https://www.w3.org/TR/mediastream-recording/</a>
    <dt id="biblio-mimesniff">[MIMESNIFF]
    <dd>Gordon P. Hemsley. <a href="https://mimesniff.spec.whatwg.org/">MIME Sniffing Standard</a>. Living Standard. URL: <a href="https://mimesniff.spec.whatwg.org/">https://mimesniff.spec.whatwg.org/</a>
    <dt id="biblio-streams">[STREAMS]
@@ -6226,7 +6630,7 @@ <h3 class="no-num no-ref heading settled" id="informative"><span class="content"
    <dt id="biblio-webaudio">[WEBAUDIO]
    <dd>Paul Adenot; Hongchan Choi. <a href="https://www.w3.org/TR/webaudio/">Web Audio API</a>. 6 May 2021. PR. URL: <a href="https://www.w3.org/TR/webaudio/">https://www.w3.org/TR/webaudio/</a>
    <dt id="biblio-webcodecs-codec-registry">[WEBCODECS-CODEC-REGISTRY]
-   <dd>Chris Cunningham; Paul Adenot; Bernard Aboba. <a href="https://www.w3.org/TR/webcodecs-codec-registry/">WebCodecs Codec Registry</a>. 8 June 2021. WD. URL: <a href="https://www.w3.org/TR/webcodecs-codec-registry/">https://www.w3.org/TR/webcodecs-codec-registry/</a>
+   <dd>Chris Cunningham; Paul Adenot; Bernard Aboba. <a href="https://www.w3.org/TR/webcodecs-codec-registry/">WebCodecs Codec Registry</a>. 11 June 2021. WD. URL: <a href="https://www.w3.org/TR/webcodecs-codec-registry/">https://www.w3.org/TR/webcodecs-codec-registry/</a>
   </dl>
   <h2 class="no-num no-ref heading settled" id="idl-index"><span class="content">IDL Index</span><a class="self-link" href="#idl-index"></a></h2>
 <pre class="idl highlight def">[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed"><c- g>Exposed</c-></a>=(<c- n>Window</c->,<c- n>DedicatedWorker</c->)]
@@ -6387,6 +6791,7 @@ <h2 class="no-num no-ref heading settled" id="idl-index"><span class="content">I
   [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-videoencoderconfig-displayheight"><c- g>displayHeight</c-></a>;
   <a data-link-type="idl-name" href="#enumdef-hardwareacceleration"><c- n>HardwareAcceleration</c-></a> <a class="idl-code" data-default="&quot;allow&quot;" data-link-type="dict-member" data-type="HardwareAcceleration " href="#dom-videoencoderconfig-hardwareacceleration"><c- g>hardwareAcceleration</c-></a> = "allow";
   <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-DOMString"><c- b>DOMString</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="DOMString " href="#dom-videoencoderconfig-scalabilitymode"><c- g>scalabilityMode</c-></a>;
+  <a data-link-type="idl-name" href="https://www.w3.org/TR/mediastream-recording/#bitratemode"><c- n>BitrateMode</c-></a> <a class="idl-code" data-default="&quot;variable&quot;" data-link-type="dict-member" data-type="BitrateMode " href="#dom-videoencoderconfig-bitratemode"><c- g>bitrateMode</c-></a> = "variable";
 };
 
 <c- b>enum</c-> <a href="#enumdef-hardwareacceleration"><code><c- g>HardwareAcceleration</c-></code></a> {
@@ -6500,22 +6905,23 @@ <h2 class="no-num no-ref heading settled" id="idl-index"><span class="content">I
 [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed"><c- g>Exposed</c-></a>=(<c- n>Window</c->,<c- n>DedicatedWorker</c->)]
 <c- b>interface</c-> <a href="#videoframe"><code><c- g>VideoFrame</c-></code></a> {
   <a class="idl-code" data-link-type="constructor" href="#dom-videoframe-videoframe"><c- g>constructor</c-></a>(<a data-link-type="idl-name" href="https://html.spec.whatwg.org/multipage/canvas.html#canvasimagesource"><c- n>CanvasImageSource</c-></a> <a href="#dom-videoframe-videoframe-image-init-image"><code><c- g>image</c-></code></a>, <c- b>optional</c-> <a data-link-type="idl-name" href="#dictdef-videoframeinit"><c- n>VideoFrameInit</c-></a> <a href="#dom-videoframe-videoframe-image-init-init"><code><c- g>init</c-></code></a> = {});
-  <a class="idl-code" data-link-type="constructor" href="#dom-videoframe-videoframe-planes-init"><c- g>constructor</c-></a>(<a data-link-type="dfn" href="https://heycam.github.io/webidl/#idl-sequence"><c- b>sequence</c-></a>&lt;(<a data-link-type="idl-name" href="#plane"><c- n>Plane</c-></a> <c- b>or</c-> <a data-link-type="idl-name" href="#dictdef-planeinit"><c- n>PlaneInit</c-></a>)> <a href="#dom-videoframe-videoframe-planes-init-planes"><code><c- g>planes</c-></code></a>,
+  <a class="idl-code" data-link-type="constructor" href="#dom-videoframe-videoframe-planes-init"><c- g>constructor</c-></a>(<a data-link-type="dfn" href="https://heycam.github.io/webidl/#idl-sequence"><c- b>sequence</c-></a>&lt;<a data-link-type="idl-name" href="#dictdef-planeinit"><c- n>PlaneInit</c-></a>> <a href="#dom-videoframe-videoframe-planes-init-planes"><code><c- g>planes</c-></code></a>,
               <a data-link-type="idl-name" href="#dictdef-videoframeplaneinit"><c- n>VideoFramePlaneInit</c-></a> <a href="#dom-videoframe-videoframe-planes-init-init"><code><c- g>init</c-></code></a>);
 
   <c- b>readonly</c-> <c- b>attribute</c-> <a data-link-type="idl-name" href="#enumdef-pixelformat"><c- n>PixelFormat</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="PixelFormat" href="#dom-videoframe-format"><c- g>format</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-frozen-array"><c- b>FrozenArray</c-></a>&lt;<a data-link-type="idl-name" href="#plane"><c- n>Plane</c-></a>>? <a class="idl-code" data-link-type="attribute" data-readonly data-type="FrozenArray<Plane>?" href="#dom-videoframe-planes"><c- g>planes</c-></a>;
   <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-codedwidth"><c- g>codedWidth</c-></a>;
   <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-codedheight"><c- g>codedHeight</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-cropleft"><c- g>cropLeft</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-croptop"><c- g>cropTop</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-cropwidth"><c- g>cropWidth</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-cropheight"><c- g>cropHeight</c-></a>;
+  <c- b>readonly</c-> <c- b>attribute</c-> <a data-link-type="idl-name" href="#dictdef-videoframerect"><c- n>VideoFrameRect</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="VideoFrameRect" href="#dom-videoframe-codedrect"><c- g>codedRect</c-></a>;
+  <c- b>readonly</c-> <c- b>attribute</c-> <a data-link-type="idl-name" href="#dictdef-videoframerect"><c- n>VideoFrameRect</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="VideoFrameRect" href="#dom-videoframe-visiblerect"><c- g>visibleRect</c-></a>;
   <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-displaywidth"><c- g>displayWidth</c-></a>;
   <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-videoframe-displayheight"><c- g>displayHeight</c-></a>;
   <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long-long"><c- b>unsigned</c-> <c- b>long</c-> <c- b>long</c-></a>? <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long long?" href="#dom-videoframe-duration"><c- g>duration</c-></a>;  // microseconds
   <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-long-long"><c- b>long</c-> <c- b>long</c-></a>? <a class="idl-code" data-link-type="attribute" data-readonly data-type="long long?" href="#dom-videoframe-timestamp"><c- g>timestamp</c-></a>;          // microseconds
-
+  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="method" href="#dom-videoframe-allocationsize"><c- g>allocationSize</c-></a>(
+      <c- b>optional</c-> <a data-link-type="idl-name" href="#dictdef-videoframecopytooptions"><c- n>VideoFrameCopyToOptions</c-></a> <a href="#dom-videoframe-allocationsize-options-options"><code><c- g>options</c-></code></a> = {});
+  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-promise"><c- b>Promise</c-></a>&lt;<a data-link-type="dfn" href="https://heycam.github.io/webidl/#idl-sequence"><c- b>sequence</c-></a>&lt;<a data-link-type="idl-name" href="#dictdef-planelayout"><c- n>PlaneLayout</c-></a>>> <a class="idl-code" data-link-type="method" href="#dom-videoframe-copyto"><c- g>copyTo</c-></a>(
+      [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#AllowShared"><c- g>AllowShared</c-></a>] <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#BufferSource"><c- n>BufferSource</c-></a> <a href="#dom-videoframe-copyto-destination-options-destination"><code><c- g>destination</c-></code></a>,
+      <c- b>optional</c-> <a data-link-type="idl-name" href="#dictdef-videoframecopytooptions"><c- n>VideoFrameCopyToOptions</c-></a> <a href="#dom-videoframe-copyto-destination-options-options"><code><c- g>options</c-></code></a> = {});
   <a data-link-type="idl-name" href="#videoframe"><c- n>VideoFrame</c-></a> <a class="idl-code" data-link-type="method" href="#dom-videoframe-clone"><c- g>clone</c-></a>();
   <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-undefined"><c- b>undefined</c-></a> <a class="idl-code" data-link-type="method" href="#dom-videoframe-close"><c- g>close</c-></a>();
 };
@@ -6529,29 +6935,34 @@ <h2 class="no-num no-ref heading settled" id="idl-index"><span class="content">I
   <c- b>required</c-> <a data-link-type="idl-name" href="#enumdef-pixelformat"><c- n>PixelFormat</c-></a> <a data-type="PixelFormat " href="#dom-videoframeplaneinit-format"><code><c- g>format</c-></code></a>;
   [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a data-type="unsigned long " href="#dom-videoframeplaneinit-codedwidth"><code><c- g>codedWidth</c-></code></a>;
   [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a data-type="unsigned long " href="#dom-videoframeplaneinit-codedheight"><code><c- g>codedHeight</c-></code></a>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a data-type="unsigned long " href="#dom-videoframeplaneinit-cropleft"><code><c- g>cropLeft</c-></code></a>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a data-type="unsigned long " href="#dom-videoframeplaneinit-croptop"><code><c- g>cropTop</c-></code></a>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a data-type="unsigned long " href="#dom-videoframeplaneinit-cropwidth"><code><c- g>cropWidth</c-></code></a>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a data-type="unsigned long " href="#dom-videoframeplaneinit-cropheight"><code><c- g>cropHeight</c-></code></a>;
+  <a data-link-type="idl-name" href="#dictdef-videoframerect"><c- n>VideoFrameRect</c-></a> <a data-type="VideoFrameRect " href="#dom-videoframeplaneinit-visiblerect"><code><c- g>visibleRect</c-></code></a>;
   [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a data-type="unsigned long " href="#dom-videoframeplaneinit-displaywidth"><code><c- g>displayWidth</c-></code></a>;
   [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a data-type="unsigned long " href="#dom-videoframeplaneinit-displayheight"><code><c- g>displayHeight</c-></code></a>;
   [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long-long"><c- b>unsigned</c-> <c- b>long</c-> <c- b>long</c-></a> <a data-type="unsigned long long " href="#dom-videoframeplaneinit-duration"><code><c- g>duration</c-></code></a>;  // microseconds
   [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-long-long"><c- b>long</c-> <c- b>long</c-></a> <a data-type="long long " href="#dom-videoframeplaneinit-timestamp"><code><c- g>timestamp</c-></code></a>;          // microseconds
 };
 
-[<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#Exposed"><c- g>Exposed</c-></a>=(<c- n>Window</c->,<c- n>DedicatedWorker</c->)]
-<c- b>interface</c-> <a href="#plane"><code><c- g>Plane</c-></code></a> {
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-plane-stride"><c- g>stride</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-plane-rows"><c- g>rows</c-></a>;
-  <c- b>readonly</c-> <c- b>attribute</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="attribute" data-readonly data-type="unsigned long" href="#dom-plane-length"><c- g>length</c-></a>;
+<c- b>dictionary</c-> <a href="#dictdef-planeinit"><code><c- g>PlaneInit</c-></code></a> {
+  <c- b>required</c-> <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#BufferSource"><c- n>BufferSource</c-></a> <a data-type="BufferSource " href="#dom-planeinit-data"><code><c- g>data</c-></code></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a data-type="unsigned long " href="#dom-planeinit-stride"><code><c- g>stride</c-></code></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a data-default="0" data-type="unsigned long " href="#dom-planeinit-offset"><code><c- g>offset</c-></code></a> = 0;
+};
 
-  <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-undefined"><c- b>undefined</c-></a> <a class="idl-code" data-link-type="method" href="#dom-plane-readinto"><c- g>readInto</c-></a>(<a data-link-type="idl-name" href="https://heycam.github.io/webidl/#ArrayBufferView"><c- n>ArrayBufferView</c-></a> <a href="#dom-plane-readinto-dst-dst"><code><c- g>dst</c-></code></a>);
+<c- b>dictionary</c-> <a href="#dictdef-videoframecopytooptions"><code><c- g>VideoFrameCopyToOptions</c-></code></a> {
+  <a data-link-type="idl-name" href="#dictdef-videoframerect"><c- n>VideoFrameRect</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="VideoFrameRect " href="#dom-videoframecopytooptions-rect"><c- g>rect</c-></a>;
+  <a data-link-type="dfn" href="https://heycam.github.io/webidl/#idl-sequence"><c- b>sequence</c-></a>&lt;<a data-link-type="idl-name" href="#dictdef-planelayout"><c- n>PlaneLayout</c-></a>> <a class="idl-code" data-link-type="dict-member" data-type="sequence<PlaneLayout> " href="#dom-videoframecopytooptions-layout"><c- g>layout</c-></a>;
 };
 
-<c- b>dictionary</c-> <a href="#dictdef-planeinit"><code><c- g>PlaneInit</c-></code></a> {
-  <c- b>required</c-> <a data-link-type="idl-name" href="https://heycam.github.io/webidl/#BufferSource"><c- n>BufferSource</c-></a> <a data-type="BufferSource " href="#dom-planeinit-src"><code><c- g>src</c-></code></a>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a data-type="unsigned long " href="#dom-planeinit-stride"><code><c- g>stride</c-></code></a>;
-  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a data-type="unsigned long " href="#dom-planeinit-rows"><code><c- g>rows</c-></code></a>;
+<c- b>dictionary</c-> <a href="#dictdef-videoframerect"><code><c- g>VideoFrameRect</c-></code></a> {
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-videoframerect-left"><c- g>left</c-></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-videoframerect-top"><c- g>top</c-></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-videoframerect-width"><c- g>width</c-></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-videoframerect-height"><c- g>height</c-></a>;
+};
+
+<c- b>dictionary</c-> <a href="#dictdef-planelayout"><code><c- g>PlaneLayout</c-></code></a> {
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-planelayout-offset"><c- g>offset</c-></a>;
+  [<a class="idl-code" data-link-type="extended-attribute" href="https://heycam.github.io/webidl/#EnforceRange"><c- g>EnforceRange</c-></a>] <c- b>required</c-> <a class="idl-code" data-link-type="interface" href="https://heycam.github.io/webidl/#idl-unsigned-long"><c- b>unsigned</c-> <c- b>long</c-></a> <a class="idl-code" data-link-type="dict-member" data-type="unsigned long " href="#dom-planelayout-stride"><c- g>stride</c-></a>;
 };
 
 <c- b>enum</c-> <a href="#enumdef-pixelformat"><code><c- g>PixelFormat</c-></code></a> {
@@ -6623,13 +7034,10 @@ <h2 class="no-num no-ref heading settled" id="idl-index"><span class="content">I
   <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content">Issues Index</span><a class="self-link" href="#issues-index"></a></h2>
   <div style="counter-reset:issue">
    <div class="issue"> The spec should list additional format specific validation steps (
-    e.g. number and order of planes, acceptable sizing, etc...).  See <a href="https://github.com/w3c/webcodecs/issues/165">#165</a>.<a href="#issue-6bd004c9"> ↵ </a></div>
+    e.g. number and order of planes, acceptable sizing, etc...). See <a href="https://github.com/w3c/webcodecs/issues/165">#165</a>.<a href="#issue-6bd004c9"> ↵ </a></div>
    <div class="issue"> The spec should define explicit rules for each <code class="idl"><a data-link-type="idl" href="#enumdef-pixelformat">PixelFormat</a></code> and reference them in the steps above. See <a href="https://github.com/w3c/webcodecs/issues/165">#165</a>.<a href="#issue-ed2f363d"> ↵ </a></div>
-   <div class="issue"> The spec should provide a definition (and possibly
-    diagrams) for stride. See <a href="https://github.com/w3c/webcodecs/issues/166">#166</a>.<a href="#issue-e9094ad1"> ↵ </a></div>
    <div class="issue"> The spec should provide definitions (and possibly diagrams) for
-    coded size, crop size, and display size. See <a href="https://github.com/w3c/webcodecs/issues/166">#166</a>.<a href="#issue-6c7fe7de"> ↵ </a></div>
-   <div class="issue"> The spec should define explicit rules for each <code class="idl"><a data-link-type="idl" href="#enumdef-pixelformat">PixelFormat</a></code> and reference them in the step above. See <a href="https://github.com/w3c/webcodecs/issues/165">#165</a>.<a href="#issue-ca862628"> ↵ </a></div>
+    coded size, visible rectangle, and display size. See <a href="https://github.com/w3c/webcodecs/issues/166">#166</a>.<a href="#issue-3beeea62"> ↵ </a></div>
   </div>
   <aside class="dfn-panel" data-for="codec">
    <b><a href="#codec">#codec</a></b><b>Referenced in:</b>
@@ -6720,8 +7128,9 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
     <li><a href="#ref-for-control-thread②⓪">5.5. Algorithms</a>
     <li><a href="#ref-for-control-thread②①">6.4. Methods</a> <a href="#ref-for-control-thread②②">(2)</a> <a href="#ref-for-control-thread②③">(3)</a> <a href="#ref-for-control-thread②④">(4)</a> <a href="#ref-for-control-thread②⑤">(5)</a>
     <li><a href="#ref-for-control-thread②⑥">6.5. Algorithms</a>
-    <li><a href="#ref-for-control-thread②⑦">10.2.2. Constructor</a>
-    <li><a href="#ref-for-control-thread②⑧">10.2.5. Algorithms</a> <a href="#ref-for-control-thread②⑨">(2)</a> <a href="#ref-for-control-thread③⓪">(3)</a> <a href="#ref-for-control-thread③①">(4)</a> <a href="#ref-for-control-thread③②">(5)</a> <a href="#ref-for-control-thread③③">(6)</a> <a href="#ref-for-control-thread③④">(7)</a> <a href="#ref-for-control-thread③⑤">(8)</a> <a href="#ref-for-control-thread③⑥">(9)</a>
+    <li><a href="#ref-for-control-thread②⑦">9.4.5. Methods</a>
+    <li><a href="#ref-for-control-thread②⑧">10.2.2. Constructor</a>
+    <li><a href="#ref-for-control-thread②⑨">10.2.5. Algorithms</a> <a href="#ref-for-control-thread③⓪">(2)</a> <a href="#ref-for-control-thread③①">(3)</a> <a href="#ref-for-control-thread③②">(4)</a> <a href="#ref-for-control-thread③③">(5)</a> <a href="#ref-for-control-thread③④">(6)</a> <a href="#ref-for-control-thread③⑤">(7)</a> <a href="#ref-for-control-thread③⑥">(8)</a> <a href="#ref-for-control-thread③⑦">(9)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="codec-thread">
@@ -6734,22 +7143,30 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
   <aside class="dfn-panel" data-for="control-message-queue">
    <b><a href="#control-message-queue">#control-message-queue</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-control-message-queue">2.2. Control Thread and Codec Thread</a> <a href="#ref-for-control-message-queue①">(2)</a> <a href="#ref-for-control-message-queue②">(3)</a> <a href="#ref-for-control-message-queue③">(4)</a>
-    <li><a href="#ref-for-control-message-queue④">3.4. Methods</a> <a href="#ref-for-control-message-queue⑤">(2)</a>
+    <li><a href="#ref-for-control-message-queue">2.2. Control Thread and Codec Thread</a> <a href="#ref-for-control-message-queue①">(2)</a> <a href="#ref-for-control-message-queue②">(3)</a>
+    <li><a href="#ref-for-control-message-queue③">3.4. Methods</a> <a href="#ref-for-control-message-queue④">(2)</a>
+    <li><a href="#ref-for-control-message-queue⑤">3.5. Algorithms</a>
     <li><a href="#ref-for-control-message-queue⑥">4.4. Methods</a> <a href="#ref-for-control-message-queue⑦">(2)</a>
-    <li><a href="#ref-for-control-message-queue⑧">5.4. Methods</a> <a href="#ref-for-control-message-queue⑨">(2)</a>
-    <li><a href="#ref-for-control-message-queue①⓪">6.4. Methods</a> <a href="#ref-for-control-message-queue①①">(2)</a>
-    <li><a href="#ref-for-control-message-queue①②">10.7.2. Attributes</a>
+    <li><a href="#ref-for-control-message-queue⑧">4.5. Algorithms</a>
+    <li><a href="#ref-for-control-message-queue⑨">5.4. Methods</a> <a href="#ref-for-control-message-queue①⓪">(2)</a>
+    <li><a href="#ref-for-control-message-queue①①">5.5. Algorithms</a>
+    <li><a href="#ref-for-control-message-queue①②">6.4. Methods</a> <a href="#ref-for-control-message-queue①③">(2)</a>
+    <li><a href="#ref-for-control-message-queue①④">6.5. Algorithms</a>
+    <li><a href="#ref-for-control-message-queue①⑤">10.7.2. Attributes</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="control-messages">
    <b><a href="#control-messages">#control-messages</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-control-messages">2.2. Control Thread and Codec Thread</a> <a href="#ref-for-control-messages①">(2)</a> <a href="#ref-for-control-messages②">(3)</a> <a href="#ref-for-control-messages③">(4)</a>
-    <li><a href="#ref-for-control-messages④">3.4. Methods</a> <a href="#ref-for-control-messages⑤">(2)</a>
+    <li><a href="#ref-for-control-messages">2.2. Control Thread and Codec Thread</a> <a href="#ref-for-control-messages①">(2)</a> <a href="#ref-for-control-messages②">(3)</a>
+    <li><a href="#ref-for-control-messages③">3.4. Methods</a> <a href="#ref-for-control-messages④">(2)</a>
+    <li><a href="#ref-for-control-messages⑤">3.5. Algorithms</a>
     <li><a href="#ref-for-control-messages⑥">4.4. Methods</a> <a href="#ref-for-control-messages⑦">(2)</a>
-    <li><a href="#ref-for-control-messages⑧">5.4. Methods</a> <a href="#ref-for-control-messages⑨">(2)</a>
-    <li><a href="#ref-for-control-messages①⓪">6.4. Methods</a> <a href="#ref-for-control-messages①①">(2)</a>
+    <li><a href="#ref-for-control-messages⑧">4.5. Algorithms</a>
+    <li><a href="#ref-for-control-messages⑨">5.4. Methods</a> <a href="#ref-for-control-messages①⓪">(2)</a>
+    <li><a href="#ref-for-control-messages①①">5.5. Algorithms</a>
+    <li><a href="#ref-for-control-messages①②">6.4. Methods</a> <a href="#ref-for-control-messages①③">(2)</a>
+    <li><a href="#ref-for-control-messages①④">6.5. Algorithms</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="enqueues-a-control-message">
@@ -6777,21 +7194,6 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
     <li><a href="#ref-for-running-a-control-message①⑥">10.7.2. Attributes</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="injected-state">
-   <b><a href="#injected-state">#injected-state</a></b><b>Referenced in:</b>
-   <ul>
-    <li><a href="#ref-for-injected-state">2.2. Control Thread and Codec Thread</a>
-   </ul>
-  </aside>
-  <aside class="dfn-panel" data-for="reset-the-control-message-queue">
-   <b><a href="#reset-the-control-message-queue">#reset-the-control-message-queue</a></b><b>Referenced in:</b>
-   <ul>
-    <li><a href="#ref-for-reset-the-control-message-queue">3.5. Algorithms</a>
-    <li><a href="#ref-for-reset-the-control-message-queue①">4.5. Algorithms</a>
-    <li><a href="#ref-for-reset-the-control-message-queue②">5.5. Algorithms</a>
-    <li><a href="#ref-for-reset-the-control-message-queue③">6.5. Algorithms</a>
-   </ul>
-  </aside>
   <aside class="dfn-panel" data-for="codec-processing-loop">
    <b><a href="#codec-processing-loop">#codec-processing-loop</a></b><b>Referenced in:</b>
    <ul>
@@ -6837,6 +7239,8 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <ul>
     <li><a href="#ref-for-dom-audiodecoder-error-callback-slot">3.2. Constructors</a>
     <li><a href="#ref-for-dom-audiodecoder-error-callback-slot①">3.5. Algorithms</a>
+    <li><a href="#ref-for-dom-audiodecoder-error-callback-slot②">5.5. Algorithms</a>
+    <li><a href="#ref-for-dom-audiodecoder-error-callback-slot③">6.5. Algorithms</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-audiodecoder-key-chunk-required-slot">
@@ -6863,6 +7267,13 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
     <li><a href="#ref-for-dom-audiodecoder-decodequeuesize-slot③">3.5. Algorithms</a>
    </ul>
   </aside>
+  <aside class="dfn-panel" data-for="dom-audiodecoder-pending-flush-promises-slot">
+   <b><a href="#dom-audiodecoder-pending-flush-promises-slot">#dom-audiodecoder-pending-flush-promises-slot</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dom-audiodecoder-pending-flush-promises-slot">3.4. Methods</a> <a href="#ref-for-dom-audiodecoder-pending-flush-promises-slot①">(2)</a>
+    <li><a href="#ref-for-dom-audiodecoder-pending-flush-promises-slot②">3.5. Algorithms</a> <a href="#ref-for-dom-audiodecoder-pending-flush-promises-slot③">(2)</a>
+   </ul>
+  </aside>
   <aside class="dfn-panel" data-for="dom-audiodecoder-audiodecoder">
    <b><a href="#dom-audiodecoder-audiodecoder">#dom-audiodecoder-audiodecoder</a></b><b>Referenced in:</b>
    <ul>
@@ -6898,6 +7309,7 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <b><a href="#dom-audiodecoder-flush">#dom-audiodecoder-flush</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-dom-audiodecoder-flush">3. AudioDecoder Interface</a>
+    <li><a href="#ref-for-dom-audiodecoder-flush①">3.1. Internal Slots</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-audiodecoder-reset">
@@ -7010,6 +7422,13 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
     <li><a href="#ref-for-dom-videodecoder-decodequeuesize-slot③">4.5. Algorithms</a>
    </ul>
   </aside>
+  <aside class="dfn-panel" data-for="dom-videodecoder-pending-flush-promises-slot">
+   <b><a href="#dom-videodecoder-pending-flush-promises-slot">#dom-videodecoder-pending-flush-promises-slot</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dom-videodecoder-pending-flush-promises-slot">4.4. Methods</a> <a href="#ref-for-dom-videodecoder-pending-flush-promises-slot①">(2)</a>
+    <li><a href="#ref-for-dom-videodecoder-pending-flush-promises-slot②">4.5. Algorithms</a> <a href="#ref-for-dom-videodecoder-pending-flush-promises-slot③">(2)</a>
+   </ul>
+  </aside>
   <aside class="dfn-panel" data-for="dom-videodecoder-videodecoder">
    <b><a href="#dom-videodecoder-videodecoder">#dom-videodecoder-videodecoder</a></b><b>Referenced in:</b>
    <ul>
@@ -7046,6 +7465,7 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <b><a href="#dom-videodecoder-flush">#dom-videodecoder-flush</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-dom-videodecoder-flush">4. VideoDecoder Interface</a>
+    <li><a href="#ref-for-dom-videodecoder-flush①">4.1. Internal Slots</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videodecoder-reset">
@@ -7123,7 +7543,6 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <b><a href="#dom-audioencoder-error-callback-slot">#dom-audioencoder-error-callback-slot</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-dom-audioencoder-error-callback-slot">5.2. Constructors</a>
-    <li><a href="#ref-for-dom-audioencoder-error-callback-slot①">5.5. Algorithms</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-audioencoder-active-encoder-config-slot">
@@ -7158,6 +7577,13 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
     <li><a href="#ref-for-dom-audioencoder-encodequeuesize-slot③">5.5. Algorithms</a>
    </ul>
   </aside>
+  <aside class="dfn-panel" data-for="dom-audioencoder-pending-flush-promises-slot">
+   <b><a href="#dom-audioencoder-pending-flush-promises-slot">#dom-audioencoder-pending-flush-promises-slot</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dom-audioencoder-pending-flush-promises-slot">5.4. Methods</a> <a href="#ref-for-dom-audioencoder-pending-flush-promises-slot①">(2)</a>
+    <li><a href="#ref-for-dom-audioencoder-pending-flush-promises-slot②">5.5. Algorithms</a> <a href="#ref-for-dom-audioencoder-pending-flush-promises-slot③">(2)</a>
+   </ul>
+  </aside>
   <aside class="dfn-panel" data-for="dom-audioencoder-audioencoder">
    <b><a href="#dom-audioencoder-audioencoder">#dom-audioencoder-audioencoder</a></b><b>Referenced in:</b>
    <ul>
@@ -7192,6 +7618,7 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <b><a href="#dom-audioencoder-flush">#dom-audioencoder-flush</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-dom-audioencoder-flush">5. AudioEncoder Interface</a>
+    <li><a href="#ref-for-dom-audioencoder-flush①">5.1. Internal Slots</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-audioencoder-reset">
@@ -7284,7 +7711,6 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <b><a href="#dom-videoencoder-error-callback-slot">#dom-videoencoder-error-callback-slot</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-dom-videoencoder-error-callback-slot">6.2. Constructors</a>
-    <li><a href="#ref-for-dom-videoencoder-error-callback-slot①">6.5. Algorithms</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoencoder-active-encoder-config-slot">
@@ -7317,6 +7743,13 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
     <li><a href="#ref-for-dom-videoencoder-encodequeuesize-slot③">6.5. Algorithms</a>
    </ul>
   </aside>
+  <aside class="dfn-panel" data-for="dom-videoencoder-pending-flush-promises-slot">
+   <b><a href="#dom-videoencoder-pending-flush-promises-slot">#dom-videoencoder-pending-flush-promises-slot</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dom-videoencoder-pending-flush-promises-slot">6.4. Methods</a> <a href="#ref-for-dom-videoencoder-pending-flush-promises-slot①">(2)</a>
+    <li><a href="#ref-for-dom-videoencoder-pending-flush-promises-slot②">6.5. Algorithms</a> <a href="#ref-for-dom-videoencoder-pending-flush-promises-slot③">(2)</a>
+   </ul>
+  </aside>
   <aside class="dfn-panel" data-for="dom-videoencoder-videoencoder">
    <b><a href="#dom-videoencoder-videoencoder">#dom-videoencoder-videoencoder</a></b><b>Referenced in:</b>
    <ul>
@@ -7351,6 +7784,7 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <b><a href="#dom-videoencoder-flush">#dom-videoencoder-flush</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-dom-videoencoder-flush">6. VideoEncoder Interface</a>
+    <li><a href="#ref-for-dom-videoencoder-flush①">6.1. Internal Slots</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoencoder-reset">
@@ -7749,6 +8183,12 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
     <li><a href="#ref-for-dom-videoencoderconfig-scalabilitymode②">7.8. VideoEncoderConfig</a>
    </ul>
   </aside>
+  <aside class="dfn-panel" data-for="dom-videoencoderconfig-bitratemode">
+   <b><a href="#dom-videoencoderconfig-bitratemode">#dom-videoencoderconfig-bitratemode</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dom-videoencoderconfig-bitratemode">7.8. VideoEncoderConfig</a>
+   </ul>
+  </aside>
   <aside class="dfn-panel" data-for="enumdef-hardwareacceleration">
    <b><a href="#enumdef-hardwareacceleration">#enumdef-hardwareacceleration</a></b><b>Referenced in:</b>
    <ul>
@@ -8121,9 +8561,8 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
     <li><a href="#ref-for-media-resource①③">9.2.5. Algorithms</a>
     <li><a href="#ref-for-media-resource①④">9.4.1. Internal Slots</a>
     <li><a href="#ref-for-media-resource①⑤">9.4.2. Constructors</a> <a href="#ref-for-media-resource①⑥">(2)</a> <a href="#ref-for-media-resource①⑦">(3)</a>
-    <li><a href="#ref-for-media-resource①⑧">9.4.4. Methods</a> <a href="#ref-for-media-resource①⑨">(2)</a>
-    <li><a href="#ref-for-media-resource②⓪">9.4.5. Algorithms</a> <a href="#ref-for-media-resource②①">(2)</a>
-    <li><a href="#ref-for-media-resource②②">9.5.3. Methods</a> <a href="#ref-for-media-resource②③">(2)</a>
+    <li><a href="#ref-for-media-resource①⑧">9.4.5. Methods</a> <a href="#ref-for-media-resource①⑨">(2)</a> <a href="#ref-for-media-resource②⓪">(3)</a>
+    <li><a href="#ref-for-media-resource②①">9.4.6. Algorithms</a> <a href="#ref-for-media-resource②②">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="audiodata">
@@ -8509,16 +8948,17 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
     <li><a href="#ref-for-videoframe⑦">7.8. VideoEncoderConfig</a> <a href="#ref-for-videoframe⑧">(2)</a>
     <li><a href="#ref-for-videoframe⑨">9.1.2. Reference Counting</a> <a href="#ref-for-videoframe①⓪">(2)</a> <a href="#ref-for-videoframe①①">(3)</a> <a href="#ref-for-videoframe①②">(4)</a>
     <li><a href="#ref-for-videoframe①③">9.4. VideoFrame Interface</a> <a href="#ref-for-videoframe①④">(2)</a> <a href="#ref-for-videoframe①⑤">(3)</a>
-    <li><a href="#ref-for-videoframe①⑥">9.4.1. Internal Slots</a> <a href="#ref-for-videoframe①⑦">(2)</a> <a href="#ref-for-videoframe①⑧">(3)</a> <a href="#ref-for-videoframe①⑨">(4)</a> <a href="#ref-for-videoframe②⓪">(5)</a> <a href="#ref-for-videoframe②①">(6)</a> <a href="#ref-for-videoframe②②">(7)</a> <a href="#ref-for-videoframe②③">(8)</a> <a href="#ref-for-videoframe②④">(9)</a> <a href="#ref-for-videoframe②⑤">(10)</a>
-    <li><a href="#ref-for-videoframe②⑥">9.4.2. Constructors</a> <a href="#ref-for-videoframe②⑦">(2)</a> <a href="#ref-for-videoframe②⑧">(3)</a> <a href="#ref-for-videoframe②⑨">(4)</a>
-    <li><a href="#ref-for-videoframe③⓪">9.4.3. Attributes</a>
-    <li><a href="#ref-for-videoframe③①">9.4.4. Methods</a>
-    <li><a href="#ref-for-videoframe③②">9.4.5. Algorithms</a> <a href="#ref-for-videoframe③③">(2)</a>
-    <li><a href="#ref-for-videoframe③④">9.5. Plane Interface</a> <a href="#ref-for-videoframe③⑤">(2)</a> <a href="#ref-for-videoframe③⑥">(3)</a> <a href="#ref-for-videoframe③⑦">(4)</a> <a href="#ref-for-videoframe③⑧">(5)</a>
-    <li><a href="#ref-for-videoframe③⑨">9.5.1. Internal Slots</a>
-    <li><a href="#ref-for-videoframe④⓪">10.1. Background</a>
-    <li><a href="#ref-for-videoframe④①">10.2.1. Internal Slots</a>
-    <li><a href="#ref-for-videoframe④②">10.5. ImageDecodeResult Interface</a> <a href="#ref-for-videoframe④③">(2)</a>
+    <li><a href="#ref-for-videoframe①⑥">9.4.1. Internal Slots</a> <a href="#ref-for-videoframe①⑦">(2)</a> <a href="#ref-for-videoframe①⑧">(3)</a> <a href="#ref-for-videoframe①⑨">(4)</a> <a href="#ref-for-videoframe②⓪">(5)</a> <a href="#ref-for-videoframe②①">(6)</a> <a href="#ref-for-videoframe②②">(7)</a>
+    <li><a href="#ref-for-videoframe②③">9.4.2. Constructors</a> <a href="#ref-for-videoframe②④">(2)</a> <a href="#ref-for-videoframe②⑤">(3)</a> <a href="#ref-for-videoframe②⑥">(4)</a>
+    <li><a href="#ref-for-videoframe②⑦">9.4.3. Attributes</a> <a href="#ref-for-videoframe②⑧">(2)</a> <a href="#ref-for-videoframe②⑨">(3)</a>
+    <li><a href="#ref-for-videoframe③⓪">9.4.5. Methods</a> <a href="#ref-for-videoframe③①">(2)</a>
+    <li><a href="#ref-for-videoframe③②">9.4.6. Algorithms</a> <a href="#ref-for-videoframe③③">(2)</a>
+    <li><a href="#ref-for-videoframe③④">9.5. VideoFrame CopyTo() Options</a> <a href="#ref-for-videoframe③⑤">(2)</a> <a href="#ref-for-videoframe③⑥">(3)</a>
+    <li><a href="#ref-for-videoframe③⑦">9.6. VideoFrame Rectangle (Rect)</a> <a href="#ref-for-videoframe③⑧">(2)</a>
+    <li><a href="#ref-for-videoframe③⑨">9.7. Plane Layout</a> <a href="#ref-for-videoframe④⓪">(2)</a>
+    <li><a href="#ref-for-videoframe④①">10.1. Background</a>
+    <li><a href="#ref-for-videoframe④②">10.2.1. Internal Slots</a>
+    <li><a href="#ref-for-videoframe④③">10.5. ImageDecodeResult Interface</a> <a href="#ref-for-videoframe④④">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dictdef-videoframeinit">
@@ -8530,21 +8970,21 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
   <aside class="dfn-panel" data-for="dom-videoframeinit-duration">
    <b><a href="#dom-videoframeinit-duration">#dom-videoframeinit-duration</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-videoframeinit-duration">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframeinit-duration①">(2)</a> <a href="#ref-for-dom-videoframeinit-duration②">(3)</a>
+    <li><a href="#ref-for-dom-videoframeinit-duration">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframeinit-duration①">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframeinit-timestamp">
    <b><a href="#dom-videoframeinit-timestamp">#dom-videoframeinit-timestamp</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-dom-videoframeinit-timestamp">9.4.2. Constructors</a> <a href="#ref-for-dom-videoframeinit-timestamp①">(2)</a>
-    <li><a href="#ref-for-dom-videoframeinit-timestamp②">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframeinit-timestamp③">(2)</a> <a href="#ref-for-dom-videoframeinit-timestamp④">(3)</a>
+    <li><a href="#ref-for-dom-videoframeinit-timestamp②">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframeinit-timestamp③">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dictdef-videoframeplaneinit">
    <b><a href="#dictdef-videoframeplaneinit">#dictdef-videoframeplaneinit</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-dictdef-videoframeplaneinit">9.4. VideoFrame Interface</a>
-    <li><a href="#ref-for-dictdef-videoframeplaneinit①">9.4.5. Algorithms</a> <a href="#ref-for-dictdef-videoframeplaneinit②">(2)</a>
+    <li><a href="#ref-for-dictdef-videoframeplaneinit①">9.4.6. Algorithms</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframeplaneinit-format">
@@ -8556,55 +8996,34 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
   <aside class="dfn-panel" data-for="dom-videoframeplaneinit-codedwidth">
    <b><a href="#dom-videoframeplaneinit-codedwidth">#dom-videoframeplaneinit-codedwidth</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-videoframeplaneinit-codedwidth">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframeplaneinit-codedwidth①">(2)</a> <a href="#ref-for-dom-videoframeplaneinit-codedwidth②">(3)</a>
+    <li><a href="#ref-for-dom-videoframeplaneinit-codedwidth">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframeplaneinit-codedwidth①">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframeplaneinit-codedheight">
    <b><a href="#dom-videoframeplaneinit-codedheight">#dom-videoframeplaneinit-codedheight</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-videoframeplaneinit-codedheight">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframeplaneinit-codedheight①">(2)</a> <a href="#ref-for-dom-videoframeplaneinit-codedheight②">(3)</a>
-   </ul>
-  </aside>
-  <aside class="dfn-panel" data-for="dom-videoframeplaneinit-cropleft">
-   <b><a href="#dom-videoframeplaneinit-cropleft">#dom-videoframeplaneinit-cropleft</a></b><b>Referenced in:</b>
-   <ul>
-    <li><a href="#ref-for-dom-videoframeplaneinit-cropleft">9.4.2. Constructors</a>
-    <li><a href="#ref-for-dom-videoframeplaneinit-cropleft①">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframeplaneinit-cropleft②">(2)</a>
+    <li><a href="#ref-for-dom-videoframeplaneinit-codedheight">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframeplaneinit-codedheight①">(2)</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="dom-videoframeplaneinit-croptop">
-   <b><a href="#dom-videoframeplaneinit-croptop">#dom-videoframeplaneinit-croptop</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="dom-videoframeplaneinit-visiblerect">
+   <b><a href="#dom-videoframeplaneinit-visiblerect">#dom-videoframeplaneinit-visiblerect</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-videoframeplaneinit-croptop">9.4.2. Constructors</a>
-    <li><a href="#ref-for-dom-videoframeplaneinit-croptop①">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframeplaneinit-croptop②">(2)</a>
-   </ul>
-  </aside>
-  <aside class="dfn-panel" data-for="dom-videoframeplaneinit-cropwidth">
-   <b><a href="#dom-videoframeplaneinit-cropwidth">#dom-videoframeplaneinit-cropwidth</a></b><b>Referenced in:</b>
-   <ul>
-    <li><a href="#ref-for-dom-videoframeplaneinit-cropwidth">9.4.2. Constructors</a>
-    <li><a href="#ref-for-dom-videoframeplaneinit-cropwidth①">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframeplaneinit-cropwidth②">(2)</a> <a href="#ref-for-dom-videoframeplaneinit-cropwidth③">(3)</a>
-   </ul>
-  </aside>
-  <aside class="dfn-panel" data-for="dom-videoframeplaneinit-cropheight">
-   <b><a href="#dom-videoframeplaneinit-cropheight">#dom-videoframeplaneinit-cropheight</a></b><b>Referenced in:</b>
-   <ul>
-    <li><a href="#ref-for-dom-videoframeplaneinit-cropheight">9.4.2. Constructors</a>
-    <li><a href="#ref-for-dom-videoframeplaneinit-cropheight①">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframeplaneinit-cropheight②">(2)</a> <a href="#ref-for-dom-videoframeplaneinit-cropheight③">(3)</a>
+    <li><a href="#ref-for-dom-videoframeplaneinit-visiblerect">9.4.2. Constructors</a> <a href="#ref-for-dom-videoframeplaneinit-visiblerect①">(2)</a> <a href="#ref-for-dom-videoframeplaneinit-visiblerect②">(3)</a> <a href="#ref-for-dom-videoframeplaneinit-visiblerect③">(4)</a>
+    <li><a href="#ref-for-dom-videoframeplaneinit-visiblerect④">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframeplaneinit-visiblerect⑤">(2)</a> <a href="#ref-for-dom-videoframeplaneinit-visiblerect⑥">(3)</a> <a href="#ref-for-dom-videoframeplaneinit-visiblerect⑦">(4)</a> <a href="#ref-for-dom-videoframeplaneinit-visiblerect⑧">(5)</a> <a href="#ref-for-dom-videoframeplaneinit-visiblerect⑨">(6)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframeplaneinit-displaywidth">
    <b><a href="#dom-videoframeplaneinit-displaywidth">#dom-videoframeplaneinit-displaywidth</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-dom-videoframeplaneinit-displaywidth">9.4.2. Constructors</a>
-    <li><a href="#ref-for-dom-videoframeplaneinit-displaywidth①">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframeplaneinit-displaywidth②">(2)</a>
+    <li><a href="#ref-for-dom-videoframeplaneinit-displaywidth①">9.4.6. Algorithms</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframeplaneinit-displayheight">
    <b><a href="#dom-videoframeplaneinit-displayheight">#dom-videoframeplaneinit-displayheight</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-dom-videoframeplaneinit-displayheight">9.4.2. Constructors</a>
-    <li><a href="#ref-for-dom-videoframeplaneinit-displayheight①">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframeplaneinit-displayheight②">(2)</a>
+    <li><a href="#ref-for-dom-videoframeplaneinit-displayheight①">9.4.6. Algorithms</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframeplaneinit-duration">
@@ -8619,11 +9038,36 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
     <li><a href="#ref-for-dom-videoframeplaneinit-timestamp">9.4.2. Constructors</a>
    </ul>
   </aside>
+  <aside class="dfn-panel" data-for="dictdef-planeinit">
+   <b><a href="#dictdef-planeinit">#dictdef-planeinit</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dictdef-planeinit">9.4. VideoFrame Interface</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="dom-planeinit-data">
+   <b><a href="#dom-planeinit-data">#dom-planeinit-data</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dom-planeinit-data">9.4.2. Constructors</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="dom-planeinit-stride">
+   <b><a href="#dom-planeinit-stride">#dom-planeinit-stride</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dom-planeinit-stride">9.4.2. Constructors</a> <a href="#ref-for-dom-planeinit-stride①">(2)</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="dom-planeinit-offset">
+   <b><a href="#dom-planeinit-offset">#dom-planeinit-offset</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dom-planeinit-offset">9.4.2. Constructors</a> <a href="#ref-for-dom-planeinit-offset①">(2)</a>
+   </ul>
+  </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-detached-slot">
    <b><a href="#dom-videoframe-detached-slot">#dom-videoframe-detached-slot</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-dom-videoframe-detached-slot">6.4. Methods</a>
-    <li><a href="#ref-for-dom-videoframe-detached-slot①">9.4.4. Methods</a> <a href="#ref-for-dom-videoframe-detached-slot②">(2)</a>
+    <li><a href="#ref-for-dom-videoframe-detached-slot①">9.4.5. Methods</a> <a href="#ref-for-dom-videoframe-detached-slot②">(2)</a> <a href="#ref-for-dom-videoframe-detached-slot③">(3)</a> <a href="#ref-for-dom-videoframe-detached-slot④">(4)</a>
+    <li><a href="#ref-for-dom-videoframe-detached-slot⑤">9.4.6. Algorithms</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-resource-reference-slot">
@@ -8631,68 +9075,76 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <ul>
     <li><a href="#ref-for-dom-videoframe-resource-reference-slot">9.1.2. Reference Counting</a>
     <li><a href="#ref-for-dom-videoframe-resource-reference-slot①">9.4.2. Constructors</a>
-    <li><a href="#ref-for-dom-videoframe-resource-reference-slot②">9.4.4. Methods</a>
-    <li><a href="#ref-for-dom-videoframe-resource-reference-slot③">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframe-resource-reference-slot④">(2)</a> <a href="#ref-for-dom-videoframe-resource-reference-slot⑤">(3)</a> <a href="#ref-for-dom-videoframe-resource-reference-slot⑥">(4)</a> <a href="#ref-for-dom-videoframe-resource-reference-slot⑦">(5)</a>
-    <li><a href="#ref-for-dom-videoframe-resource-reference-slot⑧">9.5.3. Methods</a>
+    <li><a href="#ref-for-dom-videoframe-resource-reference-slot②">9.4.5. Methods</a>
+    <li><a href="#ref-for-dom-videoframe-resource-reference-slot③">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframe-resource-reference-slot④">(2)</a> <a href="#ref-for-dom-videoframe-resource-reference-slot⑤">(3)</a> <a href="#ref-for-dom-videoframe-resource-reference-slot⑥">(4)</a> <a href="#ref-for-dom-videoframe-resource-reference-slot⑦">(5)</a> <a href="#ref-for-dom-videoframe-resource-reference-slot⑧">(6)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-format-slot">
    <b><a href="#dom-videoframe-format-slot">#dom-videoframe-format-slot</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-videoframe-format-slot">9.4.1. Internal Slots</a>
-    <li><a href="#ref-for-dom-videoframe-format-slot①">9.4.2. Constructors</a>
+    <li><a href="#ref-for-dom-videoframe-format-slot">9.4.2. Constructors</a> <a href="#ref-for-dom-videoframe-format-slot①">(2)</a>
     <li><a href="#ref-for-dom-videoframe-format-slot②">9.4.3. Attributes</a>
-   </ul>
-  </aside>
-  <aside class="dfn-panel" data-for="dom-videoframe-planes-slot">
-   <b><a href="#dom-videoframe-planes-slot">#dom-videoframe-planes-slot</a></b><b>Referenced in:</b>
-   <ul>
-    <li><a href="#ref-for-dom-videoframe-planes-slot">9.4.2. Constructors</a> <a href="#ref-for-dom-videoframe-planes-slot①">(2)</a>
-    <li><a href="#ref-for-dom-videoframe-planes-slot②">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-format-slot③">9.4.5. Methods</a> <a href="#ref-for-dom-videoframe-format-slot④">(2)</a> <a href="#ref-for-dom-videoframe-format-slot⑤">(3)</a>
+    <li><a href="#ref-for-dom-videoframe-format-slot⑥">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframe-format-slot⑦">(2)</a> <a href="#ref-for-dom-videoframe-format-slot⑧">(3)</a> <a href="#ref-for-dom-videoframe-format-slot⑨">(4)</a> <a href="#ref-for-dom-videoframe-format-slot①⓪">(5)</a> <a href="#ref-for-dom-videoframe-format-slot①①">(6)</a> <a href="#ref-for-dom-videoframe-format-slot①②">(7)</a> <a href="#ref-for-dom-videoframe-format-slot①③">(8)</a> <a href="#ref-for-dom-videoframe-format-slot①④">(9)</a>
+    <li><a href="#ref-for-dom-videoframe-format-slot①⑤">9.5. VideoFrame CopyTo() Options</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-coded-width-slot">
    <b><a href="#dom-videoframe-coded-width-slot">#dom-videoframe-coded-width-slot</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-dom-videoframe-coded-width-slot">9.4.2. Constructors</a> <a href="#ref-for-dom-videoframe-coded-width-slot①">(2)</a>
-    <li><a href="#ref-for-dom-videoframe-coded-width-slot②">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-coded-width-slot②">9.4.3. Attributes</a> <a href="#ref-for-dom-videoframe-coded-width-slot③">(2)</a>
+    <li><a href="#ref-for-dom-videoframe-coded-width-slot④">9.4.5. Methods</a>
+    <li><a href="#ref-for-dom-videoframe-coded-width-slot⑤">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframe-coded-width-slot⑥">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-coded-height-slot">
    <b><a href="#dom-videoframe-coded-height-slot">#dom-videoframe-coded-height-slot</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-dom-videoframe-coded-height-slot">9.4.2. Constructors</a> <a href="#ref-for-dom-videoframe-coded-height-slot①">(2)</a>
-    <li><a href="#ref-for-dom-videoframe-coded-height-slot②">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-coded-height-slot②">9.4.3. Attributes</a> <a href="#ref-for-dom-videoframe-coded-height-slot③">(2)</a>
+    <li><a href="#ref-for-dom-videoframe-coded-height-slot④">9.4.5. Methods</a>
+    <li><a href="#ref-for-dom-videoframe-coded-height-slot⑤">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframe-coded-height-slot⑥">(2)</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="dom-videoframe-crop-left-slot">
-   <b><a href="#dom-videoframe-crop-left-slot">#dom-videoframe-crop-left-slot</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="dom-videoframe-visible-left-slot">
+   <b><a href="#dom-videoframe-visible-left-slot">#dom-videoframe-visible-left-slot</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-videoframe-crop-left-slot">9.4.2. Constructors</a>
-    <li><a href="#ref-for-dom-videoframe-crop-left-slot①">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-visible-left-slot">9.4.1. Internal Slots</a>
+    <li><a href="#ref-for-dom-videoframe-visible-left-slot①">9.4.2. Constructors</a>
+    <li><a href="#ref-for-dom-videoframe-visible-left-slot②">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-visible-left-slot③">9.4.5. Methods</a>
+    <li><a href="#ref-for-dom-videoframe-visible-left-slot④">9.4.6. Algorithms</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="dom-videoframe-crop-top-slot">
-   <b><a href="#dom-videoframe-crop-top-slot">#dom-videoframe-crop-top-slot</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="dom-videoframe-visible-top-slot">
+   <b><a href="#dom-videoframe-visible-top-slot">#dom-videoframe-visible-top-slot</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-videoframe-crop-top-slot">9.4.2. Constructors</a>
-    <li><a href="#ref-for-dom-videoframe-crop-top-slot①">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-visible-top-slot">9.4.1. Internal Slots</a>
+    <li><a href="#ref-for-dom-videoframe-visible-top-slot①">9.4.2. Constructors</a>
+    <li><a href="#ref-for-dom-videoframe-visible-top-slot②">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-visible-top-slot③">9.4.5. Methods</a>
+    <li><a href="#ref-for-dom-videoframe-visible-top-slot④">9.4.6. Algorithms</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="dom-videoframe-crop-width-slot">
-   <b><a href="#dom-videoframe-crop-width-slot">#dom-videoframe-crop-width-slot</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="dom-videoframe-visible-width-slot">
+   <b><a href="#dom-videoframe-visible-width-slot">#dom-videoframe-visible-width-slot</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-videoframe-crop-width-slot">7.8. VideoEncoderConfig</a>
-    <li><a href="#ref-for-dom-videoframe-crop-width-slot①">9.4.2. Constructors</a> <a href="#ref-for-dom-videoframe-crop-width-slot②">(2)</a> <a href="#ref-for-dom-videoframe-crop-width-slot③">(3)</a>
-    <li><a href="#ref-for-dom-videoframe-crop-width-slot④">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-visible-width-slot">7.8. VideoEncoderConfig</a>
+    <li><a href="#ref-for-dom-videoframe-visible-width-slot①">9.4.2. Constructors</a> <a href="#ref-for-dom-videoframe-visible-width-slot②">(2)</a> <a href="#ref-for-dom-videoframe-visible-width-slot③">(3)</a>
+    <li><a href="#ref-for-dom-videoframe-visible-width-slot④">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-visible-width-slot⑤">9.4.5. Methods</a>
+    <li><a href="#ref-for-dom-videoframe-visible-width-slot⑥">9.4.6. Algorithms</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="dom-videoframe-crop-height-slot">
-   <b><a href="#dom-videoframe-crop-height-slot">#dom-videoframe-crop-height-slot</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="dom-videoframe-visible-height-slot">
+   <b><a href="#dom-videoframe-visible-height-slot">#dom-videoframe-visible-height-slot</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-videoframe-crop-height-slot">7.8. VideoEncoderConfig</a>
-    <li><a href="#ref-for-dom-videoframe-crop-height-slot①">9.4.2. Constructors</a> <a href="#ref-for-dom-videoframe-crop-height-slot②">(2)</a> <a href="#ref-for-dom-videoframe-crop-height-slot③">(3)</a>
-    <li><a href="#ref-for-dom-videoframe-crop-height-slot④">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-visible-height-slot">7.8. VideoEncoderConfig</a>
+    <li><a href="#ref-for-dom-videoframe-visible-height-slot①">9.4.2. Constructors</a> <a href="#ref-for-dom-videoframe-visible-height-slot②">(2)</a> <a href="#ref-for-dom-videoframe-visible-height-slot③">(3)</a>
+    <li><a href="#ref-for-dom-videoframe-visible-height-slot④">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-visible-height-slot⑤">9.4.5. Methods</a>
+    <li><a href="#ref-for-dom-videoframe-visible-height-slot⑥">9.4.6. Algorithms</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-display-width-slot">
@@ -8700,6 +9152,7 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <ul>
     <li><a href="#ref-for-dom-videoframe-display-width-slot">9.4.2. Constructors</a> <a href="#ref-for-dom-videoframe-display-width-slot①">(2)</a>
     <li><a href="#ref-for-dom-videoframe-display-width-slot②">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-display-width-slot③">9.4.5. Methods</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-display-height-slot">
@@ -8707,6 +9160,7 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <ul>
     <li><a href="#ref-for-dom-videoframe-display-height-slot">9.4.2. Constructors</a> <a href="#ref-for-dom-videoframe-display-height-slot①">(2)</a>
     <li><a href="#ref-for-dom-videoframe-display-height-slot②">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-display-height-slot③">9.4.5. Methods</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-duration-slot">
@@ -8715,6 +9169,8 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
     <li><a href="#ref-for-dom-videoframe-duration-slot">6.5. Algorithms</a>
     <li><a href="#ref-for-dom-videoframe-duration-slot①">9.4.2. Constructors</a>
     <li><a href="#ref-for-dom-videoframe-duration-slot②">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-duration-slot③">9.4.5. Methods</a>
+    <li><a href="#ref-for-dom-videoframe-duration-slot④">9.4.6. Algorithms</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-timestamp-slot">
@@ -8723,6 +9179,8 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
     <li><a href="#ref-for-dom-videoframe-timestamp-slot">6.5. Algorithms</a>
     <li><a href="#ref-for-dom-videoframe-timestamp-slot①">9.4.2. Constructors</a>
     <li><a href="#ref-for-dom-videoframe-timestamp-slot②">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-timestamp-slot③">9.4.5. Methods</a>
+    <li><a href="#ref-for-dom-videoframe-timestamp-slot④">9.4.6. Algorithms</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-videoframe">
@@ -8742,17 +9200,8 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <ul>
     <li><a href="#ref-for-dom-videoframe-format">9.4. VideoFrame Interface</a>
     <li><a href="#ref-for-dom-videoframe-format①">9.4.3. Attributes</a>
-    <li><a href="#ref-for-dom-videoframe-format②">9.4.4. Methods</a>
-    <li><a href="#ref-for-dom-videoframe-format③">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframe-format④">(2)</a> <a href="#ref-for-dom-videoframe-format⑤">(3)</a> <a href="#ref-for-dom-videoframe-format⑥">(4)</a> <a href="#ref-for-dom-videoframe-format⑦">(5)</a> <a href="#ref-for-dom-videoframe-format⑧">(6)</a>
-   </ul>
-  </aside>
-  <aside class="dfn-panel" data-for="dom-videoframe-planes">
-   <b><a href="#dom-videoframe-planes">#dom-videoframe-planes</a></b><b>Referenced in:</b>
-   <ul>
-    <li><a href="#ref-for-dom-videoframe-planes">9.4. VideoFrame Interface</a>
-    <li><a href="#ref-for-dom-videoframe-planes①">9.4.3. Attributes</a>
-    <li><a href="#ref-for-dom-videoframe-planes②">9.4.4. Methods</a>
-    <li><a href="#ref-for-dom-videoframe-planes③">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframe-planes④">(2)</a> <a href="#ref-for-dom-videoframe-planes⑤">(3)</a> <a href="#ref-for-dom-videoframe-planes⑥">(4)</a> <a href="#ref-for-dom-videoframe-planes⑦">(5)</a> <a href="#ref-for-dom-videoframe-planes⑧">(6)</a> <a href="#ref-for-dom-videoframe-planes⑨">(7)</a>
+    <li><a href="#ref-for-dom-videoframe-format②">9.4.5. Methods</a> <a href="#ref-for-dom-videoframe-format③">(2)</a>
+    <li><a href="#ref-for-dom-videoframe-format④">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframe-format⑤">(2)</a> <a href="#ref-for-dom-videoframe-format⑥">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-codedwidth">
@@ -8760,9 +9209,8 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <ul>
     <li><a href="#ref-for-dom-videoframe-codedwidth">9.4. VideoFrame Interface</a>
     <li><a href="#ref-for-dom-videoframe-codedwidth①">9.4.2. Constructors</a>
-    <li><a href="#ref-for-dom-videoframe-codedwidth②">9.4.3. Attributes</a>
-    <li><a href="#ref-for-dom-videoframe-codedwidth③">9.4.4. Methods</a>
-    <li><a href="#ref-for-dom-videoframe-codedwidth④">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframe-codedwidth⑤">(2)</a> <a href="#ref-for-dom-videoframe-codedwidth⑥">(3)</a>
+    <li><a href="#ref-for-dom-videoframe-codedwidth②">9.4.3. Attributes</a> <a href="#ref-for-dom-videoframe-codedwidth③">(2)</a>
+    <li><a href="#ref-for-dom-videoframe-codedwidth④">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframe-codedwidth⑤">(2)</a> <a href="#ref-for-dom-videoframe-codedwidth⑥">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-codedheight">
@@ -8770,47 +9218,28 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <ul>
     <li><a href="#ref-for-dom-videoframe-codedheight">9.4. VideoFrame Interface</a>
     <li><a href="#ref-for-dom-videoframe-codedheight①">9.4.2. Constructors</a>
-    <li><a href="#ref-for-dom-videoframe-codedheight②">9.4.3. Attributes</a>
-    <li><a href="#ref-for-dom-videoframe-codedheight③">9.4.4. Methods</a>
-    <li><a href="#ref-for-dom-videoframe-codedheight④">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframe-codedheight⑤">(2)</a> <a href="#ref-for-dom-videoframe-codedheight⑥">(3)</a>
-   </ul>
-  </aside>
-  <aside class="dfn-panel" data-for="dom-videoframe-cropleft">
-   <b><a href="#dom-videoframe-cropleft">#dom-videoframe-cropleft</a></b><b>Referenced in:</b>
-   <ul>
-    <li><a href="#ref-for-dom-videoframe-cropleft">9.4. VideoFrame Interface</a>
-    <li><a href="#ref-for-dom-videoframe-cropleft①">9.4.2. Constructors</a>
-    <li><a href="#ref-for-dom-videoframe-cropleft②">9.4.3. Attributes</a>
-    <li><a href="#ref-for-dom-videoframe-cropleft③">9.4.4. Methods</a>
-    <li><a href="#ref-for-dom-videoframe-cropleft④">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframe-cropleft⑤">(2)</a>
-   </ul>
-  </aside>
-  <aside class="dfn-panel" data-for="dom-videoframe-croptop">
-   <b><a href="#dom-videoframe-croptop">#dom-videoframe-croptop</a></b><b>Referenced in:</b>
-   <ul>
-    <li><a href="#ref-for-dom-videoframe-croptop">9.4. VideoFrame Interface</a>
-    <li><a href="#ref-for-dom-videoframe-croptop①">9.4.2. Constructors</a>
-    <li><a href="#ref-for-dom-videoframe-croptop②">9.4.3. Attributes</a>
-    <li><a href="#ref-for-dom-videoframe-croptop③">9.4.4. Methods</a>
-    <li><a href="#ref-for-dom-videoframe-croptop④">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframe-croptop⑤">(2)</a>
+    <li><a href="#ref-for-dom-videoframe-codedheight②">9.4.3. Attributes</a> <a href="#ref-for-dom-videoframe-codedheight③">(2)</a>
+    <li><a href="#ref-for-dom-videoframe-codedheight④">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframe-codedheight⑤">(2)</a> <a href="#ref-for-dom-videoframe-codedheight⑥">(3)</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="dom-videoframe-cropwidth">
-   <b><a href="#dom-videoframe-cropwidth">#dom-videoframe-cropwidth</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="dom-videoframe-codedrect">
+   <b><a href="#dom-videoframe-codedrect">#dom-videoframe-codedrect</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-videoframe-cropwidth">9.4. VideoFrame Interface</a>
-    <li><a href="#ref-for-dom-videoframe-cropwidth①">9.4.3. Attributes</a>
-    <li><a href="#ref-for-dom-videoframe-cropwidth②">9.4.4. Methods</a>
-    <li><a href="#ref-for-dom-videoframe-cropwidth③">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframe-cropwidth④">(2)</a>
+    <li><a href="#ref-for-dom-videoframe-codedrect">9.4. VideoFrame Interface</a>
+    <li><a href="#ref-for-dom-videoframe-codedrect①">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-codedrect②">9.5. VideoFrame CopyTo() Options</a>
+    <li><a href="#ref-for-dom-videoframe-codedrect③">9.6. VideoFrame Rectangle (Rect)</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="dom-videoframe-cropheight">
-   <b><a href="#dom-videoframe-cropheight">#dom-videoframe-cropheight</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="dom-videoframe-visiblerect">
+   <b><a href="#dom-videoframe-visiblerect">#dom-videoframe-visiblerect</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-videoframe-cropheight">9.4. VideoFrame Interface</a>
-    <li><a href="#ref-for-dom-videoframe-cropheight①">9.4.3. Attributes</a>
-    <li><a href="#ref-for-dom-videoframe-cropheight②">9.4.4. Methods</a>
-    <li><a href="#ref-for-dom-videoframe-cropheight③">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframe-cropheight④">(2)</a>
+    <li><a href="#ref-for-dom-videoframe-visiblerect">9.4. VideoFrame Interface</a>
+    <li><a href="#ref-for-dom-videoframe-visiblerect①">9.4.2. Constructors</a>
+    <li><a href="#ref-for-dom-videoframe-visiblerect②">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-visiblerect③">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframe-visiblerect④">(2)</a> <a href="#ref-for-dom-videoframe-visiblerect⑤">(3)</a>
+    <li><a href="#ref-for-dom-videoframe-visiblerect⑥">9.5. VideoFrame CopyTo() Options</a>
+    <li><a href="#ref-for-dom-videoframe-visiblerect⑦">9.6. VideoFrame Rectangle (Rect)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-displaywidth">
@@ -8819,8 +9248,7 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
     <li><a href="#ref-for-dom-videoframe-displaywidth">7.6. VideoDecoderConfig</a>
     <li><a href="#ref-for-dom-videoframe-displaywidth①">9.4. VideoFrame Interface</a>
     <li><a href="#ref-for-dom-videoframe-displaywidth②">9.4.3. Attributes</a>
-    <li><a href="#ref-for-dom-videoframe-displaywidth③">9.4.4. Methods</a>
-    <li><a href="#ref-for-dom-videoframe-displaywidth④">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframe-displaywidth⑤">(2)</a>
+    <li><a href="#ref-for-dom-videoframe-displaywidth③">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframe-displaywidth④">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-displayheight">
@@ -8829,8 +9257,7 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
     <li><a href="#ref-for-dom-videoframe-displayheight">7.6. VideoDecoderConfig</a>
     <li><a href="#ref-for-dom-videoframe-displayheight①">9.4. VideoFrame Interface</a>
     <li><a href="#ref-for-dom-videoframe-displayheight②">9.4.3. Attributes</a>
-    <li><a href="#ref-for-dom-videoframe-displayheight③">9.4.4. Methods</a>
-    <li><a href="#ref-for-dom-videoframe-displayheight④">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframe-displayheight⑤">(2)</a>
+    <li><a href="#ref-for-dom-videoframe-displayheight③">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframe-displayheight④">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-timestamp">
@@ -8838,8 +9265,7 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <ul>
     <li><a href="#ref-for-dom-videoframe-timestamp">9.4. VideoFrame Interface</a>
     <li><a href="#ref-for-dom-videoframe-timestamp①">9.4.3. Attributes</a>
-    <li><a href="#ref-for-dom-videoframe-timestamp②">9.4.4. Methods</a>
-    <li><a href="#ref-for-dom-videoframe-timestamp③">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframe-timestamp④">(2)</a> <a href="#ref-for-dom-videoframe-timestamp⑤">(3)</a> <a href="#ref-for-dom-videoframe-timestamp⑥">(4)</a>
+    <li><a href="#ref-for-dom-videoframe-timestamp②">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframe-timestamp③">(2)</a> <a href="#ref-for-dom-videoframe-timestamp④">(3)</a> <a href="#ref-for-dom-videoframe-timestamp⑤">(4)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-duration">
@@ -8847,8 +9273,97 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <ul>
     <li><a href="#ref-for-dom-videoframe-duration">9.4. VideoFrame Interface</a>
     <li><a href="#ref-for-dom-videoframe-duration①">9.4.3. Attributes</a>
-    <li><a href="#ref-for-dom-videoframe-duration②">9.4.4. Methods</a>
-    <li><a href="#ref-for-dom-videoframe-duration③">9.4.5. Algorithms</a> <a href="#ref-for-dom-videoframe-duration④">(2)</a> <a href="#ref-for-dom-videoframe-duration⑤">(3)</a> <a href="#ref-for-dom-videoframe-duration⑥">(4)</a>
+    <li><a href="#ref-for-dom-videoframe-duration②">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframe-duration③">(2)</a> <a href="#ref-for-dom-videoframe-duration④">(3)</a> <a href="#ref-for-dom-videoframe-duration⑤">(4)</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="parsed-copyto-options">
+   <b><a href="#parsed-copyto-options">#parsed-copyto-options</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-parsed-copyto-options">9.4.6. Algorithms</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="parsed-copyto-options-allocationsize">
+   <b><a href="#parsed-copyto-options-allocationsize">#parsed-copyto-options-allocationsize</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-parsed-copyto-options-allocationsize">9.4.5. Methods</a> <a href="#ref-for-parsed-copyto-options-allocationsize①">(2)</a>
+    <li><a href="#ref-for-parsed-copyto-options-allocationsize②">9.4.6. Algorithms</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="parsed-copyto-options-computedlayouts">
+   <b><a href="#parsed-copyto-options-computedlayouts">#parsed-copyto-options-computedlayouts</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-parsed-copyto-options-computedlayouts">9.4.5. Methods</a>
+    <li><a href="#ref-for-parsed-copyto-options-computedlayouts①">9.4.6. Algorithms</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="computed-plane-layout">
+   <b><a href="#computed-plane-layout">#computed-plane-layout</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-computed-plane-layout">9.4.4. Internal Structures</a>
+    <li><a href="#ref-for-computed-plane-layout①">9.4.5. Methods</a>
+    <li><a href="#ref-for-computed-plane-layout②">9.4.6. Algorithms</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="computed-plane-layout-destinationoffset">
+   <b><a href="#computed-plane-layout-destinationoffset">#computed-plane-layout-destinationoffset</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-computed-plane-layout-destinationoffset">9.4.5. Methods</a>
+    <li><a href="#ref-for-computed-plane-layout-destinationoffset①">9.4.6. Algorithms</a> <a href="#ref-for-computed-plane-layout-destinationoffset②">(2)</a> <a href="#ref-for-computed-plane-layout-destinationoffset③">(3)</a> <a href="#ref-for-computed-plane-layout-destinationoffset④">(4)</a> <a href="#ref-for-computed-plane-layout-destinationoffset⑤">(5)</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="computed-plane-layout-destinationstride">
+   <b><a href="#computed-plane-layout-destinationstride">#computed-plane-layout-destinationstride</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-computed-plane-layout-destinationstride">9.4.5. Methods</a>
+    <li><a href="#ref-for-computed-plane-layout-destinationstride①">9.4.6. Algorithms</a> <a href="#ref-for-computed-plane-layout-destinationstride②">(2)</a> <a href="#ref-for-computed-plane-layout-destinationstride③">(3)</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="computed-plane-layout-sourcetop">
+   <b><a href="#computed-plane-layout-sourcetop">#computed-plane-layout-sourcetop</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-computed-plane-layout-sourcetop">9.4.5. Methods</a>
+    <li><a href="#ref-for-computed-plane-layout-sourcetop①">9.4.6. Algorithms</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="computed-plane-layout-sourceheight">
+   <b><a href="#computed-plane-layout-sourceheight">#computed-plane-layout-sourceheight</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-computed-plane-layout-sourceheight">9.4.5. Methods</a>
+    <li><a href="#ref-for-computed-plane-layout-sourceheight①">9.4.6. Algorithms</a> <a href="#ref-for-computed-plane-layout-sourceheight②">(2)</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="computed-plane-layout-sourceleftbytes">
+   <b><a href="#computed-plane-layout-sourceleftbytes">#computed-plane-layout-sourceleftbytes</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-computed-plane-layout-sourceleftbytes">9.4.5. Methods</a>
+    <li><a href="#ref-for-computed-plane-layout-sourceleftbytes①">9.4.6. Algorithms</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="computed-plane-layout-sourcewidthbytes">
+   <b><a href="#computed-plane-layout-sourcewidthbytes">#computed-plane-layout-sourcewidthbytes</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-computed-plane-layout-sourcewidthbytes">9.4.5. Methods</a>
+    <li><a href="#ref-for-computed-plane-layout-sourcewidthbytes①">9.4.6. Algorithms</a> <a href="#ref-for-computed-plane-layout-sourcewidthbytes②">(2)</a> <a href="#ref-for-computed-plane-layout-sourcewidthbytes③">(3)</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="dom-videoframe-allocationsize">
+   <b><a href="#dom-videoframe-allocationsize">#dom-videoframe-allocationsize</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dom-videoframe-allocationsize">9.4. VideoFrame Interface</a>
+    <li><a href="#ref-for-dom-videoframe-allocationsize①">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-allocationsize②">9.5. VideoFrame CopyTo() Options</a>
+    <li><a href="#ref-for-dom-videoframe-allocationsize③">9.6. VideoFrame Rectangle (Rect)</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="dom-videoframe-copyto">
+   <b><a href="#dom-videoframe-copyto">#dom-videoframe-copyto</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dom-videoframe-copyto">9.4. VideoFrame Interface</a>
+    <li><a href="#ref-for-dom-videoframe-copyto①">9.4.3. Attributes</a>
+    <li><a href="#ref-for-dom-videoframe-copyto②">9.4.5. Methods</a> <a href="#ref-for-dom-videoframe-copyto③">(2)</a>
+    <li><a href="#ref-for-dom-videoframe-copyto④">9.5. VideoFrame CopyTo() Options</a>
+    <li><a href="#ref-for-dom-videoframe-copyto⑤">9.6. VideoFrame Rectangle (Rect)</a>
+    <li><a href="#ref-for-dom-videoframe-copyto⑥">9.7. Plane Layout</a> <a href="#ref-for-dom-videoframe-copyto⑦">(2)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-videoframe-clone">
@@ -8896,75 +9411,111 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
    <b><a href="#clone-videoframe">#clone-videoframe</a></b><b>Referenced in:</b>
    <ul>
     <li><a href="#ref-for-clone-videoframe">6.4. Methods</a>
-    <li><a href="#ref-for-clone-videoframe①">9.4.4. Methods</a>
+    <li><a href="#ref-for-clone-videoframe①">9.4.5. Methods</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="plane">
-   <b><a href="#plane">#plane</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="videoframe-parse-videoframecopytooptions">
+   <b><a href="#videoframe-parse-videoframecopytooptions">#videoframe-parse-videoframecopytooptions</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-plane">9.4. VideoFrame Interface</a> <a href="#ref-for-plane①">(2)</a>
-    <li><a href="#ref-for-plane②">9.4.1. Internal Slots</a> <a href="#ref-for-plane③">(2)</a>
-    <li><a href="#ref-for-plane④">9.4.2. Constructors</a>
-    <li><a href="#ref-for-plane⑤">9.4.3. Attributes</a>
-    <li><a href="#ref-for-plane⑥">9.4.5. Algorithms</a> <a href="#ref-for-plane⑦">(2)</a> <a href="#ref-for-plane⑧">(3)</a> <a href="#ref-for-plane⑨">(4)</a>
-    <li><a href="#ref-for-plane①⓪">9.5. Plane Interface</a> <a href="#ref-for-plane①①">(2)</a> <a href="#ref-for-plane①②">(3)</a> <a href="#ref-for-plane①③">(4)</a>
+    <li><a href="#ref-for-videoframe-parse-videoframecopytooptions">9.4.5. Methods</a> <a href="#ref-for-videoframe-parse-videoframecopytooptions①">(2)</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="dictdef-planeinit">
-   <b><a href="#dictdef-planeinit">#dictdef-planeinit</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="videoframe-parse-copyto-rect">
+   <b><a href="#videoframe-parse-copyto-rect">#videoframe-parse-copyto-rect</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dictdef-planeinit">9.4. VideoFrame Interface</a>
+    <li><a href="#ref-for-videoframe-parse-copyto-rect">9.4.6. Algorithms</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="videoframe-compute-layout-and-allocation-size">
+   <b><a href="#videoframe-compute-layout-and-allocation-size">#videoframe-compute-layout-and-allocation-size</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-videoframe-compute-layout-and-allocation-size">9.4.6. Algorithms</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="dictdef-videoframecopytooptions">
+   <b><a href="#dictdef-videoframecopytooptions">#dictdef-videoframecopytooptions</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dictdef-videoframecopytooptions">9.4. VideoFrame Interface</a> <a href="#ref-for-dictdef-videoframecopytooptions①">(2)</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="dom-videoframecopytooptions-rect">
+   <b><a href="#dom-videoframecopytooptions-rect">#dom-videoframecopytooptions-rect</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dom-videoframecopytooptions-rect">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframecopytooptions-rect①">(2)</a>
+    <li><a href="#ref-for-dom-videoframecopytooptions-rect②">9.5. VideoFrame CopyTo() Options</a> <a href="#ref-for-dom-videoframecopytooptions-rect③">(2)</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="dom-videoframecopytooptions-layout">
+   <b><a href="#dom-videoframecopytooptions-layout">#dom-videoframecopytooptions-layout</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dom-videoframecopytooptions-layout">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframecopytooptions-layout①">(2)</a> <a href="#ref-for-dom-videoframecopytooptions-layout②">(3)</a>
+    <li><a href="#ref-for-dom-videoframecopytooptions-layout③">9.5. VideoFrame CopyTo() Options</a> <a href="#ref-for-dom-videoframecopytooptions-layout④">(2)</a>
+   </ul>
+  </aside>
+  <aside class="dfn-panel" data-for="dictdef-videoframerect">
+   <b><a href="#dictdef-videoframerect">#dictdef-videoframerect</a></b><b>Referenced in:</b>
+   <ul>
+    <li><a href="#ref-for-dictdef-videoframerect">9.4. VideoFrame Interface</a> <a href="#ref-for-dictdef-videoframerect①">(2)</a> <a href="#ref-for-dictdef-videoframerect②">(3)</a>
+    <li><a href="#ref-for-dictdef-videoframerect③">9.4.3. Attributes</a> <a href="#ref-for-dictdef-videoframerect④">(2)</a> <a href="#ref-for-dictdef-videoframerect⑤">(3)</a> <a href="#ref-for-dictdef-videoframerect⑥">(4)</a> <a href="#ref-for-dictdef-videoframerect⑦">(5)</a> <a href="#ref-for-dictdef-videoframerect⑧">(6)</a>
+    <li><a href="#ref-for-dictdef-videoframerect⑨">9.5. VideoFrame CopyTo() Options</a> <a href="#ref-for-dictdef-videoframerect①⓪">(2)</a> <a href="#ref-for-dictdef-videoframerect①①">(3)</a> <a href="#ref-for-dictdef-videoframerect①②">(4)</a>
+    <li><a href="#ref-for-dictdef-videoframerect①③">9.6. VideoFrame Rectangle (Rect)</a> <a href="#ref-for-dictdef-videoframerect①④">(2)</a> <a href="#ref-for-dictdef-videoframerect①⑤">(3)</a> <a href="#ref-for-dictdef-videoframerect①⑥">(4)</a> <a href="#ref-for-dictdef-videoframerect①⑦">(5)</a> <a href="#ref-for-dictdef-videoframerect①⑧">(6)</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="dom-planeinit-src">
-   <b><a href="#dom-planeinit-src">#dom-planeinit-src</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="dom-videoframerect-left">
+   <b><a href="#dom-videoframerect-left">#dom-videoframerect-left</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-planeinit-src">9.4.2. Constructors</a>
+    <li><a href="#ref-for-dom-videoframerect-left">9.4.3. Attributes</a> <a href="#ref-for-dom-videoframerect-left①">(2)</a>
+    <li><a href="#ref-for-dom-videoframerect-left②">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframerect-left③">(2)</a> <a href="#ref-for-dom-videoframerect-left④">(3)</a> <a href="#ref-for-dom-videoframerect-left⑤">(4)</a>
+    <li><a href="#ref-for-dom-videoframerect-left⑥">9.6. VideoFrame Rectangle (Rect)</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="dom-planeinit-rows">
-   <b><a href="#dom-planeinit-rows">#dom-planeinit-rows</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="dom-videoframerect-top">
+   <b><a href="#dom-videoframerect-top">#dom-videoframerect-top</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-planeinit-rows">9.4.2. Constructors</a>
+    <li><a href="#ref-for-dom-videoframerect-top">9.4.3. Attributes</a> <a href="#ref-for-dom-videoframerect-top①">(2)</a>
+    <li><a href="#ref-for-dom-videoframerect-top②">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframerect-top③">(2)</a> <a href="#ref-for-dom-videoframerect-top④">(3)</a> <a href="#ref-for-dom-videoframerect-top⑤">(4)</a>
+    <li><a href="#ref-for-dom-videoframerect-top⑥">9.6. VideoFrame Rectangle (Rect)</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="dom-plane-parent-frame-slot">
-   <b><a href="#dom-plane-parent-frame-slot">#dom-plane-parent-frame-slot</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="dom-videoframerect-width">
+   <b><a href="#dom-videoframerect-width">#dom-videoframerect-width</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-plane-parent-frame-slot">9.4.2. Constructors</a>
-    <li><a href="#ref-for-dom-plane-parent-frame-slot①">9.4.5. Algorithms</a> <a href="#ref-for-dom-plane-parent-frame-slot②">(2)</a>
-    <li><a href="#ref-for-dom-plane-parent-frame-slot③">9.5.3. Methods</a> <a href="#ref-for-dom-plane-parent-frame-slot④">(2)</a>
+    <li><a href="#ref-for-dom-videoframerect-width">9.4.2. Constructors</a>
+    <li><a href="#ref-for-dom-videoframerect-width①">9.4.3. Attributes</a> <a href="#ref-for-dom-videoframerect-width②">(2)</a>
+    <li><a href="#ref-for-dom-videoframerect-width③">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframerect-width④">(2)</a> <a href="#ref-for-dom-videoframerect-width⑤">(3)</a> <a href="#ref-for-dom-videoframerect-width⑥">(4)</a> <a href="#ref-for-dom-videoframerect-width⑦">(5)</a> <a href="#ref-for-dom-videoframerect-width⑧">(6)</a>
+    <li><a href="#ref-for-dom-videoframerect-width⑨">9.6. VideoFrame Rectangle (Rect)</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="dom-plane-stride">
-   <b><a href="#dom-plane-stride">#dom-plane-stride</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="dom-videoframerect-height">
+   <b><a href="#dom-videoframerect-height">#dom-videoframerect-height</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-plane-stride">9.4.2. Constructors</a> <a href="#ref-for-dom-plane-stride①">(2)</a> <a href="#ref-for-dom-plane-stride②">(3)</a>
-    <li><a href="#ref-for-dom-plane-stride③">9.4.5. Algorithms</a> <a href="#ref-for-dom-plane-stride④">(2)</a> <a href="#ref-for-dom-plane-stride⑤">(3)</a>
-    <li><a href="#ref-for-dom-plane-stride⑥">9.5. Plane Interface</a>
+    <li><a href="#ref-for-dom-videoframerect-height">9.4.2. Constructors</a>
+    <li><a href="#ref-for-dom-videoframerect-height①">9.4.3. Attributes</a> <a href="#ref-for-dom-videoframerect-height②">(2)</a>
+    <li><a href="#ref-for-dom-videoframerect-height③">9.4.6. Algorithms</a> <a href="#ref-for-dom-videoframerect-height④">(2)</a> <a href="#ref-for-dom-videoframerect-height⑤">(3)</a> <a href="#ref-for-dom-videoframerect-height⑥">(4)</a> <a href="#ref-for-dom-videoframerect-height⑦">(5)</a> <a href="#ref-for-dom-videoframerect-height⑧">(6)</a>
+    <li><a href="#ref-for-dom-videoframerect-height⑨">9.6. VideoFrame Rectangle (Rect)</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="dom-plane-rows">
-   <b><a href="#dom-plane-rows">#dom-plane-rows</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="dictdef-planelayout">
+   <b><a href="#dictdef-planelayout">#dictdef-planelayout</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-plane-rows">9.4.2. Constructors</a> <a href="#ref-for-dom-plane-rows①">(2)</a>
-    <li><a href="#ref-for-dom-plane-rows②">9.4.5. Algorithms</a> <a href="#ref-for-dom-plane-rows③">(2)</a> <a href="#ref-for-dom-plane-rows④">(3)</a>
-    <li><a href="#ref-for-dom-plane-rows⑤">9.5. Plane Interface</a>
+    <li><a href="#ref-for-dictdef-planelayout">9.4. VideoFrame Interface</a>
+    <li><a href="#ref-for-dictdef-planelayout①">9.4.6. Algorithms</a>
+    <li><a href="#ref-for-dictdef-planelayout②">9.5. VideoFrame CopyTo() Options</a> <a href="#ref-for-dictdef-planelayout③">(2)</a> <a href="#ref-for-dictdef-planelayout④">(3)</a> <a href="#ref-for-dictdef-planelayout⑤">(4)</a>
+    <li><a href="#ref-for-dictdef-planelayout⑥">9.7. Plane Layout</a> <a href="#ref-for-dictdef-planelayout⑦">(2)</a> <a href="#ref-for-dictdef-planelayout⑧">(3)</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="dom-plane-length">
-   <b><a href="#dom-plane-length">#dom-plane-length</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="dom-planelayout-offset">
+   <b><a href="#dom-planelayout-offset">#dom-planelayout-offset</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-plane-length">9.4.2. Constructors</a>
-    <li><a href="#ref-for-dom-plane-length①">9.4.5. Algorithms</a> <a href="#ref-for-dom-plane-length②">(2)</a> <a href="#ref-for-dom-plane-length③">(3)</a>
-    <li><a href="#ref-for-dom-plane-length④">9.5. Plane Interface</a>
-    <li><a href="#ref-for-dom-plane-length⑤">9.5.3. Methods</a>
+    <li><a href="#ref-for-dom-planelayout-offset">9.4.6. Algorithms</a>
+    <li><a href="#ref-for-dom-planelayout-offset①">9.7. Plane Layout</a>
    </ul>
   </aside>
-  <aside class="dfn-panel" data-for="dom-plane-readinto">
-   <b><a href="#dom-plane-readinto">#dom-plane-readinto</a></b><b>Referenced in:</b>
+  <aside class="dfn-panel" data-for="dom-planelayout-stride">
+   <b><a href="#dom-planelayout-stride">#dom-planelayout-stride</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-plane-readinto">9.5. Plane Interface</a>
+    <li><a href="#ref-for-dom-planelayout-stride">9.4.6. Algorithms</a> <a href="#ref-for-dom-planelayout-stride①">(2)</a>
+    <li><a href="#ref-for-dom-planelayout-stride②">9.7. Plane Layout</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="enumdef-pixelformat">
@@ -8974,14 +9525,13 @@ <h2 class="no-num no-ref heading settled" id="issues-index"><span class="content
     <li><a href="#ref-for-enumdef-pixelformat②">9.4.1. Internal Slots</a>
     <li><a href="#ref-for-enumdef-pixelformat③">9.4.2. Constructors</a>
     <li><a href="#ref-for-enumdef-pixelformat④">9.4.3. Attributes</a>
-    <li><a href="#ref-for-enumdef-pixelformat⑤">9.4.5. Algorithms</a> <a href="#ref-for-enumdef-pixelformat⑥">(2)</a> <a href="#ref-for-enumdef-pixelformat⑦">(3)</a> <a href="#ref-for-enumdef-pixelformat⑧">(4)</a> <a href="#ref-for-enumdef-pixelformat⑨">(5)</a>
-    <li><a href="#ref-for-enumdef-pixelformat①⓪">9.5. Plane Interface</a>
+    <li><a href="#ref-for-enumdef-pixelformat⑤">9.4.6. Algorithms</a> <a href="#ref-for-enumdef-pixelformat⑥">(2)</a> <a href="#ref-for-enumdef-pixelformat⑦">(3)</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="dom-pixelformat-i420">
    <b><a href="#dom-pixelformat-i420">#dom-pixelformat-i420</a></b><b>Referenced in:</b>
    <ul>
-    <li><a href="#ref-for-dom-pixelformat-i420">9.6. Pixel Format</a>
+    <li><a href="#ref-for-dom-pixelformat-i420">9.8. Pixel Format</a>
    </ul>
   </aside>
   <aside class="dfn-panel" data-for="imagedecoder">