MD Settings: Flush templates in settings-main before checking

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 0b94e78334c8f1b72da5dc3c7b5ab5dde1e96673..09ee0bed7913be396e46497743b0fddfe90bca02 100644
--- a/chrome/browser/resources/settings/settings_main/settings_main.js
+++ b/chrome/browser/resources/settings/settings_main/settings_main.js
@@ -130,7 +130,7 @@ Polymer({
         this.advancedToggleExpanded_ = true;
     }
 
-    // Wait for the dom-if changes prior to calculating the overflow padding.
+    // Wait for any other changes prior to calculating the overflow padding.
     this.async(function() {
       this.$.overscroll.style.paddingBottom = this.overscrollHeight_() + 'px';
     });
@@ -150,6 +150,9 @@ Polymer({
       return 0;
     }
 
+    // Ensure any dom-if reflects the current properties.
+    Polymer.dom.flush();

[Dan Beam, 2016/07/29 00:11:45]

:_(

[michaelpg, 2016/07/29 17:27:15]

there was a ton of discussion about this, but we can talk about it in the
stand-up if you like

but, some fun facts:

* "Insert, append, and remove operations are transacted lazily in certain cases
for performance. In order to interrogate the DOM (for example, offsetHeight,
getComputedStyle, etc.) immediately after one of these operations, call
Polymer.dom.flush() first"

* "It should be used sparingly as calling it frequently can negatively impact
performance since work is often deferred for efficiency. Calling
`Polymer.dom.flush()` is useful, for example, when an element has to measure
itself and is unsure about the state of its internal or compoased DOM."

* dom-if has a render() function..... which just calls Polymer.dom.flush()

[Dan Beam, 2016/07/29 18:28:39]

I didn't say it was wrong, I just said I was said to see it

[Dan Beam, 2016/07/29 18:28:54]

I was just sad** to see it

+
     /**
      * @param {!Element} element
      * @return {number}