Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ui5-wizard: [Safari] scroll to not work when clicking next button when ui5-wizard in ui5-dialog #3064

Closed
GongRichard opened this issue Mar 31, 2021 · 2 comments · Fixed by #3068

Comments

@GongRichard
Copy link

Describe the bug
Scroll to not work when clicking next button for Cascade Goal dialog in Safari

To reproduce
Steps to reproduce the behavior:

  1. Use Safari browser on Mac to page https://github.wdf.sap.corp/pages/xweb/goalmanagementx/app.html?mock#/goal-list
  2. click the 'Skip Tour' button
  3. click the Cascade Goal button on the top right of the header
  4. select some goals and click the Next button
  5. it won't scroll to step 2
  6. scroll down and the wizard header won't be sticky on the top position

Expected behavior

  1. Should can scroll to the next step
  2. The wizard header should be sticky on the top position

Context

  • UI5 Web Components version: 0.29.11
  • OS/Platform: {Mac OS}
  • Browser (if relevant): {Safari}
  • Other information: {...}

Organization:
SF

Priority: (optional) (Low, Medium, High or Very High)
Very High (As we are on the last week of release sprint of SF B2011 release)

Business impact: (mandatory for "Very High")
Very High (As there are many safari end users, especially 50% for sap internal users)

@ilhan007
Copy link
Member

Hello @GongRichard

Confirmed, reproducible only if the Wizard is used inside a Dialog on Safari, the scrolling behavior does not work as expected

ilhan007 added a commit that referenced this issue Mar 31, 2021
On Safari the style that stretches the content flex: 1 1 auto is not working the same way as in the rest of the browsers. Two issues have been observed:
(1) One with the Wizard, the navigation header used to not remain at the top, but scrolled together with the content, which breaks the scrolling/navigation of the Wizard
(2) One of the Dialog itself - the header and the footer are not displayed correctly (see below), because of the content not stretched correctly. Adding "height: 100%", when the "stretched" property is set did fix the issues.

FIXES: #3064
ilhan007 added a commit that referenced this issue Mar 31, 2021
On Safari the style that stretches the content flex: 1 1 auto is not working the same way as in the rest of the browsers. Two issues have been observed:
(1) One with the Wizard, the navigation header used to not remain at the top, but scrolled together with the content, which breaks the scrolling/navigation of the Wizard
(2) One of the Dialog itself - the header and the footer are not displayed correctly (see below), because of the content not stretched correctly. Adding "height: 100%", when the "stretched" property is set did fix the issues.

FIXES: #3064
ilhan007 added a commit that referenced this issue Mar 31, 2021
On Safari the style that stretches the content flex: 1 1 auto is not working the same way as in the rest of the browsers. Two issues have been observed:
(1) One with the Wizard, the navigation header used to not remain at the top, but scrolled together with the content, which breaks the scrolling/navigation of the Wizard
(2) One of the Dialog itself - the header and the footer are not displayed correctly (see below), because of the content not stretched correctly. Adding "height: 100%", when the "stretched" property is set did fix the issues.

FIXES: #3064
@ilhan007
Copy link
Member

ilhan007 commented Apr 1, 2021

Hello @GongRichard the Wizard scrolling works fine on Safari inside a Dialog with version 0.29.13

@ilhan007 ilhan007 self-assigned this May 18, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants