RESOLVED INVALID 288517
Trailing and leading tab chars (\t) are trimmed on a div with contenteditable="plaintext-only"
https://bugs.webkit.org/show_bug.cgi?id=288517
Summary Trailing and leading tab chars (\t) are trimmed on a div with contenteditable...
Abdelhafidh Belalia
Reported 2025-02-25 13:03:01 PST
Created attachment 474350 [details] ScreenRecord reproducing the bug on Safari vs. Chrome Steps to reproduce: 1. Open repro https://codesandbox.io/p/sandbox/safari-trimmed-tabs-contenteditable-plaintextonly-jmfh7k 2. Click on "Set innerHTML to \tab\tc\t" button then on "Get innerHTML length" button 3. The innerHTML length should be 6 4. Click on "Set innerText to \tab\tc\t" button then on "Get innerText length" button 5. The innerText length should be 6 Actual results: On step 5, the reported lengh is 4 (first and last \t are trimmed). FWIW: This works on Chromium. I have attached a video comparison between Chrome and Safari
Attachments
ScreenRecord reproducing the bug on Safari vs. Chrome (4.37 MB, video/quicktime)
2025-02-25 13:03 PST, Abdelhafidh Belalia
no flags
rendering in safari, firefox, chrome (1.39 MB, image/png)
2025-02-25 21:04 PST, Karl Dubost
no flags
Karl Dubost
Comment 1 2025-02-25 21:04:44 PST
Created attachment 474354 [details] rendering in safari, firefox, chrome Thanks for the report, Abdelhafidh. I do not see relevant tests to innerText and InnerHTML in https://wpt.fyi/results/html/dom/elements/the-innertext-and-outertext-properties/innertext-whitespace-pre-line.html?label=master&label=experimental&aligned&q=innertext https://wpt.fyi/results/html/dom/elements/the-innertext-and-outertext-properties/getter.html?label=master&label=experimental&aligned&q=innertext So the result is different in Chrome only. The layout in chrome is also different. Firefox and Safari returns the same results. https://codepen.io/webcompat/pen/zxYKeZx chrome returns 6 firefox/safari returns 5 This is to investigate and look at what the spec is saying.
Karl Dubost
Comment 2 2025-02-25 22:08:57 PST
We can also with "\t" the length is 1 in Chrome and 0 in Safari and Firefox
Abdelhafidh Belalia
Comment 3 2025-02-26 08:35:05 PST
Thanks for checking Karl. I have reported the same on Firefox https://bugzilla.mozilla.org/show_bug.cgi?id=1950671. I don't see why tab characters are trimmed in such cases. It could be a bug on Chromium but on Chromium the results make more sense and align with my expectations at least. It's worth noting that this behaviour is only when contenteditable="plaintext-only" if we use other value e.g. "true" then the tabs are trimmed
Karl Dubost
Comment 4 2025-02-27 17:30:48 PST
So about my comment on what the spec is saying: Masayuki Nakano replied correctly Chrome has a bug. https://bugzilla.mozilla.org/show_bug.cgi?id=1950671#c3 https://html.spec.whatwg.org/multipage/dom.html#the-innertext-idl-attribute > 4. If node is a Text node, then for each CSS text box produced by node, in content order, compute the text of the box after application of the CSS 'white-space' processing rules and 'text-transform' rules, set items to the list of the resulting strings, and return items. The CSS 'white-space' processing rules are slightly modified: collapsible spaces at the end of lines are always collapsed, but they are only removed if the line is the last line of the block, or it ends with a br element. Soft hyphens should be preserved. Probably there is a need for a WPT covering this case.
Karl Dubost
Comment 5 2025-02-27 19:40:11 PST
Resolving as INVALID as this is a chrome bug. Masayuki Nakano will create WPT test cases for it. see https://bugzilla.mozilla.org/show_bug.cgi?id=1951027
Masayuki Nakano
Comment 6 2025-05-01 18:49:00 PDT
FYI: I filed a Chromium issue about removing the `white-space` style hack: https://issues.chromium.org/issues/413427424 And I'm requesting putting additional information to MDN: https://github.com/mdn/content/issues/39347
Note You need to log in before you can comment on or make changes to this bug.