1829761 - Floated input in a non-HTML relative-positioned element has broken user interaction on Firefox, but not Chrome/Safari

Status: NEW

(Core :: Web Painting, defect)

Description

[Thomas Wisniewski [:twisniewski]]

Attachment: testcase.html

In the attached test-case, it's possible to click on the input in Chrome, but not Firefox. Something about it being floated or in a non-standard relatively positioned element seems to cause Firefox to not recognize it as clickable.

Oddly, Safari also doesn't let me click the element in the test-case, but the web site which I reduced this test-case from isn't broken the same way in Safari as it is on Firefox (as reported on webcompat.com)

Comment 1

[Thomas Wisniewski [:twisniewski]]

Ah, I can click on the very bottom of the input, as I would expect (since the text isn't as tall). So somehow the div after it in the markup is breaking user-interaction where it covers the input, but the same doesn't happen on Chrome.

Comment 2

[Emilio Cobos Álvarez [:emilio]]

Attachment: testcase that shows more clearly what's going on

This is a paint order issue. I think we implement this usually better than chrome so this might be a chrome bug but I need to check https://drafts.csswg.org/css2/#painting-order carefully.