Implement Element.scrollIntoView for scroll-behavior: smooth.

third_party/WebKit/Source/core/dom/Element.cpp

Index: third_party/WebKit/Source/core/dom/Element.cpp
diff --git a/third_party/WebKit/Source/core/dom/Element.cpp b/third_party/WebKit/Source/core/dom/Element.cpp
index 4943bb895fe17e8d13108b762f81e4600aa8dd1c..787eb09fdac6f1330493b78b8194d30d73c4857d 100644
--- a/third_party/WebKit/Source/core/dom/Element.cpp
+++ b/third_party/WebKit/Source/core/dom/Element.cpp
@@ -31,6 +31,7 @@
 #include "bindings/core/v8/Dictionary.h"
 #include "bindings/core/v8/ExceptionMessages.h"
 #include "bindings/core/v8/ExceptionState.h"
+#include "bindings/core/v8/ScrollIntoViewOptionsOrBoolean.h"
 #include "bindings/core/v8/V8DOMActivityLogger.h"
 #include "bindings/core/v8/V8DOMWrapper.h"
 #include "bindings/core/v8/V8PerContextData.h"
@@ -97,6 +98,7 @@
 #include "core/frame/HostsUsingFeatures.h"
 #include "core/frame/LocalDOMWindow.h"
 #include "core/frame/LocalFrame.h"
+#include "core/frame/ScrollIntoViewOptions.h"
 #include "core/frame/ScrollToOptions.h"
 #include "core/frame/Settings.h"
 #include "core/frame/UseCounter.h"
@@ -130,6 +132,7 @@
 #include "core/page/scrolling/ScrollCustomizationCallbacks.h"
 #include "core/page/scrolling/ScrollState.h"
 #include "core/page/scrolling/ScrollStateCallback.h"
+#include "core/page/scrolling/ScrollingCoordinator.h"

[bokan, 2017/04/07 15:56:52]

Unused, remove.

[sunyunjia, 2017/05/12 18:40:24]

Done.

 #include "core/page/scrolling/TopDocumentRootScrollerController.h"
 #include "core/paint/PaintLayer.h"
 #include "core/probe/CoreProbes.h"
@@ -141,6 +144,7 @@
 #include "platform/graphics/CompositorMutableProperties.h"
 #include "platform/graphics/CompositorMutation.h"
 #include "platform/scroll/ScrollableArea.h"
+#include "platform/scroll/SmoothScrollSequencer.h"
 #include "wtf/BitVector.h"
 #include "wtf/HashFunctions.h"
 #include "wtf/text/CString.h"
@@ -427,7 +431,35 @@ bool Element::shouldIgnoreAttributeCase() const {
   return isHTMLElement() && document().isHTMLDocument();
 }
 
+void Element::scrollIntoView(ScrollIntoViewOptionsOrBoolean arg) {
+  ScrollIntoViewOptions options;
+  if (arg.isBoolean()) {
+    if (arg.getAsBoolean())
+      options.setBlock("start");
+    else
+      options.setBlock("end");
+    options.setInlinePosition("nearest");
+  } else if (arg.isScrollIntoViewOptions()) {
+    options = arg.getAsScrollIntoViewOptions();
+    if (!RuntimeEnabledFeatures::cssomSmoothScrollEnabled() &&
+        options.behavior() == "smooth") {
+      options.setBehavior("instant");
+    }
+  }
+  scrollIntoViewWithOptions(options);
+}
+
 void Element::scrollIntoView(bool alignToTop) {
+  ScrollIntoViewOptions options;
+  if (alignToTop)
+    options.setBlock("start");
+  else
+    options.setBlock("end");
+  options.setInlinePosition("nearest");
+  scrollIntoViewWithOptions(options);
+}
+
+void Element::scrollIntoViewWithOptions(const ScrollIntoViewOptions& options) {
   document().updateStyleAndLayoutIgnorePendingStylesheetsForNode(this);
 
   if (!layoutObject())
@@ -436,18 +468,36 @@ void Element::scrollIntoView(bool alignToTop) {
   bool makeVisibleInVisualViewport =
       !document().page()->settings().getInertVisualViewport();
 
+  ScrollBehavior behavior = ScrollBehaviorAuto;
+  if (options.behavior() == "smooth") {
+    behavior = ScrollBehaviorSmooth;
+  }
+  // Block Alignment to the top / bottom and to the closest edge.
+  ScrollAlignment blockAlignment = ScrollAlignment::alignTopAlways;
+  if (options.block() == "center")
+    blockAlignment = ScrollAlignment::alignCenterAlways;
+  else if (options.block() == "end")
+    blockAlignment = ScrollAlignment::alignBottomAlways;
+  else if (options.block() == "nearest")
+    blockAlignment = ScrollAlignment::alignToEdgeIfNeeded;
+
+  // Inline Alignment to the top / bottom and to the closest edge.

[bokan, 2017/04/07 15:56:52]

Should this be left / right, rather than top / bottom?

[sunyunjia, 2017/05/12 18:40:24]

Done.

+  ScrollAlignment inlineAlignment = ScrollAlignment::alignToEdgeIfNeeded;

[bokan, 2017/04/07 15:56:52]

For consistency with the above block, default to alignLeftAlways here or default
the blockAlignment to alignToEdgeIfNeeded. 

[sunyunjia, 2017/05/12 18:40:24]

I set the default value according to the spec:
https://www.w3.org/TR/cssom-view-1/#dom-element-scrollintoview

It says, If arg is not specified or is true, let the block dictionary member of
options have the value "start", and let the inline dictionary member of options
have the value "nearest"

[bokan, 2017/05/15 17:15:27]

Ah, thanks and sorry, I missed that that was specified.

+  if (options.inlinePosition() == "start")
+    inlineAlignment = ScrollAlignment::alignLeftAlways;
+  else if (options.inlinePosition() == "center")
+    inlineAlignment = ScrollAlignment::alignCenterAlways;
+  else if (options.inlinePosition() == "end")
+    inlineAlignment = ScrollAlignment::alignRightAlways;
+
   LayoutRect bounds = boundingBox();
-  // Align to the top / bottom and to the closest edge.
-  if (alignToTop)
-    layoutObject()->scrollRectToVisible(
-        bounds, ScrollAlignment::alignToEdgeIfNeeded,
-        ScrollAlignment::alignTopAlways, ProgrammaticScroll,
-        makeVisibleInVisualViewport);
-  else
-    layoutObject()->scrollRectToVisible(
-        bounds, ScrollAlignment::alignToEdgeIfNeeded,
-        ScrollAlignment::alignBottomAlways, ProgrammaticScroll,
-        makeVisibleInVisualViewport);
+  layoutObject()->scrollRectToVisible(bounds, inlineAlignment, blockAlignment,
+                                      ProgrammaticScroll,
+                                      makeVisibleInVisualViewport, behavior);
+
+  if (document().page()) {

[bokan, 2017/04/07 15:56:52]

nit: remove braces

[sunyunjia, 2017/05/12 18:40:24]

Done.

+    document().page()->smoothScrollSequencer()->runQueuedAnimations();
+  }
 
   document().setSequentialFocusNavigationStartingPoint(this);
 }