1618260 - Number input contents are chopped at some heights when native theming is disabled

Status: RESOLVED FIXED

(Core :: Widget, defect, P2)

Description

[Emilio Cobos Álvarez (:emilio)]

See attachment 9128303 [details] for a test-case that shows this.

Comment 1

[Stephen A Pohl [:spohl]]

At least on macOS it seems to me like this looks just as bad with the native theme enabled. The difference being that the contents overlap the input field instead of being chopped off. Is there a particular platform where this looks fine with the native theme enabled vs. disabled? And what should the fix be? Should we set a minimum size for the input field?

Comment 2

[Emilio Cobos Álvarez (:emilio)]

Linux enforces the minimum size of the <input>. Windows has just 1px padding, so the text is visible.

<input type=text> works, so I think this is actually an issue with overflow-clip-box: padding-box not working as we expect here. More of a layout issue I guess.

Comment 3

[Emilio Cobos Álvarez (:emilio)]

And that layout issue is kinda long-standing.

Comment 4

[Emilio Cobos Álvarez (:emilio)]

On Linux this is also reproducible by using: data:text/html,<input type=number value=100 style="height: 1em; padding: 10px">.

I think I know how to best fix this, we'll see.

Comment 5

[Emilio Cobos Álvarez (:emilio)]

Attachment: Bug 1618260 - Fix number input so that it honors overflow-clip-box-block. r=mats,dholbert

This never worked, but it's more visible with the new form controls which have
more padding.

Make the anonymous div and co a pseudo-element, so that it inherits from the
<input> properly and thus overflow-clip-box: inherit does what we want, at least
in the block direction (which is where it matters for compat).

Doing that in the inline direction is harder given the extra stuff in the
number input like the flex wrapper, so for now reset that padding to zero.

TODO:

• Tests

• Figuring out the inherit-overflow stuff.

Comment 6

[Emilio Cobos Álvarez (:emilio)]

The inherit-overflow stuff goes back to bug 42492... fun.

Comment 7

[Emilio Cobos Álvarez (:emilio)]

(Not sure it's needed anymore, but will check and land some tests if not)

Comment 8

[BugBot [:suhaib / :marco/ :calixte]]

The priority flag is not set for this bug.
:jimm, could you have a look please?

For more information, please visit auto_nag documentation.

Comment 9

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/31c1ad4ac9db
Fix number input so that it honors overflow-clip-box-block. r=mats

Comment 10

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/546c90bb0b04
Remove an unused whitelist item in browser_parsable_css.js.

Comment 11

[Daniel Varga [:dvarga]]

https://hg.mozilla.org/mozilla-central/rev/31c1ad4ac9db
https://hg.mozilla.org/mozilla-central/rev/546c90bb0b04