WebUI: restrict cr-dialogs max-height to the viewport.

ui/webui/resources/cr_elements/cr_dialog/cr_dialog.js

Index: ui/webui/resources/cr_elements/cr_dialog/cr_dialog.js
diff --git a/ui/webui/resources/cr_elements/cr_dialog/cr_dialog.js b/ui/webui/resources/cr_elements/cr_dialog/cr_dialog.js
index 3e9fc20ba55944730342044421ecc1ec773b8336..0fe9b0e38990b83247109d0ce74427bb33f56667 100644
--- a/ui/webui/resources/cr_elements/cr_dialog/cr_dialog.js
+++ b/ui/webui/resources/cr_elements/cr_dialog/cr_dialog.js
@@ -64,6 +64,9 @@ Polymer({
       this.addEventListener('keypress', this.onKeypress_.bind(this));
   },
 
+  /** @private {Function} */
+  onResize_: null,
+
   /** @override */
   attached: function() {
     if (!this.showScrollBorders)
@@ -72,6 +75,10 @@ Polymer({
     this.mutationObserver_ = new MutationObserver(function() {
       if (this.open) {
         this.addIntersectionObserver_();
+        this.adjustHeight_();
+
+        this.onResize_ = this.adjustHeight_.bind(this);
+        window.addEventListener('resize', this.onResize_);
       } else {
         this.removeIntersectionObserver_();
       }
@@ -90,6 +97,20 @@ Polymer({
       this.mutationObserver_.disconnect();
       this.mutationObserver_ = null;
     }
+    window.removeEventListener('resize', this.onResize_);
+  },
+
+  adjustHeight_: function() {

[dpapad, 2017/04/27 22:33:24]

Can we add a test for the auto-shrink logic? Also, does this look jarring to the
user (things jump around)?

[scottchen, 2017/04/28 23:12:55]

It did not jump around. 
However, based on our offline conversation I've switched to a more manageable
CSS-only solution.

+    // Try to first render with just CSS styling.
+    this.$$('.body-container').style.maxHeight = null;
+
+    var delta = this.offsetHeight - window.innerHeight;
+
+    // If dialog is taller than visible viewport height, shrink by difference.
+    if (delta > 0) {
+      this.$$('.body-container').style.maxHeight =
+          (this.$$('.body-container').offsetHeight - delta) + 'px';
+    }
   },
 
   /** @private */