Custom Content view doesnt get proper height

Confluence Development Confluence Cloud
1

Hi ,

We are trying to develop a Custom content which has a general page as the contentViewComponent.

"generalPages": [{
            "url": "/app/index.html?content.plugin={content.plugin}&content.id={content.id}&content.version={content.version}&space.key={space.key}/#/reports/public",
            "name": {
                "value": "My viewer page"
            },
            "key": "my-content-view"
        }],

The issue is that the general page is not getting resized to parent-height, although the same works for JIRA General page. We have set the <body class="ac-content">

Observation

isFullPage : data.general is not set to 1 in case of Confluence iframe , whereas its set to 1 in Jira iFrame.

Ref - Jira iframe

<script class="ap-iframe-body-script">
  (function(){
    var data = {
    "addon_key":"alpha.plugin.view26.actio9",
    "uniqueKey":"alpha.plugin.view26.actio9__view26-app",
    "key":"view26-app",
    "cp":"",
    "uid":"admin",
    "ukey":"admin",
    "general":"1",
    "w":"",
    "h":"",
    "url":"https://xxxxx/index.html?tz=Asia%2FKolkata&loc=en-US&user_id=admin&user_key=admin&xdm_e=https%3A%2F%2Fxxxxx.atlassian.net&xdm_c=channel-alpha.plugin.view26.actio9__view26-app&cp=&xdm_deprecated_addon_key_do_not_use=alpha.plugin.view26.actio9&lic=none&cv=1.2.35&jwt=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJhZG1pbiIsInFzaCI6IjhiYmE4MzVjY2ZmYTcwOTkwYmVkMDAwODVlMzBjYzRlZDJkYWJiZjAwYWZjNzkwZjk4MjcxZmI0OWJjOTkxMjEiLCJpc3MiOiJlMTc5ZGU4Yi0wYTFiLTM2ZDctYTkxZC1mOWE2MThiY2YzNjciLCJjb250ZXh0Ijp7InVzZXIiOnsidXNlcktleSI6ImFkbWluIiwidXNlcm5hbWUiOiJhZG1pbiIsImRpc3BsYXlOYW1lIjoiQW5lZXNoaWEgRGl2YWthcmFuICBbQWRtaW5pc3RyYXRvcl0ifX0sImV4cCI6MTQ4OTEyNTk2NCwiaWF0IjoxNDg5MTI1Nzg0fQ.DbCA1nbmwHnXjF9sMdwLxojMup__bxOOd52Ho1xA1bg",
    "productCtx":"{\"user.key\":\"admin\",\"project.key\":\"DP\",\"project.id\":\"10000\",\"user.id\":\"admin\"}",
    "timeZone":"Asia/Kolkata",
    "origin":"https://xxxxx.com",
    "hostOrigin":"https://xxxxx.atlassian.net"
};
    if(window.AP && window.AP.subCreate) {
      window._AP.appendConnectAddon(data);
    } else {
      require(['ac/create'], function(create){
        create.appendConnectAddon(data);
      });
    }
  }());
</script>

Ref - Confluence iframe

<script class="ap-iframe-body-script">
  (function(){
    var data = {
    "addon_key":"alpha.macro.view26",
    "uniqueKey":"alpha.macro.view26__my-content-view",
    "key":"my-content-view",
    "cp":"/wiki",
    "uid":"admin",
    "ukey":"ff80808159b554390159b5546d490001",
    "general":"",
    "w":"100%",
    "h":"100%",
    "url":"https://xxxxx.com/app/index.html?v26reportid=&content.plugin=ac%3Aalpha.macro.view26%3Amy-custom-content&contentid=1059739&content.version=1&space.key=AS%2F&tz=Asia%2FKolkata&loc=en-GB&user_id=admin&user_key=ff80808159b554390159b5546d490001&xdm_e=https%3A%2F%2Fxxxxx.atlassian.net&xdm_c=channel-alpha.macro.view26__my-content-view&cp=%2Fwiki&xdm_deprecated_addon_key_do_not_use=alpha.macro.view26&lic=none&cv=1.2.35#/reports/public",
    "productCtx":"{\"content.plugin\":\"ac:alpha.macro.view26:my-custom-content\",\"space.key\":\"AS\",\"content.id\":\"1059739\",\"content.version\":\"1\",\"space.id\":\"1052363\",\"content.type\":\"custom\"}",
    "timeZone":"Asia/Kolkata",
    "origin":"https://xxxxx.com",
    "hostOrigin":"https://xxxxx.atlassian.net"
};
    if(window.AP && window.AP.subCreate) {
      window._AP.appendConnectAddon(data);
    } else {
      require(['ac/create'], function(create){
        create.appendConnectAddon(data);
      });
    }
  }());
</script>
2

On your all.js declaration - do you have sizeToParent:true ? i.e.

<script src="https://{HOSTNAME}/{CONTEXT}/atlassian-connect/all.js" data-options="sizeToParent:true"></script>

The ac-content class should resize the iframe to fit your content(as long as you don’t have resize:false) but you might want to do both options in this case.

1 Like
3

Hi Daniel,

I did a small POC using the following code

.....
    all_js_script.setAttribute('data-options', 'sizeToParent:true;hideFooter:true;resize:true');
    .....
    <body class="ac-content">
.....

Screenshot of general page:

unnamed.png816×546 122 KB

Even then the iframe height remains 150px and scroll appears for large content.

Update
We see that the general page which is not connected(related) to custom content works fine with sizeToParent:true

1 Like
4

That sounds like a bug. The all_js_script is dynamically inserted by your javascript code? (I think they do the connection bits when the bridge is established).

Not sure who to tag, but maybe @epehrson has some ideas?

5

Yes we are inserting all_js_script dynamically.

6

@epehrson any tips ?

7

This seems to be a bug in the Custom Content module that has been fixed in the release that is rolling out to production over the next few days (CE-893).

8

Has this really been fixed? I have just taken the basic static add-on (https://developer.atlassian.com/static/connect/docs/latest/tutorials/connect-basics.html), modified the descriptor to place the content on a web panel, and I see the same issue. No vertical resizing. All the content is squashed into the top 20% of the screen, and there is a scroll bar. How can I get the page to occupy all the space.

9

This topic relates specifically to the Custom Content module for Confluence.

Could you please create a new topic for your problem with web panels, including your add-on descriptor and relevant HTML for initializing our JavaScript API?