Bug 1274096 part 2: Add support for "-webkit-flex" & "-webkit-inline-flex" as spellings of modern flexbox "display" keywords, if webkit prefix support is enabled. r=mats
authorDaniel Holbert <dholbert@cs.stanford.edu>
Mon, 23 May 2016 21:42:36 -0700
changeset 323093 483b17546c5487ac6c96b0659223097ade1cf378
parent 323092 bbd1d5a1fc25172e04103c4f3142f24c3a74685a
child 323094 ca9dfc88461d1a14493a713482a0252f5c4212d2
push id9671
push userraliiev@mozilla.com
push dateMon, 06 Jun 2016 20:27:52 +0000
treeherdermozilla-aurora@cea65ca3d0bd [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersmats
bugs1274096
milestone49.0a1
Bug 1274096 part 2: Add support for "-webkit-flex" & "-webkit-inline-flex" as spellings of modern flexbox "display" keywords, if webkit prefix support is enabled. r=mats MozReview-Commit-ID: 3UKsC1qTz1B
devtools/client/inspector/rules/test/browser_rules_completion-new-property_02.js
layout/base/nsLayoutUtils.cpp
layout/inspector/tests/test_bug877690.html
layout/style/nsCSSKeywordList.h
layout/style/nsCSSProps.cpp
layout/style/test/mochitest.ini
layout/style/test/test_webkit_flex_display.html
--- a/devtools/client/inspector/rules/test/browser_rules_completion-new-property_02.js
+++ b/devtools/client/inspector/rules/test/browser_rules_completion-new-property_02.js
@@ -13,18 +13,18 @@
 //    modifers,
 //    expected input box value after keypress,
 //    selectedIndex of the popup,
 //    total items in the popup,
 //    expect ruleview-changed
 //  ]
 var testData = [
   ["d", {}, "display", 1, 3, false],
-  ["VK_TAB", {}, "", -1, 41, true],
-  ["VK_DOWN", {}, "block", 0, 41, true],
+  ["VK_TAB", {}, "", -1, 43, true],
+  ["VK_DOWN", {}, "block", 0, 43, true],
   ["n", {}, "none", -1, 0, true],
   ["VK_TAB", {shiftKey: true}, "display", -1, 0, true],
   ["VK_BACK_SPACE", {}, "", -1, 0, false],
   ["o", {}, "overflow", 13, 16, false],
   ["u", {}, "outline", 0, 5, false],
   ["VK_DOWN", {}, "outline-color", 1, 5, false],
   ["VK_TAB", {}, "none", -1, 0, true],
   ["r", {}, "rebeccapurple", 0, 6, true],
--- a/layout/base/nsLayoutUtils.cpp
+++ b/layout/base/nsLayoutUtils.cpp
@@ -234,48 +234,72 @@ WebkitPrefixEnabledPrefChangeCallback(co
 {
   MOZ_ASSERT(strncmp(aPrefName, WEBKIT_PREFIXES_ENABLED_PREF_NAME,
                      ArrayLength(WEBKIT_PREFIXES_ENABLED_PREF_NAME)) == 0,
              "We only registered this callback for a single pref, so it "
              "should only be called for that pref");
 
   static int32_t sIndexOfWebkitBoxInDisplayTable;
   static int32_t sIndexOfWebkitInlineBoxInDisplayTable;
-  static bool sAreWebkitBoxKeywordIndicesInitialized; // initialized to false
+  static int32_t sIndexOfWebkitFlexInDisplayTable;
+  static int32_t sIndexOfWebkitInlineFlexInDisplayTable;
+
+  static bool sAreKeywordIndicesInitialized; // initialized to false
 
   bool isWebkitPrefixSupportEnabled =
     Preferences::GetBool(WEBKIT_PREFIXES_ENABLED_PREF_NAME, false);
-  if (!sAreWebkitBoxKeywordIndicesInitialized) {
-    // First run: find the position of "-webkit-box" and "-webkit-inline-box"
-    // in kDisplayKTable.
+  if (!sAreKeywordIndicesInitialized) {
+    // First run: find the position of the keywords in kDisplayKTable.
     sIndexOfWebkitBoxInDisplayTable =
       nsCSSProps::FindIndexOfKeyword(eCSSKeyword__webkit_box,
                                      nsCSSProps::kDisplayKTable);
     MOZ_ASSERT(sIndexOfWebkitBoxInDisplayTable >= 0,
                "Couldn't find -webkit-box in kDisplayKTable");
     sIndexOfWebkitInlineBoxInDisplayTable =
       nsCSSProps::FindIndexOfKeyword(eCSSKeyword__webkit_inline_box,
                                      nsCSSProps::kDisplayKTable);
     MOZ_ASSERT(sIndexOfWebkitInlineBoxInDisplayTable >= 0,
                "Couldn't find -webkit-inline-box in kDisplayKTable");
-    sAreWebkitBoxKeywordIndicesInitialized = true;
-  }
-
-  // OK -- now, stomp on or restore the "-webkit-box" entries in kDisplayKTable,
-  // depending on whether the webkit prefix pref is enabled vs. disabled.
+
+    sIndexOfWebkitFlexInDisplayTable =
+      nsCSSProps::FindIndexOfKeyword(eCSSKeyword__webkit_flex,
+                                     nsCSSProps::kDisplayKTable);
+    MOZ_ASSERT(sIndexOfWebkitFlexInDisplayTable >= 0,
+               "Couldn't find -webkit-flex in kDisplayKTable");
+    sIndexOfWebkitInlineFlexInDisplayTable =
+      nsCSSProps::FindIndexOfKeyword(eCSSKeyword__webkit_inline_flex,
+                                     nsCSSProps::kDisplayKTable);
+    MOZ_ASSERT(sIndexOfWebkitInlineFlexInDisplayTable >= 0,
+               "Couldn't find -webkit-inline-flex in kDisplayKTable");
+    sAreKeywordIndicesInitialized = true;
+  }
+
+  // OK -- now, stomp on or restore the "-webkit-{box|flex}" entries in
+  // kDisplayKTable, depending on whether the webkit prefix pref is enabled
+  // vs. disabled.
   if (sIndexOfWebkitBoxInDisplayTable >= 0) {
     nsCSSProps::kDisplayKTable[sIndexOfWebkitBoxInDisplayTable].mKeyword =
       isWebkitPrefixSupportEnabled ?
       eCSSKeyword__webkit_box : eCSSKeyword_UNKNOWN;
   }
   if (sIndexOfWebkitInlineBoxInDisplayTable >= 0) {
     nsCSSProps::kDisplayKTable[sIndexOfWebkitInlineBoxInDisplayTable].mKeyword =
       isWebkitPrefixSupportEnabled ?
       eCSSKeyword__webkit_inline_box : eCSSKeyword_UNKNOWN;
   }
+  if (sIndexOfWebkitFlexInDisplayTable >= 0) {
+    nsCSSProps::kDisplayKTable[sIndexOfWebkitFlexInDisplayTable].mKeyword =
+      isWebkitPrefixSupportEnabled ?
+      eCSSKeyword__webkit_flex : eCSSKeyword_UNKNOWN;
+  }
+  if (sIndexOfWebkitInlineFlexInDisplayTable >= 0) {
+    nsCSSProps::kDisplayKTable[sIndexOfWebkitInlineFlexInDisplayTable].mKeyword =
+      isWebkitPrefixSupportEnabled ?
+      eCSSKeyword__webkit_inline_flex : eCSSKeyword_UNKNOWN;
+  }
 }
 
 // When the pref "layout.css.display-contents.enabled" changes, this function is
 // invoked to let us update kDisplayKTable, to selectively disable or restore
 // the entries for "contents" in that table.
 static void
 DisplayContentsEnabledPrefChangeCallback(const char* aPrefName, void* aClosure)
 {
--- a/layout/inspector/tests/test_bug877690.html
+++ b/layout/inspector/tests/test_bug877690.html
@@ -165,16 +165,17 @@ function do_test() {
   var prop = "display";
   var values = getCSSValuesForProperty(prop);
   var expected = [ "initial", "inherit", "unset", "none", "inline", "block", "inline-block", "list-item",
       "table", "inline-table", "table-row-group", "table-header-group", "table-footer-group", "table-row",
       "table-column-group", "table-column", "table-cell", "table-caption", "-moz-box", "-moz-inline-box",
       "-moz-grid", "-moz-inline-grid", "-moz-grid-group", "-moz-grid-line", "-moz-stack", "-moz-inline-stack",
       "-moz-deck", "-moz-popup", "-moz-groupbox",
       "flex", "inline-flex", "-webkit-box", "-webkit-inline-box",
+      "-webkit-flex", "-webkit-inline-flex",
       "grid", "inline-grid",
       "ruby", "ruby-base", "ruby-base-container", "ruby-text", "ruby-text-container",
       "contents" ];
   ok(testValues(values, expected), "property display's values.");
 
   // test property
   var prop = "float";
   var values = getCSSValuesForProperty(prop);
--- a/layout/style/nsCSSKeywordList.h
+++ b/layout/style/nsCSSKeywordList.h
@@ -121,17 +121,19 @@ CSS_KEY(-moz-text, _moz_text)
 CSS_KEY(-moz-use-system-font, _moz_use_system_font)
 CSS_KEY(-moz-use-text-color, _moz_use_text_color)
 CSS_KEY(-moz-visitedhyperlinktext, _moz_visitedhyperlinktext)
 CSS_KEY(-moz-window, _moz_window)
 CSS_KEY(-moz-workspace, _moz_workspace)
 CSS_KEY(-moz-zoom-in, _moz_zoom_in)
 CSS_KEY(-moz-zoom-out, _moz_zoom_out)
 CSS_KEY(-webkit-box, _webkit_box)
+CSS_KEY(-webkit-flex, _webkit_flex)
 CSS_KEY(-webkit-inline-box, _webkit_inline_box)
+CSS_KEY(-webkit-inline-flex, _webkit_inline_flex)
 CSS_KEY(absolute, absolute)
 CSS_KEY(active, active)
 CSS_KEY(activeborder, activeborder)
 CSS_KEY(activecaption, activecaption)
 CSS_KEY(add, add)
 CSS_KEY(additive, additive)
 CSS_KEY(alias, alias)
 CSS_KEY(all, all)
--- a/layout/style/nsCSSProps.cpp
+++ b/layout/style/nsCSSProps.cpp
@@ -1279,19 +1279,21 @@ KTableEntry nsCSSProps::kDisplayKTable[]
   { eCSSKeyword_ruby,                NS_STYLE_DISPLAY_RUBY },
   { eCSSKeyword_ruby_base,           NS_STYLE_DISPLAY_RUBY_BASE },
   { eCSSKeyword_ruby_base_container, NS_STYLE_DISPLAY_RUBY_BASE_CONTAINER },
   { eCSSKeyword_ruby_text,           NS_STYLE_DISPLAY_RUBY_TEXT },
   { eCSSKeyword_ruby_text_container, NS_STYLE_DISPLAY_RUBY_TEXT_CONTAINER },
   // The next two entries are controlled by the layout.css.grid.enabled pref.
   { eCSSKeyword_grid,                NS_STYLE_DISPLAY_GRID },
   { eCSSKeyword_inline_grid,         NS_STYLE_DISPLAY_INLINE_GRID },
-  // The next two entries are controlled by the layout.css.prefixes.webkit pref.
+  // The next 4 entries are controlled by the layout.css.prefixes.webkit pref.
   { eCSSKeyword__webkit_box,         NS_STYLE_DISPLAY_WEBKIT_BOX },
   { eCSSKeyword__webkit_inline_box,  NS_STYLE_DISPLAY_WEBKIT_INLINE_BOX },
+  { eCSSKeyword__webkit_flex,        NS_STYLE_DISPLAY_FLEX },
+  { eCSSKeyword__webkit_inline_flex, NS_STYLE_DISPLAY_INLINE_FLEX },
   // The next entry is controlled by the layout.css.display-contents.enabled
   // pref.
   { eCSSKeyword_contents,            NS_STYLE_DISPLAY_CONTENTS },
   { eCSSKeyword_UNKNOWN,             -1 }
 };
 
 const KTableEntry nsCSSProps::kEmptyCellsKTable[] = {
   { eCSSKeyword_show,                 NS_STYLE_TABLE_EMPTY_CELLS_SHOW },
--- a/layout/style/test/mochitest.ini
+++ b/layout/style/test/mochitest.ini
@@ -305,9 +305,10 @@ skip-if = buildapp == 'b2g' || toolkit =
 skip-if = buildapp == 'b2g' || toolkit == 'android' #TIMED_OUT # b2g(bug 870262, :visited support) b2g-debug(bug 870262, :visited support) b2g-desktop(bug 870262, :visited support)
 [test_visited_lying.html]
 skip-if = buildapp == 'b2g' || toolkit == 'android' #TIMED_OUT # b2g(bug 870262, :visited support) b2g-debug(bug 870262, :visited support) b2g-desktop(bug 870262, :visited support)
 [test_visited_pref.html]
 skip-if = buildapp == 'b2g' || toolkit == 'android' #TIMED_OUT # b2g(bug 870262, :visited support) b2g-debug(bug 870262, :visited support) b2g-desktop(bug 870262, :visited support)
 [test_visited_reftests.html]
 skip-if = buildapp == 'b2g' || toolkit == 'android' #TIMED_OUT # b2g(bug 870262, :visited support) b2g-debug(bug 870262, :visited support) b2g-desktop(bug 870262, :visited support)
 [test_webkit_device_pixel_ratio.html]
+[test_webkit_flex_display.html]
 [test_asyncopen2.html]
new file mode 100644
--- /dev/null
+++ b/layout/style/test/test_webkit_flex_display.html
@@ -0,0 +1,48 @@
+<!DOCTYPE HTML>
+<html>
+<!--
+https://bugzilla.mozilla.org/show_bug.cgi?id=1274096
+-->
+<head>
+  <title>Test for Bug 1274096</title>
+  <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
+</head>
+<body>
+<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1274096">Mozilla Bug 1274096</a>
+<div id="content" style="display: none">
+  <div id="testElem"></div>
+</div>
+<script type="text/javascript">
+</script>
+<pre id="test">
+<script class="testbody" type="application/javascript">
+
+/** Test for Bug 1274096 **/
+
+SimpleTest.waitForExplicitFinish();
+SpecialPowers.pushPrefEnv(
+  {"set": [["layout.css.prefixes.webkit", true]]}
+).then(runTest);
+
+function runTest() {
+  testValue("display", "-webkit-flex", "flex");
+  testValue("display", "-webkit-inline-flex", "inline-flex");
+
+  SimpleTest.finish();
+}
+
+function testValue(propName, specifiedVal, serializedVal) {
+  var testElem = document.getElementById("testElem");
+  testElem.style[propName] = specifiedVal;
+
+  is(testElem.style[propName], serializedVal,
+     `CSS '${propName}:${specifiedVal} should serialize as '${serializedVal}'`);
+  is(window.getComputedStyle(testElem, "")[propName], serializedVal,
+     `CSS 'display:${specifiedVal} should compute to '${serializedVal}'`);
+}
+
+</script>
+</pre>
+</body>
+</html>