Manage Group Theme -> Edit This Page crashes with widget that uses an iframe

Hello,

We have a bug where the Edit This Page page/panel crashes.  It happens when we delpoy a widget that uses an iframe, however, all complex operations are contained within the iframe. After deploying our configuring a group's page and deploying our widget the Edit this Page panel continues to work for a while.  However, after a period time the Edit this Page panel stops working.  Clearing our browser cache and logging back in has no effect once a group's Edit This Page panel is broken, the only remedy appears to be deleting the group and starting over. 

This is what we see on an affected page:

The complete list of symptoms are the following:

  1. The Edit this Page panel is blank, no functionality is available
  2. All other control panel functionality appears to work
  3. The only solution appears to be to delete the group, re-configure and re-install widgets.  This works for a period of time, but then the Group works itself into a bad state and the Edit this Page panel breaks again.

Here's the widget's Content file:

<script>
    var QuickSightEmbed = {
        init: function() {
            var dashboardEmbed = $core_v2_widget.ExecuteFile('okta-token.jsm');
            console.log(JSON.stringify(dashboardEmbed));
            if(dashboardEmbed.error == true) {
                this.renderError();
            } else {
                var embedLink = dashboardEmbed.EmbedUrl;
                this.renderUi(embedLink);
            }
        },
        
        renderUi: function(embedLink) {
            var self = this;
            jQuery("#quicksight-error").hide();
            console.log("embedLink=" + embedLink);
            var iframe = jQuery("#quicksightFrame");
            
            var width = iframe.closest(".content-fragment-content").width();
            iframe.attr("src",embedLink);
            iframe.attr("width",width);
            
            jQuery("#quicksightFrame").show();
            this.resize();
            
        },
        
        resize: function() {
            var self = this;
            window.setTimeout(function(){
                var iframe = jQuery("#quicksightFrame");
                var iframeBody = iframe.contents().find('body');
                if(iframeBody.height()) {
                    var newHeight = iframeBody.height() + 300;
                    console.log("resizing quicksight iframe to:" + newHeight);
                    iframe.height(newHeight);
                } else {
                    self.resize();
                }
            },500);
        },
        
        renderError: function() {
            jQuery("#quicksightFrame").hide();
            jQuery("#quicksight-error").show();
        }
        
    };
    
</script>
.
<script>
    
    jQuery(document).ready(function(){

        QuickSightEmbed.init();
    });
    
</script>

<div>
    <iframe id="quicksightFrame" style="display:none;" frameBorder="0" src="" width="600" height="840" />
</div>
<div id="quicksight-error" style="display:none;">Error connecting to Quicksight, please ensure permissions.</div>

Is there anything visibly wrong with the code above?  It executes a server-side .jsm file which return a javascript object which contains the link we put in our iframe.  Aside from that it's relatively simple.

Inside the iframe is a rather complex charting/graphing application.  However, since this is contained in an iframe it should not affect the parent page (unless I'm mistaken).

Chris