MD Settings: Fix scrolling bugs and hacks caused by undefined load behavior

chrome/browser/resources/settings/settings_main/settings_main.js

Index: chrome/browser/resources/settings/settings_main/settings_main.js
diff --git a/chrome/browser/resources/settings/settings_main/settings_main.js b/chrome/browser/resources/settings/settings_main/settings_main.js
index c29e84e4eae8489097e081b78599acdd06b8bc1e..fdd87038d2442adfcfc9a114d41f96b78929911d 100644
--- a/chrome/browser/resources/settings/settings_main/settings_main.js
+++ b/chrome/browser/resources/settings/settings_main/settings_main.js
@@ -48,12 +48,7 @@ Polymer({
      * Controls which main pages are displayed via dom-ifs.
      * @private {!MainPageVisibility}
      */
-    showPages_: {
-      type: Object,
-      value: function() {
-        return {about: false, basic: false, advanced: false};
-      },
-    },
+    showPages_: Object,
 
     /**
      * The main pages that were displayed before search was initiated. When
@@ -107,7 +102,11 @@ Polymer({
       this.boundScroll_ = null;
     } else if (this.overscroll_ && !this.boundScroll_) {
       this.boundScroll_ = this.setOverscroll_.bind(this, 0);
-      this.offsetParent.addEventListener('scroll', this.boundScroll_);
+      // Do not react immediately to scroll events since the overscroll was
+      // just set; we may be trying to scroll somewhere first.
+      setTimeout(function() {

[michaelpg, 2016/08/19 04:40:45]

I wish I didn't have to do this, but when we route to a section we would set the
overscroll (adding this handler), then the MainPageBehavior tries to scroll
(triggering this handler) and the overscroll gets reset to 0.

[dschuyler, 2016/08/23 02:09:50]

would afterNextRender help any better?

[michaelpg, 2016/09/29 01:12:48]

Ended up not needing this.

+        this.offsetParent.addEventListener('scroll', this.boundScroll_);
+      }.bind(this));
     }
   },
 
@@ -171,6 +170,8 @@ Polymer({
    * @private
    */
   updatePagesShown_: function() {
+    var oldShowPages = this.showPages_;
+
     var currentRoute = settings.getCurrentRoute();
     if (settings.Route.ABOUT.contains(currentRoute)) {
       this.showPages_ = {about: true, basic: false, advanced: false};
@@ -190,13 +191,27 @@ Polymer({
       }
     }
 
-    // Wait for any other changes prior to calculating the overflow padding.
-    setTimeout(function() {
-      // Ensure any dom-if reflects the current properties.
-      Polymer.dom.flush();
+    // Initialize the overscroll after rendering a page.
+    if (!oldShowPages)
+      setTimeout(this.updateOverscroll_.bind(this));
+    else
+      this.updateOverscroll_();
+  },
+
+  /**
+   * Sets the overscroll synchronously and asynchronously, to avoid
+   * preventing or conflicting with other DOM changes.
+   * @private
+   */
+  updateOverscroll_: function() {
+    // Update the overscroll padding so pages can scroll to section.
+    this.setOverscroll_(this.overscrollHeight_());
 
+    // Wait for any other changes to page height, then calculate the overflow
+    // padding again.
+    this.async(function() {
       this.setOverscroll_(this.overscrollHeight_());
-    }.bind(this));
+    });
   },
 
   /**