1637476 - No caret appears in an empty <input> if placeholder is defined

Status: RESOLVED FIXED

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

Description

[Maxim]

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

Steps to reproduce:

1. Open https://desk.bestr.no/welcome
2. Focus username input (for example mouse click)

Actual results:

There is not caret.

Expected results:

Caret should be there.

Comment 1

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

Bugbug thinks this bug should belong to this component, but please revert this change in case of error.

Comment 2

[Mats Palmgren (inactive)]

I can reproduce the bug but data:text/html,<input placeholder=Username> works fine so I suspect the root cause is something in the event handlers on that <input>. A minimal testcase would help understanding the problem.

Comment 3

[Alice0775 White]

Attachment: Bug 1637476 - No caret appears in an empty input if placeholder is defined.html

<style>
input::placeholder {
opacity: 1;
background: #fff;
}
</style>
<input type="text" placeholder="Username...">

Comment 4

[Mats Palmgren (inactive)]

Attachment: Screenshot with 'opacity:0.8'

Thanks for the testcase Alice!

This is what I'm seeing on Linux with 'opacity:0.8'. The problem seems to be that we render the frame for the ::placeholder on top of the frame for the value (which I presume paints the caret). Also, it appears the ::placeholder frame is too large since it affects the border.

I wonder if we could simply swap the order of those two child frames...

Comment 5

[Mats Palmgren (inactive)]

That seems to fix it...

Comment 6

[Mats Palmgren (inactive)]

Attachment: Bug 1637476 - Build the ::placeholder's DisplayLists first so that it doesn't obscure the caret. r=emilio

Comment 7

[Mats Palmgren (inactive)]

I spawned off bug 1637804 for the border issue.

Comment 8

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/55bb4c4449cd
Build the ::placeholder's DisplayLists first so that it doesn't obscure the caret.  r=emilio

Comment 9

[Pulsebot]

Backout by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/3ac5aa91c2ea
Backed out changeset 55bb4c4449cd as requested by dev CLOSED TREE

Comment 10

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/276021ad5a8a
Build the ::placeholder's DisplayLists first so that it doesn't obscure the caret.  r=emilio

Comment 11

[Natalia Csoregi [:nataliaCs]]

https://hg.mozilla.org/mozilla-central/rev/276021ad5a8a