[Dynamic Page]: Floating footer does not always scroll

[skowrons]

Describe the bug

The floating footer will sometimes stop scrollen when a normal DynamicPage with a form is to large for the screen. This happens mostly on mobile and really consistent on mobile but it currently also happens on larger screens.

The provided example does not really showcase my error but also shows another problem with the height (scroll down and see the bar jumping).

Isolated Example

https://stackblitz.com/edit/github-xww5ig?file=src%2FApp.tsx

Reproduction steps

The error can not be reproduced all the time but only happens if the form is larger than the current screen and the user is scrolling.

Expected Behaviour

The floating footer should scroll to the of the page.

Screenshots or Videos

UI5 Web Components for React Version

1.28.1

UI5 Web Components Version

1.24.0

Browser

Chrome

Operating System

MacOS

Additional Context

No response

Relevant log output

No response

Organization

No response

Declaration

• [X] I’m not disclosing any internal or sensitive information.

[Lukas742]

Hi @skowrons

the DynamicPage is a page layout and should include the whole viewport. Therefore, it's generally recommended to use a non-content-based height, but when utilizing a footer, it's mandatory. This requirement is also outlined in our documentation:

React element which defines the footer content.

Note: To preserve the intended design, please use only non-content based height values (px, rem, vh, etc.) as height of the DynamicPage.

Here you can find an example including a fixed height: https://stackblitz.com/edit/github-xww5ig-7tabyh?file=src%2FApp.tsx