Bug 195345
Summary: | Implement "overflow-wrap: anywhere" | ||
---|---|---|---|
Product: | WebKit | Reporter: | Javier Fernandez <jfernandez> |
Component: | Text | Assignee: | Nobody <webkit-unassigned> |
Status: | RESOLVED DUPLICATE | ||
Severity: | Normal | CC: | ahmad.saleem792, chatoo2412, cyb.ai.815, dregad, fantasai.bugs, florian, jfernandez, karlcow, mmaxfield, nanto, sam, timdream, webkit-bug-importer |
Priority: | P2 | Keywords: | InRadar |
Version: | WebKit Nightly Build | ||
Hardware: | Unspecified | ||
OS: | Unspecified | ||
See Also: |
https://bugs.chromium.org/p/chromium/issues/detail?id=905315 https://bugzilla.mozilla.org/show_bug.cgi?id=1505786 https://bugs.webkit.org/show_bug.cgi?id=227695 https://bugs.webkit.org/show_bug.cgi?id=229347 |
||
Bug Depends on: | |||
Bug Blocks: | 83934 |
Javier Fernandez
The CSS WG has resolved [1] add a deprecated note to prevent the usage of 'overflow-wrap: break-word' in favor of 'overflow-wrap: anywhere'.
The new value is described as follows:
https://www.w3.org/TR/css-text-3/#valdef-overflow-wrap-anywhere
[1] https://github.com/w3c/csswg-drafts/issues/2390
Attachments | ||
---|---|---|
Add attachment proposed patch, testcase, etc. |
Javier Fernandez
Firefox already shipped this feature
- https://bugzilla.mozilla.org/show_bug.cgi?id=1505786
Chrome plans to implement this feature
- https://bugs.chromium.org/p/chromium/issues/detail?id=905315
Javier Fernandez
I have sent the "intent to implement" request for Blink. Showing some public support in this bug would help to get the request approved.
Myles C. Maxfield
Implementing this is a good idea. (You can consider this "public support.")
We already implement (the deprecated) word-break:break-word, which is defined[1] to "have the same effect as word-break: normal and overflow-wrap: anywhere." Therefore, implementing this should be fairly straightforward.
From looking at WebKit source code (RenderStyle::breakWords()), it appears that word-break:break-word is currently treated identically to overflow-wrap:break-word, which I think is incorrect according to the spec text quoted above. It would be cool if this project fixed this, too (though, of course, fixing this could be tracked in a separate bug).
[1] https://www.w3.org/TR/css-text-3/#word-break-property
Florian Rivoal
@Myles, The wrapping behavior of word-break:break-word / overflow-wrap: anywhere is the same as that of overflow-wrap:break-word, but the effect on intrinsic sizing is different. A quick bit of testing shows that safari has the expected sizing behavior difference between word-break:break-word and overflow-wrap:break-word.
To test, you can try this:
<section style=width:0>
<div style=float:left>longword</div>
</section>
If you put overflow-wrap:break-word on the div, the longword will not wrap, but if you put word-break:break-word instead, it will.
Radar WebKit Bug Importer
<rdar://problem/77791159>
dregad
It would be really nice to see this implemented so it can be used across the board - other major browsers support this since 2019 (Firefox) / 2020 (Chrome, Edge).
https://caniuse.com/mdn-css_properties_overflow-wrap_anywhere
Cheers
nanto_vi (TOYAMA Nao)
This bug seems to be fixed.
https://github.com/mdn/browser-compat-data/issues/17012
Ahmad Saleem
I think this is implemented and we pass 'WPT' tests as well: https://wpt.fyi/results/css/css-text/overflow-wrap?label=master&label=experimental&aligned=&q=overflow-wrap-anywhere
Do we need anything more here?
Frances Cornwall
`overflow-wrap: anywhere` is implemented, and `overflow-wra: break-word` is still supported.
Karl Dubost
This was resolved by Bug 227695
https://searchfox.org/wubkat/commit/6ed0b8b3e00e59aa24ef24296de726e2f4dc4b8b
Karl Dubost
*** This bug has been marked as a duplicate of bug 227695 ***