[cssom-view] Change scrollIntoView({}) to center, and add "nearest"

* Change default value of ScrollIntoViewOptions to center/center.
* Add a "nearest" value to ScrollLogicalPosition.
* scrollIntoView() and scrollIntoView(true|false) use start/end for
  block flow direction and nearest for inline base direction.

Author: zcorpan

cssom-view/Overview.bs

@@ -991,10 +991,10 @@ Extensions to the {{Element}} Interface {#extension-to-the-element-interface}
 =============================================================================
 
 <pre class=idl>
-enum ScrollLogicalPosition { "start", "center", "end" };
+enum ScrollLogicalPosition { "start", "center", "end", "nearest" };
 dictionary ScrollIntoViewOptions : ScrollOptions {
-  ScrollLogicalPosition block = "start";
-  ScrollLogicalPosition inline;
+  ScrollLogicalPosition block = "center";
+  ScrollLogicalPosition inline = "center";
 };
 
 partial interface Element {
@@ -1056,7 +1056,8 @@ The <dfn method for=Element>scrollIntoView(<var>arg</var>)</dfn> method must run
 1. Let <var>options</var> be null.
 1. If <var>arg</var> is an object, let <var>options</var> be <var>arg</var>.
 1. <a lt="converted to an IDL value">Convert</a> <var>options</var> to a {{ScrollIntoViewOptions}} dictionary. [[!WEBIDL]]
-1. If <var>arg</var> is false, let the {{ScrollIntoViewOptions/block}} dictionary member of <var>options</var> have the value "<code>end</code>".
+1. If <var>arg</var> is not specified or is true, let the {{ScrollIntoViewOptions/block}} dictionary member of <var>options</var> have the value "<code>start</code>", and let the {{ScrollIntoViewOptions/inline}} dictionary member of <var>options</var> have the value "<code>nearest</code>".
+1. If <var>arg</var> is false, let the {{ScrollIntoViewOptions/block}} dictionary member of <var>options</var> have the value "<code>end</code>", and let the {{ScrollIntoViewOptions/inline}} dictionary member of <var>options</var> have the value "<code>nearest</code>".
 1. If the element does not have any associated <a>layout box</a> terminate these steps.
 1. <a lt='scroll an element into view'>Scroll the element into view</a>
     with the options <var>options</var>.
@@ -1236,11 +1237,24 @@ a <a>scrolling box</a> <var>scrolling box</var>, in order of innermost to outerm
 
     1. If the {{ScrollIntoViewOptions/block}} dictionary member of <var>options</var> is "start", align <var>element edge A</var> with <var>scrolling box edge A</var>.
     1. Otherwise, if the {{ScrollIntoViewOptions/block}} dictionary member of <var>options</var> is "end"; align <var>element edge B</var> with <var>scrolling box edge B</var>.
-    1. Otherwise, it is "center"; align the center of <var>element bounding border box</var> with the center of <var>scrolling box</var> in <var>scrolling box</var>'s <a>block flow direction</a>.
+    1. Otherwise, if the {{ScrollIntoViewOptions/block}} dictionary member of <var>options</var> is "center"; align the center of <var>element bounding border box</var> with the center of <var>scrolling box</var> in <var>scrolling box</var>'s <a>block flow direction</a>.
+    1. Otherwise, it is "nearest"; follow these steps:
+        <dl class=switch>
+            <dt>If <var>element edge A</var> and <var>element edge B</var> are both outside <var>scrolling box edge A</var> and <var>scrolling box edge B</var>
+            <dd>Do nothing.
+
+            <dt>If <var>element edge A</var> is outside <var>scrolling box edge A</var> and <var>element width</var> is less than <var>scrolling box width</var>
+            <dt>If <var>element edge B</var> is outside <var>scrolling box edge B</var> and <var>element width</var> is greater than <var>scrolling box width</var>
+            <dd>Align <var>element edge A</var> with <var>scrolling box edge A</var>.
+
+            <dt>If <var>element edge A</var> is outside <var>scrolling box edge A</var> and <var>element width</var> is greater than <var>scrolling box width</var>
+            <dt>If <var>element edge B</var> is outside <var>scrolling box edge B</var> and <var>element width</var> is less than <var>scrolling box width</var>
+            <dd>Align <var>element edge B</var> with <var>scrolling box edge B</var>.
+        </dl>
     1. If the {{ScrollIntoViewOptions/inline}} dictionary member of <var>options</var> is "start", align <var>element edge C</var> with <var>scrolling box edge C</var>.
     1. Otherwise, if the {{ScrollIntoViewOptions/inline}} dictionary member of <var>options</var> is "end"; align <var>element edge D</var> with <var>scrolling box edge D</var>.
     1. Otherwise, if the {{ScrollIntoViewOptions/inline}} dictionary member of <var>options</var> is  "center", align the center of <var>element bounding border box</var> with the center of <var>scrolling box</var> in <var>scrolling box</var>'s <a>inline base direction</a>.
-    1. Otherwise, it is not set; follow these steps:
+    1. Otherwise, it is "nearest"; follow these steps:
         <dl class=switch>
             <dt>If <var>element edge C</var> and <var>element edge D</var> are both outside <var>scrolling box edge C</var> and <var>scrolling box edge D</var>
             <dd>Do nothing.