Openui5: uxap.ObjectPageLayout inside m.Dialog increases its height infinitely

Created on 13 May 2019  路  2Comments  路  Source: SAP/openui5

URL (minimal example if possible):

https://jsbin.com/ragules/edit?html,js,output

Steps to reproduce the problem:

  1. Open the above JSBin sample
  2. In the output panel, observe how the scroll container of the dialog increases its height infinitely.

Any other information? (attach screenshot if possible)

Aside from the questionable UI choice (putting a whole sap.uxap.ObjectPageLayout inside a Dialog), this behavior occurs only if there are more than one sap.uxap.ObjectPageSubSection controls within the ObjectPageLayout.

bug in progress

Most helpful comment

Hi @boghyon,
the problem comes from the configuration between the wo controls,
because sap.m.Dialog has default scrolling behaviour, which is trigerring content resize event handler
to set the height of its scrolling container, which is forcing the ObjectPageLayout spacer to grow indefinately with its snapping header height, based on current height of the control DOM element. It is bad collaboration between Dialog and OPL, because they are not taking advantage of the only static height they have - the one set on the sap.m.Dialog container.
There is one configuration, that basicly passes this height down in the DOM tree with "100%" height of the scroll containers of the dialog and that way the OPL takes it and calculates on top of it. You should disable all the scrolling inside the dialog, not setting a sap.m.ScrollContainer and stretch the content inside. It is my current resolution, but basicly OPL is designed to work inside a sap.m.Page, where it depends on the viewport height.

You can check it out here: https://jsbin.com/tukuyiy/2/edit?html,js,output

I hope my finding helps you!
Have a nice day!
Regrads,
Petya Bogdanova
(UI5 Developer)

All 2 comments

Hello @boghyon ,
Thank you for sharing this finding. I've created an internal incident 1980264543. The status of the issue will be updated here in GitHub.
Regards, Diana

Hi @boghyon,
the problem comes from the configuration between the wo controls,
because sap.m.Dialog has default scrolling behaviour, which is trigerring content resize event handler
to set the height of its scrolling container, which is forcing the ObjectPageLayout spacer to grow indefinately with its snapping header height, based on current height of the control DOM element. It is bad collaboration between Dialog and OPL, because they are not taking advantage of the only static height they have - the one set on the sap.m.Dialog container.
There is one configuration, that basicly passes this height down in the DOM tree with "100%" height of the scroll containers of the dialog and that way the OPL takes it and calculates on top of it. You should disable all the scrolling inside the dialog, not setting a sap.m.ScrollContainer and stretch the content inside. It is my current resolution, but basicly OPL is designed to work inside a sap.m.Page, where it depends on the viewport height.

You can check it out here: https://jsbin.com/tukuyiy/2/edit?html,js,output

I hope my finding helps you!
Have a nice day!
Regrads,
Petya Bogdanova
(UI5 Developer)

Was this page helpful?
0 / 5 - 0 ratings