Bug 1555150: adding support for CSS text underline offset to the style system r=emilio
authorCharlie Marlow <cmarlow@mozilla.com>
Tue, 04 Jun 2019 22:04:14 +0000
changeset 476903 b26eb4a5540b3bf21b0e0eb91e975cb69c4462b1
parent 476902 5aba36b1ed1523c0c21d148b349cb894eda5b15e
child 476904 ccd1356fc8f1d0bfa9d896e88d3cc924425623da
push id36110
push usermalexandru@mozilla.com
push dateWed, 05 Jun 2019 09:49:10 +0000
treeherdermozilla-central@31cec3975dd0 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersemilio
bugs1555150
milestone69.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1555150: adding support for CSS text underline offset to the style system r=emilio support for from-font listed in the CSS spec will be implemented in a later bug Differential Revision: https://phabricator.services.mozilla.com/D33233
devtools/server/actors/animation-type-longhand.js
devtools/shared/css/generated/properties-db.js
layout/style/nsStyleStruct.cpp
layout/style/nsStyleStruct.h
layout/style/test/mochitest.ini
layout/style/test/property_database.js
layout/style/test/test_transitions_per_property.html
modules/libpref/init/StaticPrefList.h
servo/components/style/properties/longhands/inherited_text.mako.rs
--- a/devtools/server/actors/animation-type-longhand.js
+++ b/devtools/server/actors/animation-type-longhand.js
@@ -337,16 +337,17 @@ exports.ANIMATION_TYPE_FOR_LONGHANDS = [
     "scroll-margin-right",
     "scroll-margin-bottom",
     "scroll-margin-left",
     "shape-margin",
     "stroke-dashoffset",
     "stroke-width",
     "-moz-tab-size",
     "text-indent",
+    "text-underline-offset",
     "top",
     "vertical-align",
     "width",
     "word-spacing",
     "x",
     "y",
     "z-index",
   ])],
--- a/devtools/shared/css/generated/properties-db.js
+++ b/devtools/shared/css/generated/properties-db.js
@@ -3177,16 +3177,17 @@ exports.CSS_PROPERTIES = {
       "-webkit-text-fill-color",
       "-webkit-text-stroke-color",
       "-webkit-text-stroke-width",
       "ruby-align",
       "ruby-position",
       "text-combine-upright",
       "text-rendering",
       "-moz-control-character-visibility",
+      "text-underline-offset",
       "cursor",
       "pointer-events",
       "-moz-user-input",
       "-moz-user-modify",
       "-moz-user-focus",
       "caret-color",
       "scrollbar-color",
       "text-anchor",
@@ -10727,16 +10728,20 @@ exports.PREFERENCES = [
     "scale",
     "layout.css.individual-transform.enabled"
   ],
   [
     "scrollbar-color",
     "layout.css.scrollbar-color.enabled"
   ],
   [
+    "text-underline-offset",
+    "layout.css.text-underline-offset.enabled"
+  ],
+  [
     "translate",
     "layout.css.individual-transform.enabled"
   ],
   [
     "-moz-binding",
     "layout.css.moz-binding.content.enabled"
   ],
   [
--- a/layout/style/nsStyleStruct.cpp
+++ b/layout/style/nsStyleStruct.cpp
@@ -3553,16 +3553,17 @@ nsStyleText::nsStyleText(const Document&
       mWebkitTextFillColor(StyleColor::CurrentColor()),
       mWebkitTextStrokeColor(StyleColor::CurrentColor()),
       mMozTabSize(
           StyleNonNegativeLengthOrNumber::Number(NS_STYLE_TABSIZE_INITIAL)),
       mWordSpacing(LengthPercentage::Zero()),
       mLetterSpacing({0.}),
       mLineHeight(StyleLineHeight::Normal()),
       mTextIndent(LengthPercentage::Zero()),
+      mTextUnderlineOffset(LengthOrAuto::Auto()),
       mWebkitTextStrokeWidth(0) {
   MOZ_COUNT_CTOR(nsStyleText);
   RefPtr<nsAtom> language = aDocument.GetContentLanguageAsAtomForStyle();
   mTextEmphasisPosition =
       language && nsStyleUtil::MatchesLanguagePrefix(language, u"zh")
           ? NS_STYLE_TEXT_EMPHASIS_POSITION_DEFAULT_ZH
           : NS_STYLE_TEXT_EMPHASIS_POSITION_DEFAULT;
 }
@@ -3589,16 +3590,17 @@ nsStyleText::nsStyleText(const nsStyleTe
       mTextEmphasisColor(aSource.mTextEmphasisColor),
       mWebkitTextFillColor(aSource.mWebkitTextFillColor),
       mWebkitTextStrokeColor(aSource.mWebkitTextStrokeColor),
       mMozTabSize(aSource.mMozTabSize),
       mWordSpacing(aSource.mWordSpacing),
       mLetterSpacing(aSource.mLetterSpacing),
       mLineHeight(aSource.mLineHeight),
       mTextIndent(aSource.mTextIndent),
+      mTextUnderlineOffset(aSource.mTextUnderlineOffset),
       mWebkitTextStrokeWidth(aSource.mWebkitTextStrokeWidth),
       mTextShadow(aSource.mTextShadow),
       mTextEmphasisStyleString(aSource.mTextEmphasisStyleString) {
   MOZ_COUNT_CTOR(nsStyleText);
 }
 
 nsStyleText::~nsStyleText() { MOZ_COUNT_DTOR(nsStyleText); }
 
@@ -3622,16 +3624,17 @@ nsChangeHint nsStyleText::CalcDifference
       (mWordBreak != aNewData.mWordBreak) ||
       (mOverflowWrap != aNewData.mOverflowWrap) ||
       (mHyphens != aNewData.mHyphens) || (mRubyAlign != aNewData.mRubyAlign) ||
       (mRubyPosition != aNewData.mRubyPosition) ||
       (mTextSizeAdjust != aNewData.mTextSizeAdjust) ||
       (mLetterSpacing != aNewData.mLetterSpacing) ||
       (mLineHeight != aNewData.mLineHeight) ||
       (mTextIndent != aNewData.mTextIndent) ||
+      (mTextUnderlineOffset != aNewData.mTextUnderlineOffset) ||
       (mTextJustify != aNewData.mTextJustify) ||
       (mWordSpacing != aNewData.mWordSpacing) ||
       (mMozTabSize != aNewData.mMozTabSize)) {
     return NS_STYLE_HINT_REFLOW;
   }
 
   if (HasTextEmphasis() != aNewData.HasTextEmphasis() ||
       (HasTextEmphasis() &&
--- a/layout/style/nsStyleStruct.h
+++ b/layout/style/nsStyleStruct.h
@@ -1294,16 +1294,19 @@ struct MOZ_NEEDS_MEMMOVABLE_MEMBERS nsSt
   mozilla::StyleColor mWebkitTextFillColor;
   mozilla::StyleColor mWebkitTextStrokeColor;
 
   mozilla::StyleNonNegativeLengthOrNumber mMozTabSize;
   mozilla::LengthPercentage mWordSpacing;
   mozilla::StyleLetterSpacing mLetterSpacing;
   mozilla::StyleLineHeight mLineHeight;
   mozilla::LengthPercentage mTextIndent;
+
+  mozilla::StyleLengthOrAuto mTextUnderlineOffset;
+
   nscoord mWebkitTextStrokeWidth;  // coord
 
   mozilla::StyleArcSlice<mozilla::StyleSimpleShadow> mTextShadow;
 
   nsString mTextEmphasisStyleString;
 
   mozilla::StyleWordBreak EffectiveWordBreak() const {
     if (mWordBreak == mozilla::StyleWordBreak::BreakWord) {
--- a/layout/style/test/mochitest.ini
+++ b/layout/style/test/mochitest.ini
@@ -4,16 +4,17 @@ prefs =
   dom.animations-api.core.enabled=true
   dom.animations-api.getAnimations.enabled=true
   dom.animations-api.implicit-keyframes.enabled=true
   dom.animations-api.timelines.enabled=true
   gfx.omta.background-color=true
   layout.css.individual-transform.enabled=true
   layout.css.motion-path.enabled=true
   layout.css.step-position-jump.enabled=true
+  layout.css.text-underline-offset.enabled=true
 support-files =
   animation_utils.js
   ccd-quirks.html
   ccd.sjs
   ccd-standards.html
   chrome/bug418986-2.js
   chrome/match.png
   chrome/mismatch.png
--- a/layout/style/test/property_database.js
+++ b/layout/style/test/property_database.js
@@ -4764,16 +4764,24 @@ var gCSSProperties = {
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
     applies_to_placeholder: true,
     initial_values: [ "solid" ],
     other_values: [ "double", "dotted", "dashed", "wavy", "-moz-none" ],
     invalid_values: [ "none", "groove", "ridge", "inset", "outset", "solid dashed", "wave" ]
   },
+  "text-underline-offset": {
+    domProp: "textUnderlineOffset",
+    inherited: true,
+    type: CSS_TYPE_LONGHAND,
+    initial_values: [ "auto" ],
+    other_values: ["0", "-14px", "25px", "100em", "-45em"],
+    invalid_values: ["13", "-25", "rubbish", ",./!@#$", "43%", "-10%"]
+  },
   "text-emphasis": {
     domProp: "textEmphasis",
     inherited: true,
     type: CSS_TYPE_TRUE_SHORTHAND,
     prerequisites: { "color": "black" },
     subproperties: [ "text-emphasis-style", "text-emphasis-color" ],
     initial_values: [ "none currentColor", "currentColor none", "none", "currentColor", "none black" ],
     other_values: [ "filled dot black", "#f00 circle open", "sesame filled rgba(0,0,255,0.5)", "red", "green none", "currentColor filled", "currentColor open" ],
--- a/layout/style/test/test_transitions_per_property.html
+++ b/layout/style/test/test_transitions_per_property.html
@@ -313,17 +313,18 @@ var supported_properties = {
            test_length_unclamped, test_percent_unclamped ],
     "y": [ test_length_transition, test_percent_transition,
            test_length_unclamped, test_percent_unclamped ],
     "z-index": [ test_integer_transition, test_pos_integer_or_auto_transition ],
     "-webkit-line-clamp": [ test_pos_integer_or_none_transition ],
     "-webkit-text-fill-color": [ test_color_transition,
                                  test_currentcolor_transition ],
     "-webkit-text-stroke-color": [ test_color_transition,
-                                   test_currentcolor_transition ]
+                                   test_currentcolor_transition ],
+    "text-underline-offset": [ test_length_transition ],
 };
 
 if (IsCSSPropertyPrefEnabled("layout.css.motion-path.enabled")) {
   supported_properties["offset-path"] = [ test_path_function ];
   supported_properties["offset-distance"] =
     [ test_length_transition,
       test_percent_transition,
       test_length_unclamped,
--- a/modules/libpref/init/StaticPrefList.h
+++ b/modules/libpref/init/StaticPrefList.h
@@ -4140,16 +4140,24 @@ VARCACHE_PREF(
 // Is path() supported in clip-path?
 VARCACHE_PREF(
   Live,
   "layout.css.clip-path-path.enabled",
   layout_css_clip_path_path_enabled,
   bool, false
 )
 
+// text underline offset
+VARCACHE_PREF(
+  Live,
+  "layout.css.text-underline-offset.enabled",
+  layout_css_text_underline_offset_enabled,
+  bool, false
+)
+
 // Is support for CSS column-span enabled?
 VARCACHE_PREF(
   Live,
   "layout.css.column-span.enabled",
   layout_css_column_span_enabled,
   bool, false
 )
 
--- a/servo/components/style/properties/longhands/inherited_text.mako.rs
+++ b/servo/components/style/properties/longhands/inherited_text.mako.rs
@@ -369,8 +369,19 @@
     "-moz-control-character-visibility",
     "hidden visible",
     gecko_constant_prefix="NS_STYLE_CONTROL_CHARACTER_VISIBILITY",
     animation_value_type="none",
     gecko_ffi_name="mControlCharacterVisibility",
     products="gecko",
     spec="Nonstandard",
 )}
+
+// text underline offset
+${helpers.predefined_type(
+    "text-underline-offset",
+    "LengthOrAuto",
+    "computed::LengthOrAuto::auto()",
+    products="gecko",
+    animation_value_type="ComputedValue",
+    gecko_pref="layout.css.text-underline-offset.enabled",
+    spec="https://drafts.csswg.org/css-text-decor-4/#underline-offset",
+)}