Issue Summary

This is reproducible on Data Center: (no)

Webpanel in "location": "atl.general" with fixed height, pushes the whiteboard toolbar out of the visible window, requiring scrolling the main window to view the full toolbar.

Steps to Reproduce

1. create a connect app with a webpanel in "location": "atl.general". Example, atlassian-connect.json

   "webPanels": [
         {
           "key": "my-web-panel",
           "url": "/helloworld2.html",
           "name": {
             "value": "Atl General TEst"
           },
           "location": "atl.general",
           "layout": {
             "width": "100%",
             "height": "50px"
           }
         }
       ]
   

2. Install the app in a site
3. create a new whiteboard page in the site

Expected Results

Both the header and the whiteboard toolbar should be fully visible. As seen when we don't have any headers.

Actual Results

The header is visible, but the whiteboard toolbar is only partially visible (cropped out of window). We need to scroll the main page to be able to view the full toolbar. However, mouse scroll is capture by the whiteboard iframe (when in focus) and as a result scrolling with mouse doesn't work. This creates poor UX.

Workaround

We have the following options to scroll the main window.

1. It is possible to scroll the main window using "UP" and "DOWN" arrow buttons.
2. It is possible to scroll the main window by moving the pointer to the top navigation bar so that whiteboard iframe loses focus.
3. Is is possible to scroll the main window by clicking the scroll bar and then dragging.