[resize-observer] Added updated IDL

Author: Greg Whitworth

resize-observer-1/Overview.bs

@@ -126,12 +126,27 @@ The ResizeObserver interface is used to observe changes to {{Element}}'s
 
 It is modeled after {{MutationObserver}} and <a>IntersectionObserver</a>.
 
+<pre class="idl">
+    enum ResizeObserverSizeOptions {
+        "border-box", "content-box", "scroll-box", "pixel-snapped-box"
+    };
+</pre>
+
+<p class="issue">Is 'pixel-snapped-box' the best name?</p>
+
+<pre class="idl">
+    dictionary ResizeObserverOptions {
+        (ResizeObserverSizeOptions or sequence&lt;ResizeObserverSizeOptions>) size = "content-box";
+    };
+</pre>
+
+<p class='issue'>Is size the right name here? It's actually denoting which layout box we want to observe, possibly `box`?</p>
+
 <pre class="idl">
 [Exposed=(Window),
- Constructor(ResizeObserverCallback callback, DOMString layoutBox)]
+ Constructor(ResizeObserverCallback callback)]
 interface ResizeObserver {
-    DOMString layoutBox;
-    void observe(Element target);
+    void observe(Element target, optional ResizeObserverOptions options);
     void unobserve(Element target);
     void disconnect();
 };
@@ -193,9 +208,12 @@ This callback delivers {{ResizeObserver}}'s notifications. It is invoked by a
 interface ResizeObserverEntry {
     readonly attribute Element target;
     readonly attribute DOMRectReadOnly contentRect;
+    readonly attribute ResizeObserverSize boxSize;
 };
 </pre>
 
+<p class="issue">Do we only want to return the box(es) that were requested to be observed, or all?</p>
+
 <div dfn-type="attribute" dfn-for="ResizeObserverEntry">
     : <dfn>target</dfn>
     ::
@@ -212,8 +230,6 @@ interface ResizeObserverEntry {
 
         2. Set |this| {{ResizeObserverEntry/target}} slot to |target|.
 
-        3. Set the |layoutBox| to the value provided by the author utilizing the rect of same name for steps 3 and 4.
-
         3. If |target| is not an SVG element do these steps:
 
             1. Set |this|.|layoutBox|.width to |target|.<a>content width</a>.
@@ -234,6 +250,13 @@ interface ResizeObserverEntry {
 
 </div>
 
+<pre class="idl">
+    interface ResizeObserverSize {
+        readonly attribute unrestricted double inlineSize;
+        readonly attribute unrestricted double blockSize;
+    };
+</pre>
+
 <h3 id="resize-observation-interface">ResizeObservation</h3>
 ResizeObservation holds observation information for a single {{Element}}. This
 interface is not visible to Javascript.