Some custom dropdown UI widgets stay fixed and don't move with scroll

RESOLVED FIXED

Status

()

P3
normal
RESOLVED FIXED
10 months ago
7 months ago

People

(Reporter: janx, Assigned: kohei)

Tracking

({regression})

Production
regression

Details

Attachments

(2 attachments)

(Reporter)

Description

10 months ago
Created attachment 8965692 [details]
detached-widget.png

STR:
1. Visit https://bugzilla.mozilla.org/enter_bug.cgi in Firefox Nightly (I use 61.0a1 build 20180402111808 on Windows 10 on a touch-enabled Dell XPS 13)
2. Searching for a component (e.g. "widget"), a native suggestions list widget appears under the input field
3. Try scrolling down with the suggestions list still visible

Expected result:
- The suggestions list should remain anchored to the page, right under the input field

Actual result:
- The suggestions list stays fixed on screen regardless how much you scroll

See attached screenshot.

When moving the focus in and out of the window, the widget seems to snap back under the input field.
This isn't a native autocomplete widget, it's just a position:absolute element on the page.  But it is a bug that it's not scrolling with the rest of the page.
Component: Layout: Form Controls → Layout: R & A Pos
Priority: -- → P3
Is it? I think it's not. This is a BMO bug if anything, positioning here shouldn't be affected by scroll, it's a child of the <body>.
Since it's position:absolute it should scroll up as you scroll the page, right?
Ah, I didn't realize there are two scrollable things.  The <body> and the #bugzilla-body.  So you're right, this is just a BMO bug.
Assignee: nobody → ui
Component: Layout: R & A Pos → User Interface
Product: Core → Bugzilla
QA Contact: default-qa
Version: 47 Branch → unspecified
Assignee: ui → nobody
Component: User Interface → Extensions: BMO
Product: Bugzilla → bugzilla.mozilla.org
QA Contact: default-qa
Version: unspecified → Production
Duplicate of this bug: 1458478
Component: Extensions: BMO → User Interface
I think “native” is a wrong term here. It’s an custom element.
Summary: Some native UI widgets stay fixed and don't move with scroll → Some custom dropdown UI widgets stay fixed and don't move with scroll
Created attachment 8987303 [details] [review]
pull request

We might want to eventually replace the jQuery plug-in with an accessible alternative, but this PR fixes the current issue due to the fixed global header.
Assignee: nobody → kohei.yoshino
Status: NEW → ASSIGNED
Blocks: 1426685
Keywords: regression
Merged to master.
Status: ASSIGNED → RESOLVED
Last Resolved: 7 months ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.