1991290 - wrong mask on text for <input type="text" /> with border-radius

Status: RESOLVED FIXED

(Core :: Layout: Form Controls, defect)

Description

[Dasch]

Attachment: Firefox text cut off

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:143.0) Gecko/20100101 Firefox/143.0

Steps to reproduce:

Demo

Adding:

border-radius: 20px;
padding-left: 5px;"

to an input type="text" or input type="search" creates a mask that should prevent the selection and text from leaving the element.

Actual results:

This mask does not align with the actual element. It cuts off the text highlighter and text in the wrong place. See the screenshot or demo.

Expected results:

It should look like the other screenshot of Chrome. The text and highlighter should only be cut off at the edge of the element.

Comment 1

[Dasch]

Attachment: Firefox text-highlighter cut off

Comment 2

[Dasch]

Attachment: Chrome

Sorry if this is a duplicate report. I couldn't find anything, and Bugzilla is still quite confusing to me, especially adding images.

Comment 3

[Alice0775 White]

I can reproduce the issue on Nightly145.0a1 Windows11.

Regression window:
https://hg-edge.mozilla.org/integration/autoland/pushloghtml?fromchange=d476b321db898ab16351baeaabf2cc1bed447c68&tochange=6a14f603289807a62753cc8ceaa35d9ba09cbf61

Comment 4

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

Set release status flags based on info from the regressing bug 1800077

:emilio, since you are the author of the regressor, bug 1800077, could you take a look? Also, could you set the severity field?

For more information, please visit BugBot documentation.

Comment 5

[Emilio Cobos Álvarez [:emilio]]

I can repro, thanks. Minimal test-case is data:text/html,<input type="search" value="Text" style="border-radius: 20px; border: 1px solid; padding-left: 5px">.

FWIW, if I add overflow: clip to the test-case, regression goes all the way back to the implementation of overflow: clip in bug 1531609.

Comment 6

[Emilio Cobos Álvarez [:emilio]]

Attachment: Bug 1991290 - Apply overflow-clip-box to input's scroll containers explicitly. r=tnikkel,#layout

As per other discussions we don't really want to expose this property to
authors, so there's no benefit in letting them override it.

This property's content-box value doesn't play nice with border-radius
(well, it does deal with it correctly, but it doesn't do what we want it
to do).

Comment 7

[Emilio Cobos Álvarez [:emilio]]

Attachment: Bug 1991290 - Remove some overflow-clip-box handling that can't happen anymore. r=tnikkel,#layout

We don't want to apply these to things that aren't scroll containers.

Comment 8

[Emilio Cobos Álvarez [:emilio]]

Attachment: Bug 1991290 - Remove some other overflow-clip-box: inherit usage that we don't care about. r=tnikkel,#layout

Comment 9

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/cd19247c7cf1
https://hg.mozilla.org/integration/autoland/rev/40b52f6713d0
Remove a test that still fails on Windows.

Comment 10

[Pulsebot]

Pushed by [e-mail]:
https://github.com/mozilla-firefox/firefox/commit/3a1387c8bd06
https://hg.mozilla.org/integration/autoland/rev/55ced7623635
Apply overflow-clip-box to input's scroll containers explicitly. r=tnikkel,layout-reviewers
https://github.com/mozilla-firefox/firefox/commit/2fd167cd791b
https://hg.mozilla.org/integration/autoland/rev/ce0a1257b748
Remove some overflow-clip-box handling that can't happen anymore. r=tnikkel,layout-reviewers
https://github.com/mozilla-firefox/firefox/commit/8009b1d53041
https://hg.mozilla.org/integration/autoland/rev/43a54a38cf83
Remove some other overflow-clip-box: inherit usage that we don't care about. r=tnikkel,layout-reviewers

Comment 11

[Narcis Beleuzu [:NarcisB]]

https://hg.mozilla.org/mozilla-central/rev/40b52f6713d0
https://hg.mozilla.org/mozilla-central/rev/55ced7623635
https://hg.mozilla.org/mozilla-central/rev/ce0a1257b748
https://hg.mozilla.org/mozilla-central/rev/43a54a38cf83

Comment 12

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

The patch landed in nightly and beta is affected.
:emilio, is this bug important enough to require an uplift?

• If yes, please nominate the patch for beta approval.
  • See https://wiki.mozilla.org/Release_Management/Requesting_an_Uplift for documentation on how to request an uplift.
• If no, please set status-firefox144 to wontfix.

For more information, please visit BugBot documentation.

Comment 13

[Emilio Cobos Álvarez [:emilio]]

Very long-standing regression, can probably ride the trains.