We’re building an app that uses the page module to insert a generalPage into Confluence Cloud. So far, the iframe that renders this page has been resized correctly. But one particular customer is now experiencing some serious problems:
Through a screen sharing session and video recordings we could verify that Confluence does not correctly resize the iframe to the full width and height of the parent. This happens in about 90% of the page loads.
Similar issues like this seem to exist for other products as well:
- Bitbucket: Height issue with Safari and Atlassian-connect script
- Jira: Add-on iframe (auto)resize problems
- Confluence Cloud: Custom Content view doesnt get proper height
A possible fix
We could verify that the following snippet pasted into the Chrome Console fixes the problem and resizes the frame correctly:
const scrollHeight = document.body.scrollHeight;
AP.resize('100%', `${scrollHeight.toString()}px`);
AP.sizeToParent();
P.S.: This simple snippet is based on a more extensive fix proposed for BitBucket.
Questions
- Has anyone else noticed this for Confluence Cloud?
- It seems like there is work going on to fix this. What’s the state of this?
How we setup connect
This is the code that loads the connect client library with sizeToParent
set to true
.
<script src="https://connect-cdn.atl-paas.net/all.js" data-options="resize:true;sizeToParent:true;margin:false;base:false;hideFooter:true" referrerpolicy="no-referrer"></script>
This is how we setup the ac-content
element and initialise our app…
<body onload="loadScripts();">
<div class="ac-content">
Additional facts
- Customer is on macOS 10.15.7 using Chrome 88.0.4324.192.