Intent to Implement and Ship: overflow-wrap: anywhere

Javier Fernandez

unread,

Oct 2, 2019, 12:12:39 PM10/2/19

to blin...@chromium.org

Contact emails
jfern...@igalia.com

Explainer
https://github.com/w3c/csswg-drafts/issues/2682

Design docs/spec
Specification: https://drafts.csswg.org/css-text-3/

https://drafts.csswg.org/css-text-3/#valdef-overflow-wrap-anywhere

TAG review
This is a minor change to ensure interoperability, widely discussed inside the CSS WG and with a considerable consensus about the final agreement.

Summary
The new value 'anywhere' allows that an otherwise unbreakable sequence of characters may be broken at an arbitrary point if there are no otherwise-acceptable break points in the line.

Additionally, soft wrap opportunities introduced by anywhere are considered when calculating min-content intrinsic sizes.

Motivation
This feature address a long standing web compatibility issue related to the 'word-break: break-word' feature.

The CSS Text 3 spec still allows the 'break-word' value to ensure compatibility (Safari and Chrome support it), but its marked as deprecated; that's why Firefox doesn't implement it.

The 'word-break: break-word' feature provides a behavior that web authors really appreciate, which consist on breaking opportunities account for the min-content size.

Several approaches have been explored, but all of them lead to serious web compatibility issues, so that the CSS WG resolved that a new CSS value should be the best solution.

Risks
   Interoperability and Compatibility

    Low interoperability risk
    Firefox has already shipped the feature and I'll implement it in both, Chrome and Safari.

    Low compatibility risk
    This feature consists on a new value, which is unlikely breaking any web content. AS a matter of fact, the main     goal of the feature is to solve compatibility issues.

    Firefox: Shipped (https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/65#CSS)
    The overflow-wrap property's anywhere value has been implemented (bug 1505786).

    Edge: No public signals

    Safari: No public signals

    Web developers: Positive (https://webplatform.news/issues/2019-04-01)
    https://twitter.com/jensimmons/status/1100567739234570240

    Ergonomics
    This features doesn't depend on any API.

    Activation
    The activation of the feature is pretty straight forward, just declaring a valid CSS rule.

    Security
    No security risks.

    Debuggability
    The feature is exposed and handled by the web inspector without needing additional dev tools.

Will this feature be supported on all six Blink platforms (Windows, Mac, Linux, Chrome OS, Android, and Android WebView)?
Yes
This feature is not platform dependent.

Is this feature fully tested by web-platform-tests?
Yes
https://wpt.fyi/results/css/css-text/overflow-wrap?label=experimental&label=master&aligned

Tracking bug
https://bugs.chromium.org/p/chromium/issues/detail?id=905315

Demo links
https://developer.mozilla.org/en-US/docs/Web/CSS/overflow-wrap
https://www.cjcid.com/articles/wrapping-long-words-css-html/

Link to entry on the Chrome Platform Status
https://www.chromestatus.com/feature/5126089347170304

Requesting approval to ship
Yes

Daniel Bratell

unread,

Oct 2, 2019, 12:41:48 PM10/2/19

to Javier Fernandez, blin...@chromium.org

LGTM1

/Daniel

--
You received this message because you are subscribed to the Google Groups "blink-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blink-dev+...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/fb375d97-2c0d-eecd-c62c-2407679498ee%40igalia.com.

Chris Harrelson

unread,

Oct 2, 2019, 12:46:32 PM10/2/19

to Daniel Bratell, Javier Fernandez, blink-dev

LGTM2

To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/68f12fb5-85cc-a2be-d4a7-370566f4ff8b%40gmail.com.

TAMURA, Kent

unread,

Oct 3, 2019, 4:06:16 AM10/3/19

to Chris Harrelson, Daniel Bratell, Javier Fernandez, blink-dev

LGTM3.

> Firefox has already shipped the feature and I'll implement it in both, Chrome and Safari.

That's great!

To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAOMQ%2Bw-%2BVKyqAeXN6nAqLsFGyv9gdBxu2Nwvno1S26youCCvMw%40mail.gmail.com.