Bug 278455
| Summary: | Custom Highlighting API does not highlight when "user-select: none" is active | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Thomas <thomas.niedermaier> |
| Component: | CSS | Assignee: | Nobody <webkit-unassigned> |
| Status: | NEW | ||
| Severity: | Normal | CC: | alex, koivisto, megan_gardner, thomas.niedermaier, thorton, webkit-bug-importer |
| Priority: | P2 | Keywords: | InRadar |
| Version: | Safari 17 | ||
| Hardware: | Unspecified | ||
| OS: | Unspecified | ||
Thomas
Unlike other Browser Engines, Webkit doesn't apply the highlighting style to elements where "user-select: none" is active.
Reproduction Codepen: https://codepen.io/tho-masn/pen/poXLwoG
Steps to reproduce:
- Open the Codepen in Chromium Browsers => works
- Open the Codepen in Safari => doesn't work
- Remove the "user-select" properties from the CSS => now it works in Safari as well
It probably makes sense to apply the ::highlight styles also to elements where "user-select" is set to "none". Search highlighting should be independent of the user selection property.
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Radar WebKit Bug Importer
<rdar://problem/134841157>
alex
Firefox nightly 134.0a1 behaves similar to Chrome, and is correctly applying highlighting style with "user-select: none"
---
I ran into this bug with the Custom Highlighting API. In my app, I need to disable regular user text selection on certain components (due to them capturing gestures/drags), but I still want to allow search/highlight with Custom Highlighting API.