How to determine Google Sheets window size

Question

In a Modal Dialog launched from a Google Sheet-contained script, is there some way to determine what the size of the browser window or host display is? I want to be able to set the width of a dialog to a percentage of the user's display, so support a variety of machines.

Normal jQuery techniques like $( window ).width() and $( document ).width() return the width of the dialog, which isn't what I want (and is unique to this environment).

Trying to refer to any of the div containers outside of the dialog returns null (I've tried "#docs-editor-container", "modal-dialog-bg", and a few others.)

Here's a simple script to recreate this dialog with the results I've got so far.

Code.gs

function openDialog() {
  var htmlOutput = HtmlService.createHtmlOutputFromFile('Dialog')
     .setWidth(500)
     .setHeight(400);
  SpreadsheetApp.getUi().showModalDialog(htmlOutput, 'How wide is the screen?');
  return;
}

Dialog.html

<div id="outer" style="padding:1;"/>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
  $(function() {
    reportSizeOf( 'window',$(window) );                   // 500 - expected
    reportSizeOf( 'document',$(document) );                 // 500 - same as window
    reportSizeOf( '#docs-editor-container',$('#docs-editor-container'));  // null
    reportSizeOf( 'modal-dialog-bg',$('modal-dialog-bg'));         // null
  });

  function reportSizeOf( elname, element ) {
    $('#outer').append('<br>Width of "' + elname + '": ' + element.width());
  }
</script>

Answer 1

If the Add-on iframe origin was the same, we could jump out of 2 iframes with:

parent.parent.document.body.clientHeight

to access it as noted in this post.

Since it's not, an enhancement request is probably needed for Docs to pass max sizing onto Add-on iframe via postmessage or some other cross-origin mechanism. Adding a maxHeight and width to the existing Browser class may be more straight-forward, but think that was designed for just adding browser-type widgets.

Setting a larger than needed width does fall back to the max-width of Docs window but it causes the close button to be out of view for the user forcing them to press esc. If you're wanting like a 90% max height / width view of Docs, doesn't seem possible currently.