adobe.com - Unable to scroll on the login page, the logo is not fully visible
Categories
(Web Compatibility :: Site Reports, defect, P3)
Tracking
(firefox129 affected, firefox131 affected)
People
(Reporter: ctanase, Unassigned)
References
(Depends on 1 open bug, )
Details
(Keywords: webcompat:platform-bug, webcompat:site-report)
User Story
platform:android impact:minor-visual configuration:general affects:all branch:release diagnosis-team:layout
Attachments
(3 files)
screenshot of testcase 1 in responsive design mode with 200x700 viewport (Firefox on left, Chrome on right)
Environment:
Operating system: OnePlus 6 A6000 (Android 11)
Firefox version: Nightly 131.0a1-20240820095153
Steps to reproduce:
- Go to https://www.adobe.com
- If prompted select the US website.
- Dismiss the cookie banner.
- Tap on the "Sign in" button.
- Try to scroll the page.
Expected Behavior:
Page can be scrolled.
Actual Behavior:
The page cannot be scrolled and the adobe logo is not fully visible.
Notes:
- Screen rec attached
- Reproducible regardless of the ETP status
- Reproducible on Firefox Release as well
- Not reproducible on Chrome
- Issue found during WebCompat team [Top100] websites testing
|
||
Updated•13 days ago
|
|
||
Comment 1•4 days ago
•
|
||
Thanks - I can reproduce the issue in latest Nightly. Let me restate the actual/expected results a bit -- comment 0's "page can be scrolled" expectation isn't quite the right formulation, since for me at least, there's not any content that actually overflows off the bottom of the viewport. The layout just ends up different in Chrome, such that things are more spaced out which happens to mean that scrolling is possible, depending on your viewport size.
Here's how I'd formulate actual/expected, for folks retesting/debugging this:
ACTUAL RESULTS:
- The Adobe "A" icon is pushed off the top of the viewport and clipped slightly.
- Depending on your phone size, "Get Help Signing In" might overlap with the copyright statement at the bottom. [EDIT: This part is covered by bug 1914395]
EXPECTED RESULTS:
- The Adobe "A" icon should be further from the top of the screen.
- "Get Help Signing In" should not overlap with the copyright statement. [EDIT: This part is covered by bug 1914395]
I've got a partially reduced testcase that I'll attach which captures this fairly well.
|
|
||
Comment 2•4 days ago
|
||
|
|
||
Updated•4 days ago
|
|
|
||
Comment 3•4 days ago
|
||
|
|
||
Comment 4•4 days ago
|
||
The borders that I added in the attached testcase give a hint about what's going on -- the cyan- and lime-bordered elements are shorter in Firefox as compared to Chrome (they're not expanding to fit the content), and the red-bordered descendant ends up overflowing off the top as a result of its ancestors not being tall enough to fit it. (It overflows off the top because its parent is a [shorter] vertical flex container with justify-content:center, so it dutifully centers itself and overflows equally off the top and bottom.)
I think this is probably a version of bug 1916849. Tentatively triaging as depending on that platform-bug.
|
|
||
Comment 5•4 days ago
|
||
(In reply to Daniel Holbert [:dholbert] from comment #4)
I think this is probably a version of bug 1916849. Tentatively triaging as depending on that platform-bug.
Actually, that makes a lot of sense, because I filed bug 1916849 about this same Adobe sign-in page, for related bug 1914395. :)
So platform bug 1916849 is causing an element to be smaller-than-expected on this page, which results in overflow (and hence clipped or overlapping content) in multiple places.
Description
•