Bug 1731541 - Add CSS property text-wrap: auto | stable | balance. r=devtools-reviewers,emilio

Just the CSS property; not hooked up to any rendering behavior yet.

Currently this is implemented as a simple longhand `text-wrap` property,
but we'll want to rename it to `text-wrap-style` when we update white-space
to be a shorthand and introduce white-space-collapse, text-wrap-mode, etc.

The 'pretty' value is omitted as we have no immediate plans to implement it.
Initially, 'auto' and 'stable' will behave identically, although 'auto' could
change in future once we have higher-quality algorithms available.

Differential Revision: https://phabricator.services.mozilla.com/D187543

devtools/server/actors/animation-type-longhand.js

@@ -174,6 +174,7 @@ exports.ANIMATION_TYPE_FOR_LONGHANDS = [
       "-webkit-text-stroke-width",
       "text-transform",
       "text-underline-position",
+      "text-wrap",
       "touch-action",
       "transform-box",
       "transform-style",

layout/style/ServoBindings.toml

@@ -175,6 +175,7 @@ rusty-enums = [
     "mozilla::StyleBlend",
     "mozilla::StyleMaskComposite",
     "mozilla::StyleWritingModeProperty",
+    "mozilla::StyleTextWrap",
     "StyleFontVariantEmoji",
 ]
 allowlist-vars = [

layout/style/nsStyleConsts.h

@@ -414,6 +414,17 @@ enum class StyleWhiteSpace : uint8_t {
   BreakSpaces,
 };
 
+// See nsStyleText
+// TODO: this will become StyleTextWrapStyle when we turn text-wrap
+// (see https://bugzilla.mozilla.org/show_bug.cgi?id=1758391) and
+// white-space (https://bugzilla.mozilla.org/show_bug.cgi?id=1852478)
+// into shorthands.
+enum class StyleTextWrap : uint8_t {
+  Auto = 0,
+  Stable,
+  Balance,
+};
+
 // ruby-align, see nsStyleText
 enum class StyleRubyAlign : uint8_t {
   Start,

layout/style/nsStyleStruct.cpp

@@ -2895,7 +2895,8 @@ nsStyleText::nsStyleText(const nsStyleText& aSource)
       mTextShadow(aSource.mTextShadow),
       mTextEmphasisStyle(aSource.mTextEmphasisStyle),
       mHyphenateCharacter(aSource.mHyphenateCharacter),
-      mWebkitTextSecurity(aSource.mWebkitTextSecurity) {
+      mWebkitTextSecurity(aSource.mWebkitTextSecurity),
+      mTextWrap(aSource.mTextWrap) {
   MOZ_COUNT_CTOR(nsStyleText);
 }
 
@@ -2928,7 +2929,8 @@ nsChangeHint nsStyleText::CalcDifference(const nsStyleText& aNewData) const {
       (mWordSpacing != aNewData.mWordSpacing) ||
       (mTabSize != aNewData.mTabSize) ||
       (mHyphenateCharacter != aNewData.mHyphenateCharacter) ||
-      (mWebkitTextSecurity != aNewData.mWebkitTextSecurity)) {
+      (mWebkitTextSecurity != aNewData.mWebkitTextSecurity) ||
+      (mTextWrap != aNewData.mTextWrap)) {
     return NS_STYLE_HINT_REFLOW;
   }
 

layout/style/nsStyleStruct.h

@@ -889,6 +889,8 @@ struct MOZ_NEEDS_MEMMOVABLE_MEMBERS nsStyleText {
   mozilla::StyleTextSecurity mWebkitTextSecurity =
       mozilla::StyleTextSecurity::None;
 
+  mozilla::StyleTextWrap mTextWrap = mozilla::StyleTextWrap::Auto;
+
   char16_t TextSecurityMaskChar() const {
     switch (mWebkitTextSecurity) {
       case mozilla::StyleTextSecurity::None:

layout/style/test/property_database.js

@@ -8561,6 +8561,17 @@ var gCSSProperties = {
     ],
     invalid_values: [],
   },
+  "text-wrap": {
+    domProp: "textWrap",
+    inherited: true,
+    type: CSS_TYPE_LONGHAND,
+    applies_to_placeholder: true,
+    applies_to_cue: true,
+    applies_to_marker: true,
+    initial_values: ["auto"],
+    other_values: ["stable", "balance"],
+    invalid_values: ["wrap", "nowrap", "normal"],
+  },
   width: {
     domProp: "width",
     inherited: false,

modules/libpref/init/StaticPrefList.yaml

@@ -8772,6 +8772,11 @@
   value: false
   mirror: always
 
+- name: layout.css.text-wrap-balance.enabled
+  type: bool
+  value: @IS_NIGHTLY_BUILD@
+  mirror: always
+
 # Support for the css Zoom property.
 - name: layout.css.zoom.enabled
   type: RelaxedAtomicBool

servo/components/style/properties/data.py

@@ -806,6 +806,7 @@ def _remove_common_first_line_and_first_letter_properties(props, engine):
     props.remove("text-align")
     props.remove("text-justify")
     props.remove("white-space")
+    props.remove("text-wrap")
     props.remove("word-break")
     props.remove("text-indent")
 
@@ -908,6 +909,7 @@ class PropertyRestrictions:
         props = PropertyRestrictions.first_line(data)
         props.add("opacity")
         props.add("white-space")
+        props.add("text-wrap")
         props.add("text-overflow")
         props.add("text-align")
         props.add("text-justify")
@@ -919,6 +921,7 @@ class PropertyRestrictions:
         return set(
             [
                 "white-space",
+                "text-wrap",
                 "color",
                 "text-combine-upright",
                 "text-transform",
@@ -943,6 +946,7 @@ class PropertyRestrictions:
                 "visibility",
                 "text-shadow",
                 "white-space",
+                "text-wrap",
                 "text-combine-upright",
                 "ruby-position",
                 # XXX Should these really apply to cue?

servo/components/style/properties/longhands/inherited_text.mako.rs

@@ -427,3 +427,15 @@ ${helpers.single_keyword(
     spec="https://drafts.csswg.org/css-text/#MISSING",
     affects="layout",
 )}
+
+${helpers.single_keyword(
+    "text-wrap",
+    "auto stable balance",
+    engines="gecko",
+    gecko_pref="layout.css.text-wrap-balance.enabled",
+    has_effect_on_gecko_scrollbars=False,
+    gecko_enum_prefix="StyleTextWrap",
+    animation_value_type="discrete",
+    spec="https://drafts.csswg.org/css-text-4/#text-wrap",
+    affects="layout",
+)}