Set height go jiraIssueTabPanels

Jira Development
1

I am developing a Jira add-on with Atlassian Connect that I want to show in an issue tab panel.

"jiraIssueTabPanels": [{
      "url": "v1/atlassian/jira/issue/{issue.key}",
      "weight": 100,
      "name": {
        "value": "Customer Feedback"
      },
      "key": "customer-feedback-panel"
    }]

When it is installed and rendered, the panel has a fixed height of 150px. How can this be set to extend to match the height of the content?

A (working) link to documentation of the solution would be much appreciated. There is so much out there, and so many posts lead to broken links that it is currently close to impossible to Google for help.

1 Like
2

You’ll want to take a gander at https://developer.atlassian.com/cloud/jira/platform/about-the-javascript-api/ - in particular the sandboxing area (it has content that’s not related to sandboxing). But basically - wrap your content with

…

3

Thanks Daniel,

Wrapping wasn’t the answer, as I was doing that already, but you got me looking in the right direction.

My app was using the following code to load the API. This was copied from step 2 of the getting started guide.

I then noticed that the options sizeToParent was being set to true. Setting to false fixed my issue.

<script id="connect-loader" data-options="sizeToParent:true;">
        (function() {
            var getUrlParam = function (param) {
                var codedParam = (new RegExp(param + '=([^&]*)')).exec(window.location.search)[1];
                return decodeURIComponent(codedParam);
            };

            var baseUrl = getUrlParam('xdm_e') + getUrlParam('cp');
            var options = document.getElementById('connect-loader').getAttribute('data-options');

            var script = document.createElement("script");
            script.src = baseUrl + '/atlassian-connect/all.js';

            if(options) {
                script.setAttribute('data-options', options);
            }

            document.getElementsByTagName("head")[0].appendChild(script);
        })();
</script>
1 Like