Bug 1300895 - Unprefix CSS multi-column properties, but add back prefixed aliases via nsCSSPropAliasList.h draft
authorNeerja Pancholi <npancholi@mozilla.com>
Mon, 10 Oct 2016 13:16:57 -0700
changeset 423811 b0181d1ae9d96646d142b78e6606bc2fd0775042
parent 423309 43d5e51ac48c6ba3111a72142507435697fa809e
child 423821 c800b429f8a6f331403fb92d843c295417253bf8
child 423822 64b924fd1f95132ee9e6b2a5c2099083adab0478
push id31988
push userbmo:npancholi@mozilla.com
push dateTue, 11 Oct 2016 17:43:24 +0000
bugs1300895
milestone52.0a1
Bug 1300895 - Unprefix CSS multi-column properties, but add back prefixed aliases via nsCSSPropAliasList.h Also make necessary updates to tests like: 1. unprefixing in property_database.js and added new aliases there 2. unprefixing in test_transitions_per_property.html 3. update nsComputedDomStylePropertyList.h 4. update devtools' property database MozReview-Commit-ID: B3kOFrM9EL
devtools/shared/css/generated/properties-db.js
layout/style/nsCSSPropAliasList.h
layout/style/nsCSSPropList.h
layout/style/nsComputedDOMStylePropertyList.h
layout/style/test/property_database.js
layout/style/test/test_transitions_per_property.html
--- a/devtools/shared/css/generated/properties-db.js
+++ b/devtools/shared/css/generated/properties-db.js
@@ -742,65 +742,65 @@ exports.CSS_PROPERTIES = {
       "inherit",
       "initial",
       "unset"
     ]
   },
   "-moz-column-count": {
     "isInherited": false,
     "subproperties": [
-      "-moz-column-count"
+      "column-count"
     ],
     "supports": [
       7
     ],
     "values": [
       "auto",
       "inherit",
       "initial",
       "unset"
     ]
   },
   "-moz-column-fill": {
     "isInherited": false,
     "subproperties": [
-      "-moz-column-fill"
+      "column-fill"
     ],
     "supports": [],
     "values": [
       "auto",
       "balance",
       "inherit",
       "initial",
       "unset"
     ]
   },
   "-moz-column-gap": {
     "isInherited": false,
     "subproperties": [
-      "-moz-column-gap"
+      "column-gap"
     ],
     "supports": [
       6
     ],
     "values": [
       "-moz-calc",
       "calc",
       "inherit",
       "initial",
       "normal",
       "unset"
     ]
   },
   "-moz-column-rule": {
     "isInherited": false,
     "subproperties": [
-      "-moz-column-rule-width",
-      "-moz-column-rule-style",
-      "-moz-column-rule-color"
+      "column-rule-width",
+      "column-rule-style",
+      "column-rule-color"
     ],
     "supports": [
       2,
       6
     ],
     "values": [
       "COLOR",
       "-moz-calc",
@@ -827,17 +827,17 @@ exports.CSS_PROPERTIES = {
       "thin",
       "transparent",
       "unset"
     ]
   },
   "-moz-column-rule-color": {
     "isInherited": false,
     "subproperties": [
-      "-moz-column-rule-color"
+      "column-rule-color"
     ],
     "supports": [
       2
     ],
     "values": [
       "COLOR",
       "currentColor",
       "hsl",
@@ -848,17 +848,17 @@ exports.CSS_PROPERTIES = {
       "rgba",
       "transparent",
       "unset"
     ]
   },
   "-moz-column-rule-style": {
     "isInherited": false,
     "subproperties": [
-      "-moz-column-rule-style"
+      "column-rule-style"
     ],
     "supports": [],
     "values": [
       "dashed",
       "dotted",
       "double",
       "groove",
       "hidden",
@@ -870,17 +870,17 @@ exports.CSS_PROPERTIES = {
       "ridge",
       "solid",
       "unset"
     ]
   },
   "-moz-column-rule-width": {
     "isInherited": false,
     "subproperties": [
-      "-moz-column-rule-width"
+      "column-rule-width"
     ],
     "supports": [
       6
     ],
     "values": [
       "-moz-calc",
       "calc",
       "inherit",
@@ -889,35 +889,35 @@ exports.CSS_PROPERTIES = {
       "thick",
       "thin",
       "unset"
     ]
   },
   "-moz-column-width": {
     "isInherited": false,
     "subproperties": [
-      "-moz-column-width"
+      "column-width"
     ],
     "supports": [
       6
     ],
     "values": [
       "-moz-calc",
       "auto",
       "calc",
       "inherit",
       "initial",
       "unset"
     ]
   },
   "-moz-columns": {
     "isInherited": false,
     "subproperties": [
-      "-moz-column-count",
-      "-moz-column-width"
+      "column-count",
+      "column-width"
     ],
     "supports": [
       6,
       7
     ],
     "values": [
       "-moz-calc",
       "auto",
@@ -2874,23 +2874,23 @@ exports.CSS_PROPERTIES = {
       "clear",
       "clip",
       "clip-path",
       "clip-rule",
       "color",
       "color-adjust",
       "color-interpolation",
       "color-interpolation-filters",
-      "-moz-column-count",
-      "-moz-column-fill",
-      "-moz-column-gap",
-      "-moz-column-rule-color",
-      "-moz-column-rule-style",
-      "-moz-column-rule-width",
-      "-moz-column-width",
+      "column-count",
+      "column-fill",
+      "column-gap",
+      "column-rule-color",
+      "column-rule-style",
+      "column-rule-width",
+      "column-width",
       "contain",
       "content",
       "-moz-control-character-visibility",
       "counter-increment",
       "counter-reset",
       "cursor",
       "display",
       "dominant-baseline",
@@ -5391,16 +5391,199 @@ exports.CSS_PROPERTIES = {
       "auto",
       "inherit",
       "initial",
       "linearrgb",
       "srgb",
       "unset"
     ]
   },
+  "column-count": {
+    "isInherited": false,
+    "subproperties": [
+      "column-count"
+    ],
+    "supports": [
+      7
+    ],
+    "values": [
+      "auto",
+      "inherit",
+      "initial",
+      "unset"
+    ]
+  },
+  "column-fill": {
+    "isInherited": false,
+    "subproperties": [
+      "column-fill"
+    ],
+    "supports": [],
+    "values": [
+      "auto",
+      "balance",
+      "inherit",
+      "initial",
+      "unset"
+    ]
+  },
+  "column-gap": {
+    "isInherited": false,
+    "subproperties": [
+      "column-gap"
+    ],
+    "supports": [
+      6
+    ],
+    "values": [
+      "-moz-calc",
+      "calc",
+      "inherit",
+      "initial",
+      "normal",
+      "unset"
+    ]
+  },
+  "column-rule": {
+    "isInherited": false,
+    "subproperties": [
+      "column-rule-width",
+      "column-rule-style",
+      "column-rule-color"
+    ],
+    "supports": [
+      2,
+      6
+    ],
+    "values": [
+      "COLOR",
+      "-moz-calc",
+      "calc",
+      "currentColor",
+      "dashed",
+      "dotted",
+      "double",
+      "groove",
+      "hidden",
+      "hsl",
+      "hsla",
+      "inherit",
+      "initial",
+      "inset",
+      "medium",
+      "none",
+      "outset",
+      "rgb",
+      "rgba",
+      "ridge",
+      "solid",
+      "thick",
+      "thin",
+      "transparent",
+      "unset"
+    ]
+  },
+  "column-rule-color": {
+    "isInherited": false,
+    "subproperties": [
+      "column-rule-color"
+    ],
+    "supports": [
+      2
+    ],
+    "values": [
+      "COLOR",
+      "currentColor",
+      "hsl",
+      "hsla",
+      "inherit",
+      "initial",
+      "rgb",
+      "rgba",
+      "transparent",
+      "unset"
+    ]
+  },
+  "column-rule-style": {
+    "isInherited": false,
+    "subproperties": [
+      "column-rule-style"
+    ],
+    "supports": [],
+    "values": [
+      "dashed",
+      "dotted",
+      "double",
+      "groove",
+      "hidden",
+      "inherit",
+      "initial",
+      "inset",
+      "none",
+      "outset",
+      "ridge",
+      "solid",
+      "unset"
+    ]
+  },
+  "column-rule-width": {
+    "isInherited": false,
+    "subproperties": [
+      "column-rule-width"
+    ],
+    "supports": [
+      6
+    ],
+    "values": [
+      "-moz-calc",
+      "calc",
+      "inherit",
+      "initial",
+      "medium",
+      "thick",
+      "thin",
+      "unset"
+    ]
+  },
+  "column-width": {
+    "isInherited": false,
+    "subproperties": [
+      "column-width"
+    ],
+    "supports": [
+      6
+    ],
+    "values": [
+      "-moz-calc",
+      "auto",
+      "calc",
+      "inherit",
+      "initial",
+      "unset"
+    ]
+  },
+  "columns": {
+    "isInherited": false,
+    "subproperties": [
+      "column-count",
+      "column-width"
+    ],
+    "supports": [
+      6,
+      7
+    ],
+    "values": [
+      "-moz-calc",
+      "auto",
+      "calc",
+      "inherit",
+      "initial",
+      "unset"
+    ]
+  },
   "content": {
     "isInherited": false,
     "subproperties": [
       "content"
     ],
     "supports": [
       11
     ],
@@ -9525,49 +9708,49 @@ exports.PREFERENCES = [
     "color-interpolation",
     ""
   ],
   [
     "color-interpolation-filters",
     ""
   ],
   [
-    "-moz-column-count",
-    ""
-  ],
-  [
-    "-moz-column-fill",
-    ""
-  ],
-  [
-    "-moz-column-gap",
-    ""
-  ],
-  [
-    "-moz-column-rule",
-    ""
-  ],
-  [
-    "-moz-column-rule-color",
-    ""
-  ],
-  [
-    "-moz-column-rule-style",
-    ""
-  ],
-  [
-    "-moz-column-rule-width",
-    ""
-  ],
-  [
-    "-moz-column-width",
-    ""
-  ],
-  [
-    "-moz-columns",
+    "column-count",
+    ""
+  ],
+  [
+    "column-fill",
+    ""
+  ],
+  [
+    "column-gap",
+    ""
+  ],
+  [
+    "column-rule",
+    ""
+  ],
+  [
+    "column-rule-color",
+    ""
+  ],
+  [
+    "column-rule-style",
+    ""
+  ],
+  [
+    "column-rule-width",
+    ""
+  ],
+  [
+    "column-width",
+    ""
+  ],
+  [
+    "columns",
     ""
   ],
   [
     "contain",
     "layout.css.contain.enabled"
   ],
   [
     "content",
@@ -9986,17 +10169,17 @@ exports.PREFERENCES = [
     ""
   ],
   [
     "mask-size",
     ""
   ],
   [
     "mask-type",
-    "layout.css.masking.enabled"
+    ""
   ],
   [
     "max-block-size",
     ""
   ],
   [
     "max-height",
     ""
@@ -10661,16 +10844,52 @@ exports.PREFERENCES = [
     "-moz-hyphens",
     ""
   ],
   [
     "-moz-text-align-last",
     ""
   ],
   [
+    "-moz-column-count",
+    ""
+  ],
+  [
+    "-moz-column-fill",
+    ""
+  ],
+  [
+    "-moz-column-gap",
+    ""
+  ],
+  [
+    "-moz-column-rule",
+    ""
+  ],
+  [
+    "-moz-column-rule-color",
+    ""
+  ],
+  [
+    "-moz-column-rule-style",
+    ""
+  ],
+  [
+    "-moz-column-rule-width",
+    ""
+  ],
+  [
+    "-moz-column-width",
+    ""
+  ],
+  [
+    "-moz-columns",
+    ""
+  ],
+  [
     "-webkit-animation",
     "layout.css.prefixes.webkit"
   ],
   [
     "-webkit-animation-delay",
     "layout.css.prefixes.webkit"
   ],
   [
--- a/layout/style/nsCSSPropAliasList.h
+++ b/layout/style/nsCSSPropAliasList.h
@@ -182,16 +182,52 @@ CSS_PROP_ALIAS(-moz-border-start-width,
 CSS_PROP_ALIAS(-moz-hyphens,
                hyphens,
                MozHyphens,
                "")
 CSS_PROP_ALIAS(-moz-text-align-last,
                text_align_last,
                MozTextAlignLast,
                "")
+CSS_PROP_ALIAS(-moz-column-count,
+               column_count,
+               MozColumnCount,
+               "")
+CSS_PROP_ALIAS(-moz-column-fill,
+               column_fill,
+               MozColumnFill,
+               "")
+CSS_PROP_ALIAS(-moz-column-gap,
+               column_gap,
+               MozColumnGap,
+               "")
+CSS_PROP_ALIAS(-moz-column-rule,
+               column_rule,
+               MozColumnRule,
+               "")
+CSS_PROP_ALIAS(-moz-column-rule-color,
+               column_rule_color,
+               MozColumnRuleColor,
+               "")
+CSS_PROP_ALIAS(-moz-column-rule-style,
+               column_rule_style,
+               MozColumnRuleStyle,
+               "")
+CSS_PROP_ALIAS(-moz-column-rule-width,
+               column_rule_width,
+               MozColumnRuleWidth,
+               "")
+CSS_PROP_ALIAS(-moz-column-width,
+               column_width,
+               MozColumnWidth,
+               "")
+CSS_PROP_ALIAS(-moz-columns,
+               columns,
+               MozColumns,
+               "")
 
 #define WEBKIT_PREFIX_PREF "layout.css.prefixes.webkit"
 
 // -webkit- prefixes
 CSS_PROP_ALIAS(-webkit-animation,
                animation,
                WebkitAnimation,
                WEBKIT_PREFIX_PREF)
--- a/layout/style/nsCSSPropList.h
+++ b/layout/style/nsCSSPropList.h
@@ -1465,102 +1465,102 @@ CSS_PROP_SVG(
     ColorInterpolationFilters,
     CSS_PROPERTY_PARSE_VALUE,
     "",
     VARIANT_HK,
     kColorInterpolationKTable,
     CSS_PROP_NO_OFFSET,
     eStyleAnimType_Discrete)
 CSS_PROP_COLUMN(
-    -moz-column-count,
+    column-count,
     column_count,
-    CSS_PROP_DOMPROP_PREFIXED(ColumnCount),
+    ColumnCount,
     CSS_PROPERTY_PARSE_VALUE |
         // Need to reject 0 in addition to negatives.  If we accept 0, we
         // need to change NS_STYLE_COLUMN_COUNT_AUTO to something else.
         CSS_PROPERTY_VALUE_AT_LEAST_ONE,
     "",
     VARIANT_AHI,
     nullptr,
     offsetof(nsStyleColumn, mColumnCount),
     eStyleAnimType_Custom)
 CSS_PROP_COLUMN(
-    -moz-column-fill,
+    column-fill,
     column_fill,
-    CSS_PROP_DOMPROP_PREFIXED(ColumnFill),
+    ColumnFill,
     CSS_PROPERTY_PARSE_VALUE,
     "",
     VARIANT_HK,
     kColumnFillKTable,
     CSS_PROP_NO_OFFSET,
     eStyleAnimType_None)
 CSS_PROP_COLUMN(
-    -moz-column-gap,
+    column-gap,
     column_gap,
-    CSS_PROP_DOMPROP_PREFIXED(ColumnGap),
+    ColumnGap,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_VALUE_NONNEGATIVE,
     "",
     VARIANT_HL | VARIANT_NORMAL | VARIANT_CALC,
     nullptr,
     offsetof(nsStyleColumn, mColumnGap),
     eStyleAnimType_Coord)
 CSS_PROP_SHORTHAND(
-    -moz-column-rule,
+    column-rule,
     column_rule,
-    CSS_PROP_DOMPROP_PREFIXED(ColumnRule),
+    ColumnRule,
     CSS_PROPERTY_PARSE_FUNCTION,
     "")
 CSS_PROP_COLUMN(
-    -moz-column-rule-color,
+    column-rule-color,
     column_rule_color,
-    CSS_PROP_DOMPROP_PREFIXED(ColumnRuleColor),
+    ColumnRuleColor,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_IGNORED_WHEN_COLORS_DISABLED,
     "",
     VARIANT_HC,
     nullptr,
     offsetof(nsStyleColumn, mColumnRuleColor),
     eStyleAnimType_ComplexColor)
 CSS_PROP_COLUMN(
-    -moz-column-rule-style,
+    column-rule-style,
     column_rule_style,
-    CSS_PROP_DOMPROP_PREFIXED(ColumnRuleStyle),
+    ColumnRuleStyle,
     CSS_PROPERTY_PARSE_VALUE,
     "",
     VARIANT_HK,
     kBorderStyleKTable,
     CSS_PROP_NO_OFFSET,
     eStyleAnimType_None)
 CSS_PROP_COLUMN(
-    -moz-column-rule-width,
+    column-rule-width,
     column_rule_width,
-    CSS_PROP_DOMPROP_PREFIXED(ColumnRuleWidth),
+    ColumnRuleWidth,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_VALUE_NONNEGATIVE,
     "",
     VARIANT_HKL | VARIANT_CALC,
     kBorderWidthKTable,
     CSS_PROP_NO_OFFSET,
     eStyleAnimType_Custom)
 CSS_PROP_COLUMN(
-    -moz-column-width,
+    column-width,
     column_width,
-    CSS_PROP_DOMPROP_PREFIXED(ColumnWidth),
+    ColumnWidth,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_VALUE_NONNEGATIVE,
     "",
     VARIANT_AHL | VARIANT_CALC,
     nullptr,
     offsetof(nsStyleColumn, mColumnWidth),
     eStyleAnimType_Coord)
 CSS_PROP_SHORTHAND(
-    -moz-columns,
+    columns,
     columns,
-    CSS_PROP_DOMPROP_PREFIXED(Columns),
+    Columns,
     CSS_PROPERTY_PARSE_FUNCTION,
     "")
 CSS_PROP_DISPLAY(
     contain,
     contain,
     Contain,
     CSS_PROPERTY_PARSE_VALUE |
         CSS_PROPERTY_VALUE_PARSER_FUNCTION |
--- a/layout/style/nsComputedDOMStylePropertyList.h
+++ b/layout/style/nsComputedDOMStylePropertyList.h
@@ -100,16 +100,24 @@ COMPUTED_STYLE_PROP(bottom,             
 COMPUTED_STYLE_PROP(box_decoration_break,          BoxDecorationBreak)
 COMPUTED_STYLE_PROP(box_shadow,                    BoxShadow)
 COMPUTED_STYLE_PROP(box_sizing,                    BoxSizing)
 COMPUTED_STYLE_PROP(caption_side,                  CaptionSide)
 COMPUTED_STYLE_PROP(clear,                         Clear)
 COMPUTED_STYLE_PROP(clip,                          Clip)
 COMPUTED_STYLE_PROP(color,                         Color)
 COMPUTED_STYLE_PROP(color_adjust,                  ColorAdjust)
+COMPUTED_STYLE_PROP(column_count,                  ColumnCount)
+COMPUTED_STYLE_PROP(column_fill,                   ColumnFill)
+COMPUTED_STYLE_PROP(column_gap,                    ColumnGap)
+//// COMPUTED_STYLE_PROP(column_rule,              ColumnRule)
+COMPUTED_STYLE_PROP(column_rule_color,             ColumnRuleColor)
+COMPUTED_STYLE_PROP(column_rule_style,             ColumnRuleStyle)
+COMPUTED_STYLE_PROP(column_rule_width,             ColumnRuleWidth)
+COMPUTED_STYLE_PROP(column_width,                  ColumnWidth)
 COMPUTED_STYLE_PROP(contain,                       Contain)
 COMPUTED_STYLE_PROP(content,                       Content)
 COMPUTED_STYLE_PROP(counter_increment,             CounterIncrement)
 COMPUTED_STYLE_PROP(counter_reset,                 CounterReset)
 COMPUTED_STYLE_PROP(cursor,                        Cursor)
 COMPUTED_STYLE_PROP(direction,                     Direction)
 COMPUTED_STYLE_PROP(display,                       Display)
 COMPUTED_STYLE_PROP(empty_cells,                   EmptyCells)
@@ -270,24 +278,16 @@ COMPUTED_STYLE_PROP(border_left_colors, 
 COMPUTED_STYLE_PROP(border_right_colors,           BorderRightColors)
 COMPUTED_STYLE_PROP(border_top_colors,             BorderTopColors)
 COMPUTED_STYLE_PROP(box_align,                     BoxAlign)
 COMPUTED_STYLE_PROP(box_direction,                 BoxDirection)
 COMPUTED_STYLE_PROP(box_flex,                      BoxFlex)
 COMPUTED_STYLE_PROP(box_ordinal_group,             BoxOrdinalGroup)
 COMPUTED_STYLE_PROP(box_orient,                    BoxOrient)
 COMPUTED_STYLE_PROP(box_pack,                      BoxPack)
-COMPUTED_STYLE_PROP(column_count,                  ColumnCount)
-COMPUTED_STYLE_PROP(column_fill,                   ColumnFill)
-COMPUTED_STYLE_PROP(column_gap,                    ColumnGap)
-//// COMPUTED_STYLE_PROP(column_rule,              ColumnRule)
-COMPUTED_STYLE_PROP(column_rule_color,             ColumnRuleColor)
-COMPUTED_STYLE_PROP(column_rule_style,             ColumnRuleStyle)
-COMPUTED_STYLE_PROP(column_rule_width,             ColumnRuleWidth)
-COMPUTED_STYLE_PROP(column_width,                  ColumnWidth)
 COMPUTED_STYLE_PROP(float_edge,                    FloatEdge)
 COMPUTED_STYLE_PROP(force_broken_image_icon,       ForceBrokenImageIcon)
 COMPUTED_STYLE_PROP(image_region,                  ImageRegion)
 COMPUTED_STYLE_PROP(orient,                        Orient)
 COMPUTED_STYLE_PROP(osx_font_smoothing,            OsxFontSmoothing)
 COMPUTED_STYLE_PROP(_moz_outline_radius_bottomLeft, OutlineRadiusBottomLeft)
 COMPUTED_STYLE_PROP(_moz_outline_radius_bottomRight,OutlineRadiusBottomRight)
 COMPUTED_STYLE_PROP(_moz_outline_radius_topLeft,    OutlineRadiusTopLeft)
--- a/layout/style/test/property_database.js
+++ b/layout/style/test/property_database.js
@@ -1378,72 +1378,107 @@ var gCSSProperties = {
   "color-adjust": {
     domProp: "colorAdjust",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     initial_values: [ "economy" ],
     other_values: [ "exact" ],
     invalid_values: []
   },
+  "columns": {
+    domProp: "columns",
+    inherited: false,
+    type: CSS_TYPE_TRUE_SHORTHAND,
+    subproperties: [ "column-count", "column-width" ],
+    initial_values: [ "auto", "auto auto" ],
+    other_values: [ "3", "20px", "2 10px", "10px 2", "2 auto", "auto 2", "auto 50px", "50px auto" ],
+    invalid_values: [ "5%", "-1px", "-1", "3 5", "10px 4px", "10 2px 5in", "30px -1",
+                      "auto 3 5px", "5 auto 20px", "auto auto auto", "calc(50px + rubbish) 2" ]
+  },
   "-moz-columns": {
     domProp: "MozColumns",
     inherited: false,
     type: CSS_TYPE_TRUE_SHORTHAND,
-    subproperties: [ "-moz-column-count", "-moz-column-width" ],
-    initial_values: [ "auto", "auto auto" ],
-    other_values: [ "3", "20px", "2 10px", "10px 2", "2 auto", "auto 2", "auto 50px", "50px auto" ],
-    invalid_values: [ "5%", "-1px", "-1", "3 5", "10px 4px", "10 2px 5in", "30px -1",
-                      "auto 3 5px", "5 auto 20px", "auto auto auto", "calc(50px + rubbish) 2" ]
-  },
-  "-moz-column-count": {
-    domProp: "MozColumnCount",
+    alias_for: "columns",
+    subproperties: [ "column-count", "column-width" ]
+  },
+  "column-count": {
+    domProp: "columnCount",
     inherited: false,
     type: CSS_TYPE_LONGHAND,
     initial_values: [ "auto" ],
     other_values: [ "1", "17" ],
     // negative and zero invalid per editor's draft
     invalid_values: [ "-1", "0", "3px" ]
   },
-        "-moz-column-fill": {
-                domProp: "MozColumnFill",
-                inherited: false,
-                type: CSS_TYPE_LONGHAND,
-                initial_values: [ "balance" ],
-                other_values: [ "auto" ],
-                invalid_values: [ "2px", "dotted", "5em" ]
-        },
-  "-moz-column-gap": {
-    domProp: "MozColumnGap",
+  "-moz-column-count": {
+    domProp: "MozColumnCount",
+    inherited: false,
+    type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+    alias_for: "column-count",
+    subproperties: [ "column-count" ]
+  },
+  "column-fill": {
+    domProp: "columnFill",
+    inherited: false,
+    type: CSS_TYPE_LONGHAND,
+    initial_values: [ "balance" ],
+    other_values: [ "auto" ],
+    invalid_values: [ "2px", "dotted", "5em" ]
+  },
+  "-moz-column-fill": {
+    domProp: "MozColumnFill",
+    inherited: false,
+    type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+    alias_for: "column-fill",
+    subproperties: [ "column-fill" ]
+  },
+  "column-gap": {
+    domProp: "columnGap",
     inherited: false,
     type: CSS_TYPE_LONGHAND,
     initial_values: [ "normal", "1em", "calc(-2em + 3em)" ],
     other_values: [ "2px", "4em",
       "calc(2px)",
       "calc(-2px)",
       "calc(0px)",
       "calc(0pt)",
       "calc(5em)",
       "calc(3*25px)",
       "calc(25px*3)",
       "calc(3*25px + 5em)",
     ],
     invalid_values: [ "3%", "-1px", "4" ]
   },
+  "-moz-column-gap": {
+    domProp: "MozColumnGap",
+    inherited: false,
+    type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+    alias_for: "column-gap",
+    subproperties: [ "column-gap" ]
+  },
+  "column-rule": {
+    domProp: "columnRule",
+    inherited: false,
+    type: CSS_TYPE_TRUE_SHORTHAND,
+    prerequisites: { "color": "green" },
+    subproperties: [ "column-rule-width", "column-rule-style", "column-rule-color" ],
+    initial_values: [ "medium none currentColor", "none", "medium", "currentColor" ],
+    other_values: [ "2px blue solid", "red dotted 1px", "ridge 4px orange", "5px solid" ],
+    invalid_values: [ "2px 3px 4px red", "dotted dashed", "5px dashed green 3px", "5 solid", "5 green solid" ]
+  },
   "-moz-column-rule": {
     domProp: "MozColumnRule",
     inherited: false,
     type: CSS_TYPE_TRUE_SHORTHAND,
-    prerequisites: { "color": "green" },
-    subproperties: [ "-moz-column-rule-width", "-moz-column-rule-style", "-moz-column-rule-color" ],
-    initial_values: [ "medium none currentColor", "none", "medium", "currentColor" ],
-    other_values: [ "2px blue solid", "red dotted 1px", "ridge 4px orange", "5px solid" ],
-    invalid_values: [ "2px 3px 4px red", "dotted dashed", "5px dashed green 3px", "5 solid", "5 green solid" ]
-  },
-  "-moz-column-rule-width": {
-    domProp: "MozColumnRuleWidth",
+    alias_for: "column-rule",
+    subproperties: [ "column-rule-width", "column-rule-style", "column-rule-color" ]
+  },
+  "column-rule-width": {
+    domProp: "columnRuleWidth",
     inherited: false,
     type: CSS_TYPE_LONGHAND,
     prerequisites: { "-moz-column-rule-style": "solid" },
     initial_values: [
       "medium",
       "3px",
       "-moz-calc(3px)",
       "-moz-calc(5em + 3px - 5em)",
@@ -1702,48 +1737,76 @@ var gCSSProperties = {
       "calc(1 * (2em + 0))",
       "calc((2em + 0))",
       "calc((2em + 0) * 1)",
       "calc(1 * (0 + 2em))",
       "calc((0 + 2em))",
       "calc((0 + 2em) * 1)",
     ]
   },
-  "-moz-column-rule-style": {
-    domProp: "MozColumnRuleStyle",
+  "-moz-column-rule-width": {
+    domProp: "MozColumnRuleWidth",
+    inherited: false,
+    type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+    alias_for: "column-rule-width",
+    subproperties: [ "column-rule-width" ]
+  },
+  "column-rule-style": {
+    domProp: "columnRuleStyle",
     inherited: false,
     type: CSS_TYPE_LONGHAND,
     initial_values: [ "none" ],
     other_values: [ "solid", "hidden", "ridge", "groove", "inset", "outset", "double", "dotted", "dashed" ],
     invalid_values: [ "20", "foo" ]
   },
-  "-moz-column-rule-color": {
-    domProp: "MozColumnRuleColor",
+  "-moz-column-rule-style": {
+    domProp: "MozColumnRuleStyle",
+    inherited: false,
+    type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+    alias_for: "column-rule-style",
+    subproperties: [ "column-rule-style" ]
+  },
+  "column-rule-color": {
+    domProp: "columnRuleColor",
     inherited: false,
     type: CSS_TYPE_LONGHAND,
     prerequisites: { "color": "green" },
     initial_values: [ "currentColor" ],
     other_values: [ "red", "blue", "#ffff00" ],
     invalid_values: [ "ffff00" ]
   },
-  "-moz-column-width": {
-    domProp: "MozColumnWidth",
+  "-moz-column-rule-color": {
+    domProp: "MozColumnRuleColor",
+    inherited: false,
+    type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+    alias_for: "column-rule-color",
+    subproperties: [ "column-rule-color" ]
+  },
+  "column-width": {
+    domProp: "columnWidth",
     inherited: false,
     type: CSS_TYPE_LONGHAND,
     initial_values: [ "auto" ],
     other_values: [
       "15px",
       "calc(15px)",
       "calc(30px - 3em)",
       "calc(-15px)",
       "0px",
       "calc(0px)"
     ],
     invalid_values: [ "20", "-1px", "50%" ]
   },
+  "-moz-column-width": {
+    domProp: "MozColumnWidth",
+    inherited: false,
+    type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
+    alias_for: "column-width",
+    subproperties: [ "column-width" ]
+  },
   "-moz-float-edge": {
     domProp: "MozFloatEdge",
     inherited: false,
     type: CSS_TYPE_LONGHAND,
     initial_values: [ "content-box" ],
     other_values: [ "margin-box" ],
     invalid_values: [ "content", "padding", "border", "margin" ]
   },
--- a/layout/style/test/test_transitions_per_property.html
+++ b/layout/style/test/test_transitions_per_property.html
@@ -62,26 +62,26 @@ var supported_properties = {
     "border-bottom-left-radius": [ test_radius_transition ],
     "border-bottom-right-radius": [ test_radius_transition ],
     "border-top-left-radius": [ test_radius_transition ],
     "border-top-right-radius": [ test_radius_transition ],
     "-moz-box-flex": [ test_float_zeroToOne_transition,
                        test_float_aboveOne_transition,
                        test_float_zeroToOne_clamped ],
     "box-shadow": [ test_shadow_transition ],
-    "-moz-column-count": [ test_pos_integer_or_auto_transition,
-                           test_integer_at_least_one_clamping ],
-    "-moz-column-gap": [ test_length_transition,
-                         test_length_clamped ],
-    "-moz-column-rule-color": [ test_color_transition,
-                                test_true_currentcolor_transition ],
-    "-moz-column-rule-width": [ test_length_transition,
-                                test_length_clamped ],
-    "-moz-column-width": [ test_length_transition,
+    "column-count": [ test_pos_integer_or_auto_transition,
+                      test_integer_at_least_one_clamping ],
+    "column-gap": [ test_length_transition,
+                    test_length_clamped ],
+    "column-rule-color": [ test_color_transition,
+                           test_true_currentcolor_transition ],
+    "column-rule-width": [ test_length_transition,
                            test_length_clamped ],
+    "column-width": [ test_length_transition,
+                      test_length_clamped ],
     "-moz-image-region": [ test_rect_transition ],
     "-moz-outline-radius-bottomleft": [ test_radius_transition ],
     "-moz-outline-radius-bottomright": [ test_radius_transition ],
     "-moz-outline-radius-topleft": [ test_radius_transition ],
     "-moz-outline-radius-topright": [ test_radius_transition ],
     "background-color": [ test_color_transition,
                           test_currentcolor_transition ],
     "background-position": [ test_background_position_transition,