Bug 1265342 Part 1: Add shape-margin to style system (Gecko bindings). r=xidorn

MozReview-Commit-ID: 3G0ZpWDrumg

--HG--
extra : rebase_source : da38e002a62212757adf276413aebbf58aa7d9b6

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

@@ -306,6 +306,7 @@ exports.ANIMATION_TYPE_FOR_LONGHANDS = [
     "perspective",
     "right",
     "row-gap",
+    "shape-margin",
     "stroke-dashoffset",
     "stroke-width",
     "-moz-tab-size",

devtools/shared/css/generated/properties-db.js

@@ -3099,6 +3099,7 @@ exports.CSS_PROPERTIES = {
       "scroll-snap-type-x",
       "scroll-snap-type-y",
       "shape-image-threshold",
+      "shape-margin",
       "shape-outside",
       "shape-rendering",
       "-moz-stack-sizing",
@@ -8559,6 +8560,22 @@ exports.CSS_PROPERTIES = {
       "unset"
     ]
   },
+  "shape-margin": {
+    "isInherited": false,
+    "subproperties": [
+      "shape-margin"
+    ],
+    "supports": [
+      6,
+      8
+    ],
+    "values": [
+      "calc",
+      "inherit",
+      "initial",
+      "unset"
+    ]
+  },
   "shape-outside": {
     "isInherited": false,
     "subproperties": [
@@ -9652,6 +9669,10 @@ exports.PREFERENCES = [
     "shape-image-threshold",
     "layout.css.shape-outside.enabled"
   ],
+  [
+    "shape-margin",
+    "layout.css.shape-outside.enabled"
+  ],
   [
     "shape-outside",
     "layout.css.shape-outside.enabled"

layout/style/nsCSSPropList.h

@@ -2506,6 +2506,14 @@ CSS_PROP_(
     "layout.css.shape-outside.enabled",
     VARIANT_HN,
     nullptr)
+CSS_PROP_(
+    shape-margin,
+    shape_margin,
+    ShapeMargin,
+    0,
+    "layout.css.shape-outside.enabled",
+    VARIANT_HLP | VARIANT_CALC,
+    nullptr)
 CSS_PROP_(
     shape-outside,
     shape_outside,

layout/style/nsComputedDOMStyle.cpp

@@ -6600,6 +6600,14 @@ nsComputedDOMStyle::DoGetShapeImageThreshold()
   return val.forget();
 }
 
+already_AddRefed<CSSValue>
+nsComputedDOMStyle::DoGetShapeMargin()
+{
+  RefPtr<nsROCSSPrimitiveValue> val = new nsROCSSPrimitiveValue;
+  SetValueToCoord(val, StyleDisplay()->mShapeMargin, true);
+  return val.forget();
+}
+
 already_AddRefed<CSSValue>
 nsComputedDOMStyle::DoGetShapeOutside()
 {

layout/style/nsComputedDOMStyle.h

@@ -516,6 +516,7 @@ private:
   already_AddRefed<CSSValue> DoGetScrollSnapDestination();
   already_AddRefed<CSSValue> DoGetScrollSnapCoordinate();
   already_AddRefed<CSSValue> DoGetShapeImageThreshold();
+  already_AddRefed<CSSValue> DoGetShapeMargin();
   already_AddRefed<CSSValue> DoGetShapeOutside();
 
   /* User interface properties */

layout/style/nsComputedDOMStylePropertyList.h

@@ -234,6 +234,7 @@ COMPUTED_STYLE_PROP(scroll_snap_points_y,          ScrollSnapPointsY)
 COMPUTED_STYLE_PROP(scroll_snap_type_x,            ScrollSnapTypeX)
 COMPUTED_STYLE_PROP(scroll_snap_type_y,            ScrollSnapTypeY)
 COMPUTED_STYLE_PROP(shape_image_threshold,         ShapeImageThreshold)
+COMPUTED_STYLE_PROP(shape_margin,                  ShapeMargin)
 COMPUTED_STYLE_PROP(shape_outside,                 ShapeOutside)
 //// COMPUTED_STYLE_PROP(size,                     Size)
 COMPUTED_STYLE_PROP(table_layout,                  TableLayout)

layout/style/nsStyleStruct.cpp

@@ -3582,6 +3582,7 @@ nsStyleDisplay::nsStyleDisplay(const nsPresContext* aContext)
   , mAnimationFillModeCount(1)
   , mAnimationPlayStateCount(1)
   , mAnimationIterationCountCount(1)
+  , mShapeMargin(0, nsStyleCoord::CoordConstructor)
 {
   MOZ_COUNT_CTOR(nsStyleDisplay);
 
@@ -3655,6 +3656,7 @@ nsStyleDisplay::nsStyleDisplay(const nsStyleDisplay& aSource)
   , mAnimationPlayStateCount(aSource.mAnimationPlayStateCount)
   , mAnimationIterationCountCount(aSource.mAnimationIterationCountCount)
   , mShapeImageThreshold(aSource.mShapeImageThreshold)
+  , mShapeMargin(aSource.mShapeMargin)
   , mShapeOutside(aSource.mShapeOutside)
 {
   MOZ_COUNT_CTOR(nsStyleDisplay);
@@ -3803,11 +3805,12 @@ nsStyleDisplay::CalcDifference(const nsStyleDisplay& aNewData) const
   }
 
   if (mShapeOutside != aNewData.mShapeOutside ||
+      mShapeMargin != aNewData.mShapeMargin ||
       mShapeImageThreshold != aNewData.mShapeImageThreshold) {
     if (aNewData.mFloat != StyleFloat::None) {
-      // If we are floating, and our shape-outside or shape-image-threshold
-      // are changed, our descendants are not impacted, but our ancestor and
-      // siblings are.
+      // If we are floating, and our shape-outside, shape-margin, or
+      // shape-image-threshold are changed, our descendants are not impacted,
+      // but our ancestor and siblings are.
       //
       // This is similar to a float-only change, but since the ISize of the
       // float area changes arbitrarily along its block axis, more is required
@@ -3820,8 +3823,8 @@ nsStyleDisplay::CalcDifference(const nsStyleDisplay& aNewData) const
       hint |= nsChangeHint_ReflowHintsForFloatAreaChange |
               nsChangeHint_CSSOverflowChange;
     } else {
-      // shape-outside or shape-image-threshold changed, but we don't need
-      // to reflow because we're not floating.
+      // shape-outside or shape-margin or shape-image-threshold changed,
+      // but we don't need to reflow because we're not floating.
       hint |= nsChangeHint_NeutralChange;
     }
   }

layout/style/nsStyleStruct.h

@@ -2353,6 +2353,9 @@ struct MOZ_NEEDS_MEMMOVABLE_MEMBERS nsStyleDisplay
   // The threshold used for extracting a shape from shape-outside: <image>.
   float mShapeImageThreshold = 0.0f; // [reset]
 
+  // The margin around a shape-outside: <image>.
+  nsStyleCoord mShapeMargin;
+
   mozilla::StyleShapeSource mShapeOutside; // [reset]
 
   bool IsBlockInsideStyle() const {

layout/style/test/property_database.js

@@ -6412,11 +6412,22 @@ if (IsCSSPropertyPrefEnabled("layout.css.shape-outside.enabled")) {
     domProp: "shapeImageThreshold",
     inherited: false,
     type: CSS_TYPE_LONGHAND,
+    applies_to_first_letter: true,
     initial_values: [ "0", "0.0000", "-3", ],
     other_values: [ "0.4", "1", "17", "397.376", "3e1", "3e+1", "3e-1", "3e0", "3e+0", "3e-0" ],
     invalid_values: [ "0px", "1px", "20%", "default", "auto" ]
   };
 
+  gCSSProperties["shape-margin"] = {
+    domProp: "shapeMargin",
+    inherited: false,
+    type: CSS_TYPE_LONGHAND,
+    applies_to_first_letter: true,
+    initial_values: [ "0", ],
+    other_values: [ "2px", "2%", "1em", "calc(1px + 1em)", "calc(1%)" ],
+    invalid_values: [ "-1px", "auto", "none", "1px 1px", "-1%" ],
+  };
+
   gCSSProperties["shape-outside"] = {
     domProp: "shapeOutside",
     inherited: false,

layout/style/test/test_transitions_per_property.html

@@ -317,6 +317,10 @@ if (SpecialPowers.getBoolPref("layout.css.shape-outside.enabled")) {
       // (not parsing/interpolation)
       test_float_zeroToOne_clamped ];
 
+  supported_properties["shape-margin"] =
+    [ test_length_transition, test_percent_transition,
+      test_length_clamped, test_percent_clamped ];
+
   supported_properties["shape-outside"] =
     [ test_basic_shape_or_url_transition ];
 }