MD Settings: Fix starting height of expanding sections

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

 // Copyright 2015 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.
 
 /**
  * @fileoverview
  * 'settings-animated-pages' is a container for a page and animated subpages.
  * It provides a set of common behaviors and animations.
  *
  * Example:
@@ skipping 90 matching lines @@
       // For transitioning between subpages at different levels, slide.
       if (newRoute.subpage.length > oldRoute.subpage.length) {
         this.$.animatedPages.exitAnimation = 'slide-left-animation';
         this.$.animatedPages.entryAnimation = 'slide-from-right-animation';
       } else {
         this.$.animatedPages.exitAnimation = 'slide-right-animation';
         this.$.animatedPages.entryAnimation = 'slide-from-left-animation';
       }
     }
 
-    if (newRouteIsSubpage && newRoute.section == this.section)
+    if (newRouteIsSubpage && newRoute.section == this.section) {
+      if (!oldRouteIsSubpage) {
+        // Set the height the expand animation should start at before beginning
+        // the transition to the new sub-page.
+        // TODO(michaelpg): Remove MainPageBehavior's dependency on this height
+        // being set.
+        this.style.height = this.clientHeight + 'px';
+        this.async(function() {
+          this.style.height = '';
+        });
+      }
       this.$.animatedPages.selected = newRoute.subpage.slice(-1)[0];
-    else
+    } else {
       this.$.animatedPages.selected = 'main';
+    }
   },
 
   /**
    * Ensures that the template enclosing the subpage is stamped.
    * @private
    */
   ensureSubpageInstance_: function() {
     var id = this.currentRoute.subpage.slice(-1)[0];
     var template = Polymer.dom(this).querySelector(
         'template[name="' + id + '"]');
 
     // Nothing to do if the subpage isn't wrapped in a <template> or the
     // template is already stamped.
     if (!template || template.if)
       return;
 
     // Set the subpage's id for use by neon-animated-pages.
     var subpage = /** @type {{_content: DocumentFragment}} */(template)._content
         .querySelector('settings-subpage');
     if (!subpage.id)
       subpage.id = id;
 
     // Render synchronously so neon-animated-pages can select the subpage.
     template.if = true;
     template.render();
   },
 });