Bug 1819936 - Move legacy -moz-box collapse to its own CSS property. r=jwatt

Make display: -moz-box's visibility: collapse handling switchable by its
own CSS property.

Longer term maybe we should switch the front-end away from visibility:
collapse altogether (there are some alternatives), but for now this will
allow to move the front-end to switch to modern `display: flex` while
keeping `visibility: collapse` work as in -moz-box.

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

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

@@ -247,6 +247,7 @@ exports.ANIMATION_TYPE_FOR_LONGHANDS = [
       "padding-inline-start",
       "page-orientation",
       "math-depth",
+      "-moz-box-collapse",
       "-moz-box-layout",
       "-moz-top-layer",
       "scroll-timeline-axis",

layout/generic/nsFlexContainerFrame.cpp

@@ -58,11 +58,6 @@ static bool IsLegacyBox(const nsIFrame* aFlexContainer) {
       NS_STATE_FLEX_IS_EMULATING_LEGACY_WEBKIT_BOX);
 }
 
-static bool IsLegacyMozBox(const nsFlexContainerFrame* aFlexContainer) {
-  return aFlexContainer->HasAnyStateBits(
-      NS_STATE_FLEX_IS_EMULATING_LEGACY_MOZ_BOX);
-}
-
 // Returns the OrderState enum we should pass to CSSOrderAwareFrameIterator
 // (depending on whether aFlexContainer has
 // NS_STATE_FLEX_NORMAL_FLOW_CHILDREN_IN_CSS_ORDER state bit).
@@ -3970,7 +3965,8 @@ void nsFlexContainerFrame::GenerateFlexLines(
                        iter.ItemsAreAlreadyInOrder());
 
   bool prevItemRequestedBreakAfter = false;
-  const bool useMozBoxCollapseBehavior = IsLegacyMozBox(this);
+  const bool useMozBoxCollapseBehavior =
+      StyleVisibility()->UseLegacyCollapseBehavior();
 
   for (; !iter.AtEnd(); iter.Next()) {
     nsIFrame* childFrame = *iter;
@@ -4668,7 +4664,8 @@ void nsFlexContainerFrame::UnionInFlowChildOverflow(
   nsRect itemMarginBoxes;
   // Union of relative-positioned margin boxes for the relpos items only.
   nsRect relPosItemMarginBoxes;
-  const bool useMozBoxCollapseBehavior = IsLegacyMozBox(this);
+  const bool useMozBoxCollapseBehavior =
+      StyleVisibility()->UseLegacyCollapseBehavior();
   for (nsIFrame* f : mFrames) {
     if (useMozBoxCollapseBehavior && f->StyleVisibility()->IsCollapse()) {
       continue;
@@ -5096,7 +5093,8 @@ nsFlexContainerFrame::FlexLayoutResult nsFlexContainerFrame::DoFlexLayout(
   // constructor), we can create struts for any flex items with
   // "visibility: collapse" (and restart flex layout).
   // Make sure to only do this if we had no struts.
-  if (aStruts.IsEmpty() && !IsLegacyMozBox(this) && flr.mHasCollapsedItems) {
+  if (aStruts.IsEmpty() && flr.mHasCollapsedItems &&
+      !StyleVisibility()->UseLegacyCollapseBehavior()) {
     BuildStrutInfoFromCollapsedItems(flr.mLines, aStruts);
     if (!aStruts.IsEmpty()) {
       // Restart flex layout, using our struts.
@@ -5617,7 +5615,8 @@ nscoord nsFlexContainerFrame::IntrinsicISize(gfxContext* aRenderingContext,
                                                     NS_UNCONSTRAINEDSIZE);
   }
 
-  const bool useMozBoxCollapseBehavior = IsLegacyMozBox(this);
+  const bool useMozBoxCollapseBehavior =
+      StyleVisibility()->UseLegacyCollapseBehavior();
 
   // The loop below sets aside space for a gap before each item besides the
   // first. This bool helps us handle that special-case.

layout/style/ServoBindings.toml

@@ -152,6 +152,7 @@ rusty-enums = [
     "mozilla::StyleTopLayer",
     "mozilla::StyleIsolation",
     "mozilla::StyleTextOrientation",
+    "mozilla::StyleMozBoxCollapse",
     "mozilla::StyleMozBoxLayout",
     "mozilla::StyleTextCombineUpright",
     "mozilla::StyleUnicodeBidi",

layout/style/nsStyleConsts.h

@@ -519,6 +519,13 @@ enum class StyleMozBoxLayout : uint8_t {
   Legacy,
 };
 
+// Whether flexbox visibility: collapse items use legacy -moz-box behavior or
+// not.
+enum class StyleMozBoxCollapse : uint8_t {
+  Flex,
+  Legacy,
+};
+
 // See nsStyleText
 enum class StyleTextCombineUpright : uint8_t {
   None,

layout/style/nsStyleStruct.cpp

@@ -2716,6 +2716,7 @@ nsStyleVisibility::nsStyleVisibility(const Document& aDocument)
       mWritingMode(StyleWritingModeProperty::HorizontalTb),
       mTextOrientation(StyleTextOrientation::Mixed),
       mMozBoxLayout(StyleMozBoxLayout::Flex),
+      mMozBoxCollapse(StyleMozBoxCollapse::Flex),
       mPrintColorAdjust(StylePrintColorAdjust::Economy),
       mImageOrientation(StyleImageOrientation::FromImage) {
   MOZ_COUNT_CTOR(nsStyleVisibility);
@@ -2728,6 +2729,7 @@ nsStyleVisibility::nsStyleVisibility(const nsStyleVisibility& aSource)
       mWritingMode(aSource.mWritingMode),
       mTextOrientation(aSource.mTextOrientation),
       mMozBoxLayout(aSource.mMozBoxLayout),
+      mMozBoxCollapse(aSource.mMozBoxCollapse),
       mPrintColorAdjust(aSource.mPrintColorAdjust),
       mImageOrientation(aSource.mImageOrientation) {
   MOZ_COUNT_CTOR(nsStyleVisibility);
@@ -2755,14 +2757,15 @@ nsChangeHint nsStyleVisibility::CalcDifference(
         aNewData.mVisible == StyleVisibility::Visible) {
       hint |= nsChangeHint_VisibilityChange;
     }
-    if (StyleVisibility::Collapse == mVisible ||
-        StyleVisibility::Collapse == aNewData.mVisible) {
+    if (mVisible == StyleVisibility::Collapse ||
+        aNewData.mVisible == StyleVisibility::Collapse) {
       hint |= NS_STYLE_HINT_REFLOW;
     } else {
       hint |= NS_STYLE_HINT_VISUAL;
     }
   }
-  if (mTextOrientation != aNewData.mTextOrientation) {
+  if (mTextOrientation != aNewData.mTextOrientation ||
+      mMozBoxCollapse != aNewData.mMozBoxCollapse) {
     hint |= NS_STYLE_HINT_REFLOW;
   }
   if (mImageRendering != aNewData.mImageRendering) {

layout/style/nsStyleStruct.h

@@ -1120,6 +1120,10 @@ struct MOZ_NEEDS_MEMMOVABLE_MEMBERS nsStyleVisibility {
     return mMozBoxLayout == mozilla::StyleMozBoxLayout::Flex;
   }
 
+  bool UseLegacyCollapseBehavior() const {
+    return mMozBoxCollapse == mozilla::StyleMozBoxCollapse::Legacy;
+  }
+
   /**
    * Given an image request, returns the orientation that should be used
    * on the image. The returned orientation may differ from the style
@@ -1152,6 +1156,7 @@ struct MOZ_NEEDS_MEMMOVABLE_MEMBERS nsStyleVisibility {
   mozilla::StyleWritingModeProperty mWritingMode;
   mozilla::StyleTextOrientation mTextOrientation;
   mozilla::StyleMozBoxLayout mMozBoxLayout;
+  mozilla::StyleMozBoxCollapse mMozBoxCollapse;
   mozilla::StylePrintColorAdjust mPrintColorAdjust;
 
  private:

layout/style/res/scrollbars.css

@@ -20,6 +20,7 @@
     -moz-control-character-visibility: initial;
     -moz-font-smoothing-background-color: initial;
     -moz-min-font-size-ratio: initial;
+    -moz-box-collapse: initial;
 
     /* -moz-box-layout: initial; is not included in 'all' but it's not needed,
      * because we explicitly specify it below for the top level scrollbar parts

layout/style/test/ListCSSProperties.cpp

@@ -102,6 +102,7 @@ const char* gInaccessibleProperties[] = {
     "-moz-math-display",                     // parsed by UA sheets only
     "-moz-top-layer",                        // parsed by UA sheets only
     "-moz-min-font-size-ratio",              // parsed by UA sheets only
+    "-moz-box-collapse",                     // chrome-only internal properties
     "-moz-box-layout",                       // chrome-only internal properties
     "-moz-font-smoothing-background-color",  // chrome-only internal properties
     "-moz-subtree-hidden-only-visually",     // chrome-only internal properties

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

@@ -46,6 +46,16 @@ ${helpers.single_keyword(
     servo_restyle_damage="rebuild_and_reflow",
 )}
 
+${helpers.single_keyword(
+    "-moz-box-collapse",
+    "flex legacy",
+    engines="gecko",
+    gecko_enum_prefix="StyleMozBoxCollapse",
+    animation_value_type="none",
+    enabled_in="chrome",
+    spec="None (internal)",
+)}
+
 ${helpers.single_keyword(
     "-moz-box-layout",
     "flex legacy",

toolkit/content/xul.css

@@ -37,6 +37,7 @@
 *|*:root {
   --animation-easing-function: cubic-bezier(.07, .95, 0, 1);
   -moz-box-flex: 1;
+  -moz-box-collapse: legacy;
 }
 
 :root {