MD Settings: Prevent unexpected scrolling to section on popstates.

chrome/browser/resources/settings/settings_page/main_page_behavior.js

 // Copyright 2016 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * Calls |readyTest| repeatedly until it returns true, then calls
  * |readyCallback|.
  * @param {function():boolean} readyTest
  * @param {!Function} readyCallback
  */
@@ skipping 27 matching lines @@
   attached: function() {
     if (this.domHost && this.domHost.parentNode.tagName == 'PAPER-HEADER-PANEL')
       this.scroller = this.domHost.parentNode.scroller;
     else
       this.scroller = document.body; // Used in unit tests.
   },
 
   /**
    * @param {!settings.Route} newRoute
    * @param {settings.Route} oldRoute
+   * @param {boolean} isPopstate
    */
-  currentRouteChanged: function(newRoute, oldRoute) {
+  currentRouteChanged: function(newRoute, oldRoute, isPopstate) {
     // Allow the page to load before expanding the section. TODO(michaelpg):
     // Time this better when refactoring settings-animated-pages.
     if (!oldRoute && newRoute.isSubpage()) {
-      setTimeout(this.tryTransitionToSection_.bind(this));
+      setTimeout(this.tryTransitionToSection_.bind(this, isPopstate));
     } else {
       doWhenReady(
         function() {
           return this.scrollHeight > 0;
         }.bind(this),
-        this.tryTransitionToSection_.bind(this));
+        this.tryTransitionToSection_.bind(this, isPopstate));
     }
   },
 
   /**
    * If possible, transitions to the current route's section (by expanding or
    * scrolling to it). If another transition is running, finishes or cancels
    * that one, then schedules this function again. This ensures the current
    * section is quickly shown, without getting the page into a broken state --
    * if currentRoute changes in between calls, just transition to the new route.
+   * @param {boolean} isPopstate
    * @private
    */
-  tryTransitionToSection_: function() {
+  tryTransitionToSection_: function(isPopstate) {
     var currentRoute = settings.getCurrentRoute();
     var currentSection = this.getSection(currentRoute.section);
 
     // If an animation is already playing, try finishing or canceling it.
     if (this.currentAnimation_) {
       this.maybeStopCurrentAnimation_();
       // Either way, this function will be called again once the current
       // animation ends.
       return;
     }
 
     var promise;
     var expandedSection = /** @type {?SettingsSectionElement} */(
         this.$$('settings-section.expanded'));
     if (expandedSection) {
       // If the section shouldn't be expanded, collapse it.
       if (!currentRoute.isSubpage() || expandedSection != currentSection) {
         promise = this.collapseSection_(expandedSection);
         // Scroll to the collapsed section.
-        if (currentSection)
+        if (currentSection && !isPopstate)
           currentSection.scrollIntoView();
       }
     } else if (currentSection) {
       // Expand the section into a subpage or scroll to it on the main page.
       if (currentRoute.isSubpage())
         promise = this.expandSection_(currentSection);
-      else
+      else if (!isPopstate)
         currentSection.scrollIntoView();
     }
 
     // When this animation ends, another may be necessary. Call this function
     // again after the promise resolves.
     if (promise)
-      promise.then(this.tryTransitionToSection_.bind(this));
+      promise.then(this.tryTransitionToSection_.bind(this, isPopstate));

[michaelpg, 2016/09/02 19:37:42]

tryTransitionToSection transitions to whatever the current route is, so I'm not
sure we should be passing isPopstate like this. isPopstate should be based on
whether the most recent route was a popstate, not whether the route that happens
to be the first to call tryTransitionToSection_ after an animation was a
popstate.

Something like settings.isCurrentRoutePopstate() would work, if that would make
sense to have.

[tommycli, 2016/09/02 20:53:43]

Done.

   },
 
   /**
    * If the current animation is inconsistent with the current route, stops the
    * animation by finishing or canceling it so the new route can be animated to.
    * @private
    */
   maybeStopCurrentAnimation_: function() {
     var currentRoute = settings.getCurrentRoute();
     var animatingSection = /** @type {?SettingsSectionElement} */(
@@ skipping 105 matching lines @@
       return Promise.resolve();
     }
 
     // Play the actual collapse animation.
     return new Promise(function(resolve, reject) {
       // Wait for the other sections to show up so we can scroll properly.
       setTimeout(function() {
         var newSection = settings.getCurrentRoute().section &&
             this.getSection(settings.getCurrentRoute().section);
 
-        // Scroll to the section if indicated by the route. TODO(michaelpg): Is
-        // this the right behavior, or should we return to the previous scroll
-        // position?
-        if (newSection)
-          newSection.scrollIntoView();
-        else
-          this.scroller.scrollTop = this.origScrollTop_;
+        this.scroller.scrollTop = this.origScrollTop_;
 
         this.currentAnimation_ = section.animateCollapse(
             /** @type {!HTMLElement} */(this.scroller));
 
         this.currentAnimation_.finished.catch(function() {
           // The collapse was canceled, so the page is showing a subpage still.
           this.fire('subpage-expand');
         }.bind(this)).then(function() {
           // Clean up after the animation succeeds or cancels.
           section.setFrozen(false);
@@ skipping 50 matching lines @@
       this.scroller.style.width = 'calc(100% - ' + scrollbarWidth + 'px)';
     }
   }
 };
 
 /** @polymerBehavior */
 var MainPageBehavior = [
   settings.RouteObserverBehavior,
   MainPageBehaviorImpl,
 ];