user-select:none on html element causes click to select all contenteditable text
Categories
(Core :: DOM: Selection, defect, P3)
Tracking
()
People
(Reporter: john_thomson, Unassigned)
Details
User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 Safari/537.36
Steps to reproduce:
See https://jsfiddle.net/john7540/h8123ay4/7/.
It involves a div with a fixed size so it is possible to click on the <html> element outside it. The div is contenteditable. Styles make everything (including the root <html> element) user-select:none, except that contenteditable elements are user-select: text.
In the resulting view, click outside the yellow box (the content-editable div). That is, the click should not hit anything except the root <html> element.
Work-around: add a special-case rule html {user-select: auto}
(Also experience in FF 45)
Actual results:
All the text in the contenteditable div appears to be selected (though it doesn't get focus).
(In more complex cases involving multiple contenteditable elements, all the text in ALL of them appears selected)
Expected results:
Nothing (Edge)
focus leaves the contenteditable div (Chrome)
both seem reasonable.
|
||
Comment 1•5 years ago
|
||
Bugbug thinks this bug should belong to this component, but please revert this change in case of error.
|
||
Updated•5 years ago
|
|
||
Updated•2 years ago
|
|
||
Comment 2•1 year ago
|
||
This issue is still there. For an even more distilled fiddle, see https://jsfiddle.net/bkLhz7fq/
Description
•