[cssom-view] Add segments property to visual viewport (w3c#9237)

cssom-view-1/Overview.bs

@@ -1806,6 +1806,8 @@ interface VisualViewport : EventTarget {
 
   readonly attribute double scale;
 
+  readonly attribute FrozenArray<DOMRect> segments;
+
   attribute EventHandler onresize;
   attribute EventHandler onscroll;
   attribute EventHandler onscrollend;
@@ -1856,6 +1858,21 @@ The <dfn attribute for=VisualViewport>scale</dfn> attribute must run these steps
 1. If there is no output device, return 1 and abort these steps.
 1. Otherwise, return the <a>visual viewport</a>'s <a>scale factor</a>.
 
+The <dfn attribute for=VisualViewport>segments</dfn> is an array of DOMRects that represent the dimensions of each existing viewport segment.
+
+A viewport segment represents the region of the visual viewport that resides on a separate display or logical display region.
+When the visual viewport spans across some number of physical features of a device, these features in turn convey a logical separation of the space available for content.
+
+The segments attribute must run these steps:
+1. If the <a>visual viewport</a>'s <a for=visualviewport>associated document</a> is not <a>fully active</a>, return 0.
+2. Returns null if called from within an iframe context and abort these steps.
+3. Returns null if there is only a single viewport segment and abort these steps.
+4. Otherwise, return the <a>visual viewport</a>'s segments array.
+
+Note: Based on the data returned for each viewport segment, developers will be able to infer the number of hinges available as well as the hinge orientation.
+The browser window can be moved/resized such that the number of segments and/or their dimensions change.
+In these cases, resize events will fire at which point authors should re-query this property, as the returned FrozenArray is just a snapshot of the current state.
+
 <dfn attribute for=VisualViewport>onresize</dfn> is the <a>event handler IDL attribute</a> for the <a event>resize</a> event.
 
 <dfn attribute for=VisualViewport>onscroll</dfn> is the <a>event handler IDL attribute</a> for the <a event>scroll</a> event.