1512120 - Some overflow-x/y values cause unpredictable behaviour on <select> elements

Status: NEW

(Core :: Layout: Form Controls, defect, P3)

Description

[chris]

Attachment: test.html

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.14; rv:65.0) Gecko/20100101 Firefox/65.0

Steps to reproduce:

Consider the following HTML (or use attached file):

<style>
    select
    {
        overflow-x: hidden;
    }
</style>
<select multiple size="7">
	<option value="1">11111111111111111111111</option>
	<option value="2">22222222222222222222222</option>
	<option value="3">33333333333333333333333</option>
	<option value="4">44444444444444444444444</option>
	<option value="5">55555555555555555555555</option>
	<option value="6">66666666666666666666666</option>
	<option value="7">77777777777777777777777</option>
	<option value="8">88888888888888888888888</option>
	<option value="9">99999999999999999999999</option>
	<option value="10">1000000000000000000000</option>
</select>

When Firefox renders this, the <select> element is not scrollable *vertically* as you would expect.

If you modify the CSS rule in the inspector to be:

overflow-x: auto;

The y direction is scrollable again.

In the inspector, set it back to its original value:

overflow-x: hidden;

It remains scrollable vertically even though it wasn't when the page was loaded.

This occurs on macOS, at least, and exists in Firefox 63 through 65 at minimum.


Actual results:

The <select> element is no longer vertically scrollable.


Expected results:

The <select> element should be vertically scrollable.

Comment 1

[ovidiu boca[:Ovidiu]]

I tested this on Mac OS X 10.14 with FF Nightly 65.0a1(2018-12-09) and I can reproduce the issue, the element is not scrollable. The CSS rule in the inspector is overflow-x: auto; it doesn't need to be set.

Comment 2

[Emilio Cobos Álvarez (:emilio)]

So this is specific to <select>, thus moving to form controls.

We have this rule we rely on for this case:

  https://searchfox.org/mozilla-central/rev/fd62b95c187a40b328d9e7fd9d848833a6942b57/layout/style/res/forms.css#238

Setting overflow-x to hidden causes the computed value of both overflow-{x,y} to be hidden:

  https://searchfox.org/mozilla-central/rev/fd62b95c187a40b328d9e7fd9d848833a6942b57/servo/components/style/style_adjuster.rs#434

If you override it some code seems to get confused (I haven't debugged which code yet though) and prevents async-scrolling from working on the <select>, though note that on Linux we still show the scrollbars and what not, and you can still scroll it.

We could turn that overflow rule to be !important to match reality, but it's unclear here what the setup is. Note that we ignore -moz-hidden-unscrollable for list controls in:

  https://searchfox.org/mozilla-central/rev/fd62b95c187a40b328d9e7fd9d848833a6942b57/layout/generic/nsFrame.h#592

Markus, David, do you know more about the setup here? Seems somewhat convoluted.

Comment 3

[Botond Ballo [:botond]]

I debugged this (before seeing Emilio's comment) far enough to see that the style system is reporting overflow-x:auto (??) and overflow-y:hidden here [1]. As far as I can tell, the scrolling / APZ code from then on is just doing what it's told (not scrolling in the y direction because of the hidden, and not scrolling in the x direction because there is no scroll range).

[1] https://searchfox.org/mozilla-central/rev/fd62b95c187a40b328d9e7fd9d848833a6942b57/layout/generic/nsGfxScrollFrame.cpp#3904

Comment 4

[Emilio Cobos Álvarez (:emilio)]

So yeah, overflow-y is hidden because of that -moz-hidden-unscrollable rule mixed with:

  https://searchfox.org/mozilla-central/rev/fd62b95c187a40b328d9e7fd9d848833a6942b57/servo/components/style/style_adjuster.rs#431

So this means that this comment does not really hold:

  https://searchfox.org/mozilla-central/rev/fd62b95c187a40b328d9e7fd9d848833a6942b57/layout/base/ScrollStyles.h#21

Since you can get there with any overflow value for listboxes (the nsListControlFrame inherits from nsHTMLScrollFrame).

We get there with -moz-hidden-unscrollable by default, which is already breaking that comment, and we get there with whaterver the author specified if overriden.

Comment 5

[Emilio Cobos Álvarez (:emilio)]

I'm not sure what is the expected behavior here... You cannot make the listbox unscrollable even with overflow: hidden here on Linux, we unconditionally show the scrollbars...

Comment 6

[Markus Stange [:mstange]]

(In reply to Emilio Cobos Álvarez (:emilio) from comment #2)

Markus, David, do you know more about the setup here? Seems somewhat
convoluted.

I don't, sorry.