Bug 201034
| Summary: | Emoji in placeholder text does not appear faded | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Jeffrey <jeffreyca16> |
| Component: | Text | Assignee: | Nobody <webkit-unassigned> |
| Status: | NEW | ||
| Severity: | Normal | CC: | ahmad.saleem792, mmaxfield, webkit-bug-importer |
| Priority: | P2 | Keywords: | InRadar |
| Version: | Safari 12 | ||
| Hardware: | Unspecified | ||
| OS: | Unspecified | ||
Jeffrey
(Copied from https://bugs.chromium.org/p/chromium/issues/detail?id=932026)
Demo URL: https://e.myconan.net/test-input-placeholder.html
What is the expected behavior?
Emoji in placeholder text should be faded out just like the rest of the text.
What went wrong?
Emoji in placeholder text is fully visible.
Reproducible on Safari 12.1.2 (14607.3.9).
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Jeffrey
The fix should be a matter of changing the 'color' property of the 'placeholder' element to use an RGBA opacity value (e.g. rgba(0, 0, 0, 0.54)) instead of darkGray in /Source/WebCore/css/html.css, and updating test cases.
Radar WebKit Bug Importer
<rdar://problem/54613515>
Myles C. Maxfield
Firefox fades the emoji, Chrome doesn't.
Ahmad Saleem
(In reply to Myles C. Maxfield from comment #3)
> Firefox fades the emoji, Chrome doesn't.
Chrome mark the bug mentioned in Comment 0 as "WONTFIX" but someone comment that it seems to be fixed on Chrome 88 using Windows Platform but testing on Chrome Canary 108 using macOS 12.6, I still get same behavior as you mentioned and "emoji" does not fade.
Safari 16, STP 154 and Chrome Canary 108 does not fade "emoji" while Firefox Nightly 107 does fade emoji.
Just wanted to share updated input. Thanks!
Ahmad Saleem
Does not have anything in UA stylesheet from standard:
https://drafts.csswg.org/css-pseudo-4/#highlight-ua-styles
but has following - UAs may apply additional effects to enhance the presentation of highlighted content, for example dimming content other than the highlighted text.
Firefox has following in UA Stylesheet:
https://searchfox.org/mozilla-central/source/layout/style/res/forms.css#179