| Summary: | list-style-position:inside causing a cursor positioning issue for contenteditable="true" | ||||||||
|---|---|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | John Flockton <j.r.flockton.work> | ||||||
| Component: | Layout and Rendering | Assignee: | Nobody <webkit-unassigned> | ||||||
| Status: | NEW --- | ||||||||
| Severity: | Minor | CC: | ahmad.saleem792, bfulgham, karlcow, megan_gardner, rniwa, simon.fraser, webkit-bug-importer, wenson_hsieh, zalan | ||||||
| Priority: | P2 | Keywords: | InRadar | ||||||
| Version: | WebKit Nightly Build | ||||||||
| Hardware: | Mac (Apple Silicon) | ||||||||
| OS: | macOS 13 | ||||||||
| URL: | https://jsfiddle.net/wvz698b4/show | ||||||||
| Attachments: |
|
||||||||
I am able to reproduce this bug in Safari 16.3 and WebKit ToT using Comment 0 test case. I changed it to JSFiddle and added link of it to URL field. Although I noted that all other browsers (Chrome Canary 112 and Firefox Nightly 111) also show caret before bullet point, so I think all browsers are matching each other and it might be not a bug as such. Created attachment 464919 [details]
test case
The test case as submitted in the description.
Yes confirmed that all browsers are behaving exactly the same here. As soon as we start typing the cursor is going where the text should begin. As such it is not a browsercompat issue at least |
Created attachment 464821 [details] Illustrative example 1. Open the below in a Safari browser: ``` <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>List style position bug</title> </head> <body> <div contenteditable="true"> <ul style="list-style-position: inside"> <li>First list item</li> <li></li> </ul> </div> </body> </html> ``` 2. Place your text cursor in the second bullet. 3. Notice that the cursor is incorrectly positioned before the bullet point.