Selecting a particular sequence of view options causes graph to shrink to the size of one node

[kdahlquist]

Do this on either production or beta 7.0.8:

• Load Demo number 2
• From the View menu, select small
• select medium
• select large
• select fit to viewport and the graph will shrink to the size of one node.

It may not have to be this exact sequence to make this happen.

[dondi]

Starting (actual) window size will determine the initial View setting, so @ceciliazaragoza will retry this with a smaller initial window

[ceciliazaragoza]

I tried starting with a small viewport size and then increasing, but I am still not receiving the issue on local. However, I notice that whenever I choose Fit to Viewport on beta, the graph size always decreases to one node, even without choosing other view sizes first. If I change to another view size and then back to Fit to Viewport, I do not receive the issue, though. I am receiving these error messages in the console:

[ntran18]

Verified that I have the same issue with @ceciliazaragoza. This issue is hard to debug on local machine.

[ceciliazaragoza]

Because this issue is only happening on the deployed beta, it must be an issue with communication between the client laptop and the server. However, this is hard to test without deploying my code. The issue probably has something to do with this code below because there is no issue when switching between other viewport sizes, and the functions synchronizeViewportSizeFit() and requestWindowDimensions() are only called with Fit to Viewport.

[dondi]

After looking at this, it was [re-]discovered that the deployment observation is due to how the deployed site is running a static web page with an iframe containing the actual GRNsight app. When we are working locally, we don’t have the iframe and we are running the app directly in a window (this can be simulated on the deployed version by looking at the iframe src and opening a browser window directly with that as the URL)

To address this bug without constant redeploys, we can set up this environment locally:

• Prepare a dummy web page/site that references the local GRNsight copy inside of an iframe (see beta.html for specifics)

• Edit the HOST_SITE constant to be the site hosting the dummy web page (e.g., http://localhost:3000 if the dummy web page is a React app)

• With this setup, the message communication between update-app.js and iframe-coordination.js should now be entirely local. console.log statements can be used to follow the interaction

After this is done, next steps will then depend on what @ceciliazaragoza discovers