Bug 1105111 part 2: Add support for 'flex-basis:content' in the style system (gecko / getComputedStyle side). r=mats draft
authorDaniel Holbert <dholbert@cs.stanford.edu>
Fri, 30 Mar 2018 16:50:04 -0700
changeset 775395 fa00ad1c6ad7c5639033b1590942a811c6294749
parent 775377 ddbab98713a14a8d3e4be13a02ba98129ba0733e
child 775396 da3e5c8f6a75c48f47ac833f07c66672d7afe42a
push id104709
push userdholbert@mozilla.com
push dateFri, 30 Mar 2018 23:51:10 +0000
reviewersmats
bugs1105111
milestone61.0a1
Bug 1105111 part 2: Add support for 'flex-basis:content' in the style system (gecko / getComputedStyle side). r=mats MozReview-Commit-ID: E0crFCy7Jfk
layout/style/nsCSSKeywordList.h
layout/style/nsCSSPropList.h
layout/style/nsCSSProps.cpp
layout/style/nsCSSProps.h
layout/style/nsComputedDOMStyle.cpp
layout/style/nsStyleConsts.h
layout/style/test/property_database.js
--- a/layout/style/nsCSSKeywordList.h
+++ b/layout/style/nsCSSKeywordList.h
@@ -201,16 +201,17 @@ CSS_KEY(collapse, collapse)
 CSS_KEY(color, color)
 CSS_KEY(color-burn, color_burn)
 CSS_KEY(color-dodge, color_dodge)
 CSS_KEY(common-ligatures, common_ligatures)
 CSS_KEY(column, column)
 CSS_KEY(column-reverse, column_reverse)
 CSS_KEY(condensed, condensed)
 CSS_KEY(contain, contain)
+CSS_KEY(content, content)
 CSS_KEY(content-box, content_box)
 CSS_KEY(contents, contents)
 CSS_KEY(context-fill, context_fill)
 CSS_KEY(context-fill-opacity, context_fill_opacity)
 CSS_KEY(context-menu, context_menu)
 CSS_KEY(context-stroke, context_stroke)
 CSS_KEY(context-stroke-opacity, context_stroke_opacity)
 CSS_KEY(context-value, context_value)
--- a/layout/style/nsCSSPropList.h
+++ b/layout/style/nsCSSPropList.h
@@ -1401,17 +1401,17 @@ CSS_PROP_POSITION(
     flex_basis,
     FlexBasis,
     0,
     "",
     // NOTE: The parsing implementation for the 'flex' shorthand property has
     // its own code to parse each subproperty. It does not depend on the
     // longhand parsing defined here.
     VARIANT_AHKLP | VARIANT_CALC,
-    kWidthKTable,
+    kFlexBasisKTable,
     eStyleAnimType_Coord)
 CSS_PROP_POSITION(
     flex-direction,
     flex_direction,
     FlexDirection,
     0,
     "",
     VARIANT_HK,
--- a/layout/style/nsCSSProps.cpp
+++ b/layout/style/nsCSSProps.cpp
@@ -1909,16 +1909,30 @@ const KTableEntry nsCSSProps::kWhitespac
 const KTableEntry nsCSSProps::kWidthKTable[] = {
   { eCSSKeyword__moz_max_content, NS_STYLE_WIDTH_MAX_CONTENT },
   { eCSSKeyword__moz_min_content, NS_STYLE_WIDTH_MIN_CONTENT },
   { eCSSKeyword__moz_fit_content, NS_STYLE_WIDTH_FIT_CONTENT },
   { eCSSKeyword__moz_available, NS_STYLE_WIDTH_AVAILABLE },
   { eCSSKeyword_UNKNOWN, -1 }
 };
 
+// This must be the same as kWidthKTable, but just with 'content' added:
+const KTableEntry nsCSSProps::kFlexBasisKTable[] = {
+  { eCSSKeyword__moz_max_content, NS_STYLE_WIDTH_MAX_CONTENT },
+  { eCSSKeyword__moz_min_content, NS_STYLE_WIDTH_MIN_CONTENT },
+  { eCSSKeyword__moz_fit_content, NS_STYLE_WIDTH_FIT_CONTENT },
+  { eCSSKeyword__moz_available,   NS_STYLE_WIDTH_AVAILABLE },
+  { eCSSKeyword_content,          NS_STYLE_FLEX_BASIS_CONTENT },
+  { eCSSKeyword_UNKNOWN, -1 }
+};
+static_assert(ArrayLength(nsCSSProps::kFlexBasisKTable) ==
+              ArrayLength(nsCSSProps::kWidthKTable) + 1,
+              "kFlexBasisKTable should have the same entries as "
+              "kWidthKTable, plus one more for 'content'");
+
 const KTableEntry nsCSSProps::kWindowDraggingKTable[] = {
   { eCSSKeyword_default, StyleWindowDragging::Default },
   { eCSSKeyword_drag, StyleWindowDragging::Drag },
   { eCSSKeyword_no_drag, StyleWindowDragging::NoDrag },
   { eCSSKeyword_UNKNOWN, -1 }
 };
 
 const KTableEntry nsCSSProps::kWindowShadowKTable[] = {
--- a/layout/style/nsCSSProps.h
+++ b/layout/style/nsCSSProps.h
@@ -675,15 +675,16 @@ public:
   static const KTableEntry kUserInputKTable[];
   static const KTableEntry kUserModifyKTable[];
   static const KTableEntry kUserSelectKTable[];
   static const KTableEntry kVerticalAlignKTable[];
   static const KTableEntry kVisibilityKTable[];
   static const KTableEntry kVolumeKTable[];
   static const KTableEntry kWhitespaceKTable[];
   static const KTableEntry kWidthKTable[]; // also min-width, max-width
+  static const KTableEntry kFlexBasisKTable[];
   static const KTableEntry kWindowDraggingKTable[];
   static const KTableEntry kWindowShadowKTable[];
   static const KTableEntry kWordBreakKTable[];
   static const KTableEntry kWritingModeKTable[];
 };
 
 #endif /* nsCSSProps_h___ */
--- a/layout/style/nsComputedDOMStyle.cpp
+++ b/layout/style/nsComputedDOMStyle.cpp
@@ -4772,17 +4772,17 @@ nsComputedDOMStyle::DoGetFlexBasis()
   //     if (my flex container is horizontal) {
   //       percentageBaseGetter = &nsComputedDOMStyle::GetCBContentWidth;
   //     } else {
   //       percentageBaseGetter = &nsComputedDOMStyle::GetCBContentHeight;
   //     }
   //   }
 
   SetValueToCoord(val, StylePosition()->mFlexBasis, true,
-                  nullptr, nsCSSProps::kWidthKTable);
+                  nullptr, nsCSSProps::kFlexBasisKTable);
   return val.forget();
 }
 
 already_AddRefed<CSSValue>
 nsComputedDOMStyle::DoGetFlexDirection()
 {
   RefPtr<nsROCSSPrimitiveValue> val = new nsROCSSPrimitiveValue;
   val->SetIdent(
--- a/layout/style/nsStyleConsts.h
+++ b/layout/style/nsStyleConsts.h
@@ -671,16 +671,22 @@ enum class StyleGridTrackBreadth : uint8
 #define NS_MATHML_DISPLAYSTYLE_INLINE           0
 #define NS_MATHML_DISPLAYSTYLE_BLOCK            1
 
 // See nsStylePosition::mWidth, mMinWidth, mMaxWidth
 #define NS_STYLE_WIDTH_MAX_CONTENT              0
 #define NS_STYLE_WIDTH_MIN_CONTENT              1
 #define NS_STYLE_WIDTH_FIT_CONTENT              2
 #define NS_STYLE_WIDTH_AVAILABLE                3
+// The 'content' keyword is only valid for 'flex-basis' (not for 'width').  But
+// aside from that, the 'flex-basis' property accepts exactly the same values
+// as 'width'. So I'm listing this one 'flex-basis'-specific enumerated value
+// alongside the 'width' ones, to be sure we don't accidentally overload this
+// numeric value with two different meanings if new 'width' keywords are added.
+#define NS_STYLE_FLEX_BASIS_CONTENT             4
 
 // See nsStyleDisplay.mPosition
 #define NS_STYLE_POSITION_STATIC                0
 #define NS_STYLE_POSITION_RELATIVE              1
 #define NS_STYLE_POSITION_ABSOLUTE              2
 #define NS_STYLE_POSITION_FIXED                 3
 #define NS_STYLE_POSITION_STICKY                4
 
--- a/layout/style/test/property_database.js
+++ b/layout/style/test/property_database.js
@@ -4736,16 +4736,17 @@ var gCSSProperties = {
       "calc(50% - (3em + 2px))",
       "calc((50% - 3em) + 2px)",
       "calc(2em)",
       "calc(50%)",
       "calc(50px/2)",
       "calc(50px/(2 - 1))",
     ],
     invalid_values: [ "none", "-2px",
+      "content",  /* (valid for 'flex-basis' but not 'width') */
       /* invalid calc() values */
       "calc(50%+ 2px)",
       "calc(50% +2px)",
       "calc(50%+2px)",
       "-moz-min()",
       "calc(min())",
       "-moz-max()",
       "calc(max())",
@@ -5251,22 +5252,24 @@ var gCSSProperties = {
       "0 1 calc(0px + rubbish)",
     ]
   },
   "flex-basis": {
     domProp: "flexBasis",
     inherited: false,
     type: CSS_TYPE_LONGHAND,
     initial_values: [ " auto" ],
-        // NOTE: This is cribbed directly from the "width" chunk, since this
-        // property takes the exact same values as width (albeit with
-        // different semantics on 'auto').
+        // NOTE: Besides "content", this is cribbed directly from the "width"
+        // chunk, since this property takes the exact same values as width
+        // (plus 'content' & with different semantics on 'auto').
         // XXXdholbert (Maybe these should get separated out into
         // a reusable array defined at the top of this file?)
-    other_values: [ "15px", "3em", "15%", "-moz-max-content", "-moz-min-content", "-moz-fit-content", "-moz-available",
+    other_values: [
+      "content",
+      "15px", "3em", "15%", "-moz-max-content", "-moz-min-content", "-moz-fit-content", "-moz-available",
       // valid calc() values
       "calc(-2px)",
       "calc(2px)",
       "calc(50%)",
       "calc(50% + 2px)",
       "calc( 50% + 2px)",
       "calc(50% + 2px )",
       "calc( 50% + 2px )",