Diff
Modified: trunk/LayoutTests/ChangeLog (183804 => 183805)
--- trunk/LayoutTests/ChangeLog 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/LayoutTests/ChangeLog 2015-05-05 15:15:38 UTC (rev 183805)
@@ -1,3 +1,18 @@
+2015-05-05 Javier Fernandez <[email protected]>
+
+ [CSS Box Alignment] Upgrade align-content parsing to CSS3 Box Alignment spec
+ https://bugs.webkit.org/show_bug.cgi?id=144443
+
+ Reviewed by Darin Adler.
+
+ Tests to verify the align-content parsing logic. The new Box Alignment spec
+ requires some changes in the flexbox tests.
+
+ * css3/flexbox/css-properties-expected.txt:
+ * css3/flexbox/css-properties.html:
+ * css3/parse-align-content-expected.txt: Added.
+ * css3/parse-align-content.html: Added.
+
2015-05-05 Xabier Rodriguez Calvar <[email protected]> and Youenn Fablet <[email protected]>
streams/readable-stream.html is very flaky
Modified: trunk/LayoutTests/css3/flexbox/css-properties-expected.txt (183804 => 183805)
--- trunk/LayoutTests/css3/flexbox/css-properties-expected.txt 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/LayoutTests/css3/flexbox/css-properties-expected.txt 2015-05-05 15:15:38 UTC (rev 183805)
@@ -16,7 +16,7 @@
PASS flexitem.style.webkitOrder is "0"
PASS flexitem.style.webkitOrder is ""
PASS flexbox.style.webkitJustifyContent is ""
-PASS window.getComputedStyle(flexbox, null).webkitJustifyContent is "flex-start"
+PASS window.getComputedStyle(flexbox, null).webkitJustifyContent is "stretch"
PASS flexbox.style.webkitJustifyContent is ""
PASS flexbox.style.webkitJustifyContent is "flex-start"
PASS window.getComputedStyle(flexbox, null).webkitJustifyContent is "flex-start"
@@ -27,7 +27,7 @@
PASS flexbox.style.webkitJustifyContent is "space-between"
PASS window.getComputedStyle(flexbox, null).webkitJustifyContent is "space-between"
PASS flexbox.style.webkitJustifyContent is ""
-PASS window.getComputedStyle(flexbox, null).webkitJustifyContent is "flex-start"
+PASS window.getComputedStyle(flexbox, null).webkitJustifyContent is "stretch"
PASS flexbox.style.webkitAlignSelf is ""
PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "start"
PASS window.getComputedStyle(document.documentElement, null).webkitAlignSelf is "start"
Modified: trunk/LayoutTests/css3/flexbox/css-properties.html (183804 => 183805)
--- trunk/LayoutTests/css3/flexbox/css-properties.html 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/LayoutTests/css3/flexbox/css-properties.html 2015-05-05 15:15:38 UTC (rev 183805)
@@ -54,8 +54,8 @@
flexbox.style.display = '-webkit-flex';
shouldBeEqualToString('flexbox.style.webkitJustifyContent', '');
-// The initial value is 'flex-start'.
-shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitJustifyContent', 'flex-start');
+// The initial value is 'auto' which, will be resolve to 'stretch' for flexbox containes (behaving like 'flex-start' for the justify-content property).
+shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitJustifyContent', 'stretch');
flexbox.style.webkitJustifyContent = 'foo';
shouldBeEqualToString('flexbox.style.webkitJustifyContent', '');
@@ -78,7 +78,7 @@
flexbox.style.webkitJustifyContent = '';
shouldBeEqualToString('flexbox.style.webkitJustifyContent', '');
-shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitJustifyContent', 'flex-start');
+shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitJustifyContent', 'stretch');
shouldBeEqualToString('flexbox.style.webkitAlignSelf', '');
// The initial value is 'auto', which will be resolved depending on parent's style (except for the 'document' element).
@@ -277,6 +277,8 @@
}
shouldBeFalse('foundFlexFlow');
+flexbox.style.display = '-webkit-flex';
+
// The initial value is 'stretch'.
shouldBeEqualToString('flexbox.style.webkitAlignContent', '');
shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignContent', 'stretch');
Added: trunk/LayoutTests/css3/parse-align-content-expected.txt (0 => 183805)
--- trunk/LayoutTests/css3/parse-align-content-expected.txt (rev 0)
+++ trunk/LayoutTests/css3/parse-align-content-expected.txt 2015-05-05 15:15:38 UTC (rev 183805)
@@ -0,0 +1,142 @@
+Test that setting and getting align-content works as expected
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+Test getting align-content set through CSS
+PASS getComputedStyle(alignContentAuto, '').getPropertyValue('align-content') is "start"
+PASS getComputedStyle(alignContentBaseline, '').getPropertyValue('align-content') is "baseline"
+PASS getComputedStyle(alignContentLastBaseline, '').getPropertyValue('align-content') is "last-baseline"
+PASS getComputedStyle(alignContentSpaceBetween, '').getPropertyValue('align-content') is "space-between"
+PASS getComputedStyle(alignContentSpaceAround, '').getPropertyValue('align-content') is "space-around"
+PASS getComputedStyle(alignContentSpaceEvenly, '').getPropertyValue('align-content') is "space-evenly"
+PASS getComputedStyle(alignContentStretch, '').getPropertyValue('align-content') is "stretch"
+PASS getComputedStyle(alignContentStart, '').getPropertyValue('align-content') is "start"
+PASS getComputedStyle(alignContentEnd, '').getPropertyValue('align-content') is "end"
+PASS getComputedStyle(alignContentCenter, '').getPropertyValue('align-content') is "center"
+PASS getComputedStyle(alignContentLeft, '').getPropertyValue('align-content') is "left"
+PASS getComputedStyle(alignContentRight, '').getPropertyValue('align-content') is "right"
+PASS getComputedStyle(alignContentFlexStart, '').getPropertyValue('align-content') is "flex-start"
+PASS getComputedStyle(alignContentFlexEnd, '').getPropertyValue('align-content') is "flex-end"
+PASS getComputedStyle(alignContentEndTrue, '').getPropertyValue('align-content') is "end true"
+PASS getComputedStyle(alignContentCenterTrue, '').getPropertyValue('align-content') is "center true"
+PASS getComputedStyle(alignContentRightSafe, '').getPropertyValue('align-content') is "right safe"
+PASS getComputedStyle(alignContentLeftTrue, '').getPropertyValue('align-content') is "left true"
+PASS getComputedStyle(alignContentFlexStartTrue, '').getPropertyValue('align-content') is "flex-start true"
+PASS getComputedStyle(alignContentFlexEndSafe, '').getPropertyValue('align-content') is "flex-end safe"
+PASS getComputedStyle(alignContentSpaceBetweenLeft, '').getPropertyValue('align-content') is "space-between left"
+PASS getComputedStyle(alignContentSpaceAroundCenter, '').getPropertyValue('align-content') is "space-around center"
+PASS getComputedStyle(alignContentSpaceEvenlyRight, '').getPropertyValue('align-content') is "space-evenly right"
+PASS getComputedStyle(alignContentStretchStartSafe, '').getPropertyValue('align-content') is "stretch start safe"
+PASS getComputedStyle(alignContentSpaceAroundEndTrue, '').getPropertyValue('align-content') is "space-around end true"
+PASS getComputedStyle(alignContentSpaceEvenlyFlexStartSafe, '').getPropertyValue('align-content') is "space-evenly flex-start safe"
+PASS getComputedStyle(alignContentSpaceBetweenSafe, '').getPropertyValue('align-content') is "start"
+PASS getComputedStyle(alignContentSpaceBetweenStretch, '').getPropertyValue('align-content') is "start"
+PASS getComputedStyle(alignContentSafe, '').getPropertyValue('align-content') is "start"
+PASS getComputedStyle(alignContentRightSafeTrue, '').getPropertyValue('align-content') is "start"
+PASS getComputedStyle(alignContentCenterLeft, '').getPropertyValue('align-content') is "start"
+
+Test initial value of align-content through JS
+PASS getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+
+Test getting and setting align-content through JS
+PASS element.style.alignContent is "center"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "center"
+PASS element.style.alignContent is "start true"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start true"
+PASS element.style.alignContent is "flex-end safe"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "flex-end safe"
+PASS element.style.alignContent is "space-between right safe"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "space-between right safe"
+PASS element.style.alignContent is "stretch center"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "stretch center"
+PASS element.style.alignContent is "right true"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "right true"
+PASS element.style.alignContent is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "stretch"
+PASS element.style.alignContent is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is "flex-end"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "flex-end"
+
+Test bad combinations of align-content
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+PASS element.style.alignContent is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+
+Test the value 'initial'
+PASS element.style.alignContent is "stretch center"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "stretch center"
+PASS element.style.alignContent is "initial"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+
+Test the value 'initial' for grid containers
+PASS element.style.alignContent is "space-between left"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "space-between left"
+PASS element.style.alignContent is "initial"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "start"
+
+Test the value 'initial' for flex containers
+PASS element.style.alignContent is "right true"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "right true"
+PASS element.style.alignContent is "initial"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "stretch"
+
+Test the value 'inherit'
+PASS element.style.alignContent is "end"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "end"
+PASS element.style.alignContent is "inherit"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "end"
+PASS element.style.alignContent is "left safe"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "left safe"
+PASS element.style.alignContent is "inherit"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "left safe"
+PASS element.style.alignContent is "stretch center"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "stretch center"
+PASS element.style.alignContent is "inherit"
+PASS window.getComputedStyle(element, '').getPropertyValue('align-content') is "stretch center"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
Added: trunk/LayoutTests/css3/parse-align-content.html (0 => 183805)
--- trunk/LayoutTests/css3/parse-align-content.html (rev 0)
+++ trunk/LayoutTests/css3/parse-align-content.html 2015-05-05 15:15:38 UTC (rev 183805)
@@ -0,0 +1,360 @@
+<!DOCTYPE html>
+<html>
+<head>
+<style>
+#alignContentAuto {
+ align-content: auto;
+}
+
+#alignContentBaseline {
+ align-content: baseline;
+}
+
+#alignContentLastBaseline {
+ align-content: last-baseline;
+}
+
+#alignContentSpaceBetween {
+ align-content: space-between;
+}
+
+#alignContentSpaceAround {
+ align-content: space-around;
+}
+
+#alignContentSpaceEvenly {
+ align-content: space-evenly;
+}
+
+#alignContentStretch {
+ align-content: stretch;
+}
+
+#alignContentStart {
+ align-content: start;
+}
+
+#alignContentEnd {
+ align-content: end;
+}
+
+#alignContentCenter {
+ align-content: center;
+}
+
+#alignContentLeft {
+ align-content: left;
+}
+
+#alignContentRight {
+ align-content: right;
+}
+
+#alignContentFlexStart {
+ align-content: flex-start;
+}
+
+#alignContentFlexEnd {
+ align-content: flex-end;
+}
+
+#alignContentEndTrue {
+ align-content: end true;
+}
+
+#alignContentCenterTrue {
+ align-content: center true;
+}
+
+#alignContentRightSafe {
+ align-content: right safe;
+}
+
+#alignContentLeftTrue {
+ align-content: left true;
+}
+
+#alignContentFlexStartTrue {
+ align-content: flex-start true;
+}
+
+#alignContentFlexEndSafe {
+ align-content: flex-end safe;
+}
+
+#alignContentSpaceBetweenLeft {
+ align-content: space-between left;
+}
+
+#alignContentSpaceAroundCenter {
+ align-content: space-around center;
+}
+
+#alignContentSpaceEvenlyRight {
+ align-content: space-evenly right;
+}
+
+#alignContentStretchStartSafe {
+ align-content: stretch start safe;
+}
+
+#alignContentSpaceAroundEndTrue {
+ align-content: space-around end true;
+}
+
+#alignContentSpaceEvenlyFlexStartSafe {
+ align-content: space-evenly flex-start safe;
+}
+
+<!-- Invalid CSS cases -->
+#alignContentSpaceBetweenSafe {
+ align-content: space-between safe;
+}
+
+#alignContentSpaceBetweenStretch {
+ align-content: space-between stretch;
+}
+
+#alignContentSafe {
+ align-content: safe;
+}
+
+#alignContentRightSafeTrue {
+ align-content: right safe true;
+}
+
+#alignContentCenterLeft {
+ align-content: center left;
+}
+</style>
+<script src=""
+</head>
+<body>
+<div id="alignContentAuto"></div>
+<div id="alignContentBaseline"></div>
+<div id="alignContentLastBaseline"></div>
+<div id="alignContentSpaceBetween"></div>
+<div id="alignContentSpaceAround"></div>
+<div id="alignContentSpaceEvenly"></div>
+<div id="alignContentStretch"></div>
+<div id="alignContentSpaceBetweenSafe"></div>
+<div id="alignContentSpaceAroundTrue"></div>
+<div id="alignContentStretchTrue"></div>
+<div id="alignContentStretchrue"></div>
+<div id="alignContentStart"></div>
+<div id="alignContentEnd"></div>
+<div id="alignContentCenter"></div>
+<div id="alignContentLeft"></div>
+<div id="alignContentRight"></div>
+<div id="alignContentFlexStart"></div>
+<div id="alignContentFlexEnd"></div>
+<div id="alignContentEndTrue"></div>
+<div id="alignContentCenterTrue"></div>
+<div id="alignContentRightSafe"></div>
+<div id="alignContentLeftTrue"></div>
+<div id="alignContentFlexStartTrue"></div>
+<div id="alignContentFlexEndSafe"></div>
+<div id="alignContentSpaceBetweenLeft"></div>
+<div id="alignContentSpaceAroundCenter"></div>
+<div id="alignContentSpaceEvenlyRight"></div>
+<div id="alignContentStretchStartSafe"></div>
+<div id="alignContentSpaceAroundEndTrue"></div>
+<div id="alignContentSpaceEvenlyFlexStartSafe"></div>
+
+<div id="alignContentSpaceBetweenSafe"></div>
+<div id="alignContentSpaceBetweenStretch"></div>
+<div id="alignContentSafe"></div>
+<div id="alignContentRightSafeTrue"></div>
+<div id="alignContentCenterLeft"></div>
+
+<script src=""
+<script>
+description('Test that setting and getting align-content works as expected');
+
+debug("Test getting align-content set through CSS");
+var alignContentAuto = document.getElementById("alignContentAuto");
+shouldBeEqualToString("getComputedStyle(alignContentAuto, '').getPropertyValue('align-content')", "start");
+
+var alignContentBaseline = document.getElementById("alignContentBaseline");
+shouldBeEqualToString("getComputedStyle(alignContentBaseline, '').getPropertyValue('align-content')", "baseline");
+
+var alignContentLastBaseline = document.getElementById("alignContentLastBaseline");
+shouldBeEqualToString("getComputedStyle(alignContentLastBaseline, '').getPropertyValue('align-content')", "last-baseline");
+
+var alignContentSpaceBetween = document.getElementById("alignContentSpaceBetween");
+shouldBeEqualToString("getComputedStyle(alignContentSpaceBetween, '').getPropertyValue('align-content')", "space-between");
+
+var alignContentSpaceAround = document.getElementById("alignContentSpaceAround");
+shouldBeEqualToString("getComputedStyle(alignContentSpaceAround, '').getPropertyValue('align-content')", "space-around");
+
+var alignContentSpaceEvenly = document.getElementById("alignContentSpaceEvenly");
+shouldBeEqualToString("getComputedStyle(alignContentSpaceEvenly, '').getPropertyValue('align-content')", "space-evenly");
+
+var alignContentStretch = document.getElementById("alignContentStretch");
+shouldBeEqualToString("getComputedStyle(alignContentStretch, '').getPropertyValue('align-content')", "stretch");
+
+var alignContentStart = document.getElementById("alignContentStart");
+shouldBeEqualToString("getComputedStyle(alignContentStart, '').getPropertyValue('align-content')", "start");
+
+var alignContentEnd = document.getElementById("alignContentEnd");
+shouldBeEqualToString("getComputedStyle(alignContentEnd, '').getPropertyValue('align-content')", "end");
+
+var alignContentCenter = document.getElementById("alignContentCenter");
+shouldBeEqualToString("getComputedStyle(alignContentCenter, '').getPropertyValue('align-content')", "center");
+
+var alignContentLeft = document.getElementById("alignContentLeft");
+shouldBeEqualToString("getComputedStyle(alignContentLeft, '').getPropertyValue('align-content')", "left");
+
+var alignContentRight = document.getElementById("alignContentRight");
+shouldBeEqualToString("getComputedStyle(alignContentRight, '').getPropertyValue('align-content')", "right");
+
+var alignContentFlexStart = document.getElementById("alignContentFlexStart");
+shouldBeEqualToString("getComputedStyle(alignContentFlexStart, '').getPropertyValue('align-content')", "flex-start");
+
+var alignContentFlexEnd = document.getElementById("alignContentFlexEnd");
+shouldBeEqualToString("getComputedStyle(alignContentFlexEnd, '').getPropertyValue('align-content')", "flex-end");
+
+var alignContentEndTrue = document.getElementById("alignContentEndTrue");
+shouldBeEqualToString("getComputedStyle(alignContentEndTrue, '').getPropertyValue('align-content')", "end true");
+
+var alignContentCenterTrue = document.getElementById("alignContentCenterTrue");
+shouldBeEqualToString("getComputedStyle(alignContentCenterTrue, '').getPropertyValue('align-content')", "center true");
+
+var alignContentRightSafe = document.getElementById("alignContentRightSafe");
+shouldBeEqualToString("getComputedStyle(alignContentRightSafe, '').getPropertyValue('align-content')", "right safe");
+
+var alignContentLeftTrue = document.getElementById("alignContentLeftTrue");
+shouldBeEqualToString("getComputedStyle(alignContentLeftTrue, '').getPropertyValue('align-content')", "left true");
+
+var alignContentFlexStartTrue = document.getElementById("alignContentFlexStartTrue");
+shouldBeEqualToString("getComputedStyle(alignContentFlexStartTrue, '').getPropertyValue('align-content')", "flex-start true");
+
+var alignContentFlexEndSafe = document.getElementById("alignContentFlexEndSafe");
+shouldBeEqualToString("getComputedStyle(alignContentFlexEndSafe, '').getPropertyValue('align-content')", "flex-end safe");
+
+var alignContentSpaceBetweenLeft = document.getElementById("alignContentSpaceBetweenLeft");
+shouldBeEqualToString("getComputedStyle(alignContentSpaceBetweenLeft, '').getPropertyValue('align-content')", "space-between left");
+
+var alignContentSpaceAroundCenter = document.getElementById("alignContentSpaceAroundCenter");
+shouldBeEqualToString("getComputedStyle(alignContentSpaceAroundCenter, '').getPropertyValue('align-content')", "space-around center");
+
+var alignContentSpaceEvenlyRight = document.getElementById("alignContentSpaceEvenlyRight");
+shouldBeEqualToString("getComputedStyle(alignContentSpaceEvenlyRight, '').getPropertyValue('align-content')", "space-evenly right");
+
+var alignContentStretchStartSafe = document.getElementById("alignContentStretchStartSafe");
+shouldBeEqualToString("getComputedStyle(alignContentStretchStartSafe, '').getPropertyValue('align-content')", "stretch start safe");
+
+var alignContentSpaceAroundEndTrue = document.getElementById("alignContentSpaceAroundEndTrue");
+shouldBeEqualToString("getComputedStyle(alignContentSpaceAroundEndTrue, '').getPropertyValue('align-content')", "space-around end true");
+
+var alignContentSpaceEvenlyFlexStartSafe = document.getElementById("alignContentSpaceEvenlyFlexStartSafe");
+shouldBeEqualToString("getComputedStyle(alignContentSpaceEvenlyFlexStartSafe, '').getPropertyValue('align-content')", "space-evenly flex-start safe");
+
+var alignContentSpaceBetweenSafe = document.getElementById("alignContentSpaceBetweenSafe");
+shouldBeEqualToString("getComputedStyle(alignContentSpaceBetweenSafe, '').getPropertyValue('align-content')", "start");
+
+var alignContentSpaceAroundTrue = document.getElementById("alignContentSpaceBetweenStretch");
+shouldBeEqualToString("getComputedStyle(alignContentSpaceBetweenStretch, '').getPropertyValue('align-content')", "start");
+
+var alignContentSpaceAroundTrue = document.getElementById("alignContentSafe");
+shouldBeEqualToString("getComputedStyle(alignContentSafe, '').getPropertyValue('align-content')", "start");
+
+var alignContentSpaceAroundTrue = document.getElementById("alignContentRightSafeTrue");
+shouldBeEqualToString("getComputedStyle(alignContentRightSafeTrue, '').getPropertyValue('align-content')", "start");
+
+var alignContentSpaceAroundTrue = document.getElementById("alignContentCenterLeft");
+shouldBeEqualToString("getComputedStyle(alignContentCenterLeft, '').getPropertyValue('align-content')", "start");
+
+debug("");
+debug("Test initial value of align-content through JS");
+element = document.createElement("div");
+document.body.appendChild(element);
+shouldBeEqualToString("getComputedStyle(element, '').getPropertyValue('align-content')", "start");
+
+debug("");
+debug("Test getting and setting align-content through JS");
+element = document.createElement("div");
+document.body.appendChild(element);
+element.style.alignContent = "center";
+checkValues(element, "alignContent", "align-content", "center", "center");
+
+element.style.alignContent = "true start";
+checkValues(element, "alignContent", "align-content", "start true", "start true");
+
+element.style.alignContent = "flex-end safe";
+checkValues(element, "alignContent", "align-content", "flex-end safe", "flex-end safe");
+
+element.style.alignContent = "space-between right safe";
+checkValues(element, "alignContent", "align-content", "space-between right safe", "space-between right safe");
+
+element.style.alignContent = "stretch center";
+checkValues(element, "alignContent", "align-content", "stretch center", "stretch center");
+
+element.style.alignContent = "right true";
+checkValues(element, "alignContent", "align-content", "right true", "right true");
+
+element.style.alignContent = "auto";
+checkValues(element, "alignContent", "align-content", "auto", "start");
+
+element.style.display = "-webkit-flex";
+element.style.alignContent = "auto";
+checkValues(element, "alignContent", "align-content", "auto", "stretch");
+
+element.style.display = "-webkit-grid";
+element.style.alignContent = "auto";
+checkValues(element, "alignContent", "align-content", "auto", "start");
+
+element.style.alignContent = "flex-end";
+checkValues(element, "alignContent", "align-content", "flex-end", "flex-end");
+
+debug("");
+debug("Test bad combinations of align-content");
+element = document.createElement("div");
+document.body.appendChild(element);
+
+checkBadValues(element, "alignContent", "align-content", "");
+checkBadValues(element, "alignContent", "align-content", "true auto");
+checkBadValues(element, "alignContent", "align-content", "auto safe");
+checkBadValues(element, "alignContent", "align-content", "auto left");
+checkBadValues(element, "alignContent", "align-content", "baseline safe");
+checkBadValues(element, "alignContent", "align-content", "last baseline center");
+checkBadValues(element, "alignContent", "align-content", "true true");
+checkBadValues(element, "alignContent", "align-content", "true safe");
+checkBadValues(element, "alignContent", "align-content", "center start");
+checkBadValues(element, "alignContent", "align-content", "baseline safe");
+checkBadValues(element, "alignContent", "align-content", "true baseline");
+checkBadValues(element, "alignContent", "align-content", "true safe left");
+checkBadValues(element, "alignContent", "align-content", "true left safe");
+checkBadValues(element, "alignContent", "align-content", "left safe true safe");
+checkBadValues(element, "alignContent", "align-content", "start right space-between");
+checkBadValues(element, "alignContent", "align-content", "safe stretch");
+checkBadValues(element, "alignContent", "align-content", "space-around stretch");
+checkBadValues(element, "alignContent", "align-content", "end space-between start");
+checkBadValues(element, "alignContent", "align-content", "right safe left");
+checkBadValues(element, "alignContent", "align-content", "true");
+checkBadValues(element, "alignContent", "align-content", "safe");
+
+debug("");
+debug("Test the value 'initial'");
+element.style.display = "";
+checkInitialValues(element, "alignContent", "align-content", "stretch center", "start");
+
+debug("");
+debug("Test the value 'initial' for grid containers");
+element.style.display = "-webkit-grid";
+checkInitialValues(element, "alignContent", "align-content", "space-between left", "start");
+
+debug("");
+debug("Test the value 'initial' for flex containers");
+element.style.display = "-webkit-flex";
+checkInitialValues(element, "alignContent", "align-content", "right true", "stretch");
+
+debug("");
+debug("Test the value 'inherit'");
+checkInheritValues("alignContent", "align-content", "end");
+checkInheritValues("alignContent", "align-content", "left safe");
+checkInheritValues("alignContent", "align-content", "stretch center");
+
+</script>
+</body>
+</html>
Modified: trunk/LayoutTests/css3/parse-justify-content-expected.txt (183804 => 183805)
--- trunk/LayoutTests/css3/parse-justify-content-expected.txt 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/LayoutTests/css3/parse-justify-content-expected.txt 2015-05-05 15:15:38 UTC (rev 183805)
@@ -55,7 +55,7 @@
PASS element.style.justifyContent is "auto"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "start"
PASS element.style.justifyContent is "auto"
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "flex-start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "stretch"
PASS element.style.justifyContent is "auto"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "start"
PASS element.style.justifyContent is "flex-end"
@@ -121,7 +121,7 @@
PASS element.style.justifyContent is "right true"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "right true"
PASS element.style.justifyContent is "initial"
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "flex-start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "stretch"
Test the value 'inherit'
PASS element.style.justifyContent is "end"
Modified: trunk/LayoutTests/css3/parse-justify-content.html (183804 => 183805)
--- trunk/LayoutTests/css3/parse-justify-content.html 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/LayoutTests/css3/parse-justify-content.html 2015-05-05 15:15:38 UTC (rev 183805)
@@ -294,7 +294,7 @@
element.style.display = "-webkit-flex";
element.style.justifyContent = "auto";
-checkValues(element, "justifyContent", "justify-content", "auto", "flex-start");
+checkValues(element, "justifyContent", "justify-content", "auto", "stretch");
element.style.display = "-webkit-grid";
element.style.justifyContent = "auto";
@@ -343,7 +343,7 @@
debug("");
debug("Test the value 'initial' for flex containers");
element.style.display = "-webkit-flex";
-checkInitialValues(element, "justifyContent", "justify-content", "right true", "flex-start");
+checkInitialValues(element, "justifyContent", "justify-content", "right true", "stretch");
debug("");
debug("Test the value 'inherit'");
Modified: trunk/LayoutTests/fast/css/getComputedStyle/computed-style-expected.txt (183804 => 183805)
--- trunk/LayoutTests/fast/css/getComputedStyle/computed-style-expected.txt 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/LayoutTests/fast/css/getComputedStyle/computed-style-expected.txt 2015-05-05 15:15:38 UTC (rev 183805)
@@ -146,7 +146,7 @@
column-rule-width: 0px;
column-span: none;
column-width: auto;
-align-content: stretch;
+align-content: start;
align-items: start;
align-self: start;
flex-direction: row;
Modified: trunk/LayoutTests/fast/css/getComputedStyle/computed-style-without-renderer-expected.txt (183804 => 183805)
--- trunk/LayoutTests/fast/css/getComputedStyle/computed-style-without-renderer-expected.txt 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/LayoutTests/fast/css/getComputedStyle/computed-style-without-renderer-expected.txt 2015-05-05 15:15:38 UTC (rev 183805)
@@ -145,7 +145,7 @@
column-rule-width: 0px
column-span: none
column-width: auto
-align-content: stretch
+align-content: auto
align-items: auto
align-self: auto
flex-direction: row
Modified: trunk/LayoutTests/svg/css/getComputedStyle-basic-expected.txt (183804 => 183805)
--- trunk/LayoutTests/svg/css/getComputedStyle-basic-expected.txt 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/LayoutTests/svg/css/getComputedStyle-basic-expected.txt 2015-05-05 15:15:38 UTC (rev 183805)
@@ -290,8 +290,8 @@
rect: style.getPropertyCSSValue(column-span) : [object CSSPrimitiveValue]
rect: style.getPropertyValue(column-width) : auto
rect: style.getPropertyCSSValue(column-width) : [object CSSPrimitiveValue]
-rect: style.getPropertyValue(align-content) : stretch
-rect: style.getPropertyCSSValue(align-content) : [object CSSPrimitiveValue]
+rect: style.getPropertyValue(align-content) : start
+rect: style.getPropertyCSSValue(align-content) : [object CSSValueList]
rect: style.getPropertyValue(align-items) : start
rect: style.getPropertyCSSValue(align-items) : [object CSSValueList]
rect: style.getPropertyValue(align-self) : start
@@ -808,8 +808,8 @@
g: style.getPropertyCSSValue(column-span) : [object CSSPrimitiveValue]
g: style.getPropertyValue(column-width) : auto
g: style.getPropertyCSSValue(column-width) : [object CSSPrimitiveValue]
-g: style.getPropertyValue(align-content) : stretch
-g: style.getPropertyCSSValue(align-content) : [object CSSPrimitiveValue]
+g: style.getPropertyValue(align-content) : start
+g: style.getPropertyCSSValue(align-content) : [object CSSValueList]
g: style.getPropertyValue(align-items) : start
g: style.getPropertyCSSValue(align-items) : [object CSSValueList]
g: style.getPropertyValue(align-self) : start
Modified: trunk/Source/WebCore/ChangeLog (183804 => 183805)
--- trunk/Source/WebCore/ChangeLog 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/Source/WebCore/ChangeLog 2015-05-05 15:15:38 UTC (rev 183805)
@@ -1,3 +1,40 @@
+2015-05-05 Javier Fernandez <[email protected]>
+
+ [CSS Box Alignment] Upgrade align-content parsing to CSS3 Box Alignment spec
+ https://bugs.webkit.org/show_bug.cgi?id=144443
+
+ Reviewed by Darin Adler.
+
+ Upgrade the align-content property to the last CSS3 Box
+ Alignment specification. As it uses a different enumeration for
+ Positional and Distribution alignment, it implies some changes in
+ the FlexibleBox implementation.
+
+ Test: css3/parse-align-content.html
+
+ * css/CSSComputedStyleDeclaration.cpp:
+ (WebCore::resolveContentAlignmentAuto):
+ (WebCore::ComputedStyleExtractor::propertyValue):
+ * css/CSSParser.cpp:
+ (WebCore::isValidKeywordPropertyAndValue):
+ (WebCore::isKeywordPropertyID):
+ (WebCore::CSSParser::parseValue):
+ * css/CSSPropertyNames.in:
+ * rendering/RenderFlexibleBox.cpp:
+ (WebCore::RenderFlexibleBox::layoutAndPlaceChildren):
+ (WebCore::RenderFlexibleBox::layoutColumnReverse):
+ (WebCore::initialAlignContentOffset):
+ (WebCore::alignContentSpaceBetweenChildren):
+ (WebCore::RenderFlexibleBox::alignFlexLines):
+ * rendering/style/RenderStyle.cpp:
+ (WebCore::RenderStyle::resolveContentAlignment):
+ (WebCore::RenderStyle::resolveContentJustification):
+ * rendering/style/RenderStyle.h:
+ * rendering/style/StyleRareNonInheritedData.cpp:
+ (WebCore::StyleRareNonInheritedData::StyleRareNonInheritedData):
+ (WebCore::StyleRareNonInheritedData::operator==):
+ * rendering/style/StyleRareNonInheritedData.h:
+
2015-05-05 Xabier Rodriguez Calvar <[email protected]> and Youenn Fablet <[email protected]>
streams/readable-stream.html is very flaky
Modified: trunk/Source/WebCore/css/CSSComputedStyleDeclaration.cpp (183804 => 183805)
--- trunk/Source/WebCore/css/CSSComputedStyleDeclaration.cpp 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/Source/WebCore/css/CSSComputedStyleDeclaration.cpp 2015-05-05 15:15:38 UTC (rev 183805)
@@ -1733,12 +1733,17 @@
return resolveContainerAlignmentAuto(parent->style().alignItemsPosition(), parent);
}
-static ContentPosition resolveContentAlignmentAuto(ContentPosition position, ContentDistributionType distribution, RenderObject* element)
+static void resolveContentAlignmentAuto(ContentPosition& position, ContentDistributionType& distribution, RenderObject* element)
{
if (position != ContentPositionAuto || distribution != ContentDistributionDefault || !element)
- return position;
+ return;
- return element->style().isDisplayFlexibleBox() ? ContentPositionFlexStart : ContentPositionStart;
+ // Even that both align-content and justify-content 'auto' values are resolved to 'stretch'
+ // in case of flexbox containers, 'stretch' value in justify-content will behave like 'flex-start'.
+ if (element->style().isDisplayFlexibleBox())
+ distribution = ContentDistributionStretch;
+ else
+ position = ContentPositionStart;
}
PassRefPtr<CSSValue> CSSComputedStyleDeclaration::getPropertyCSSValue(CSSPropertyID propertyID, EUpdateLayout updateLayout) const
@@ -2207,8 +2212,12 @@
return cssValuePool().createValue(style->display());
case CSSPropertyEmptyCells:
return cssValuePool().createValue(style->emptyCells());
- case CSSPropertyAlignContent:
- return cssValuePool().createValue(style->alignContent());
+ case CSSPropertyAlignContent: {
+ ContentPosition position = style->alignContentPosition();
+ ContentDistributionType distribution = style->alignContentDistribution();
+ resolveContentAlignmentAuto(position, distribution, renderer);
+ return valueForContentPositionAndDistributionWithOverflowAlignment(position, distribution, style->alignContentOverflowAlignment());
+ }
case CSSPropertyAlignItems:
return valueForItemPositionWithOverflowAlignment(resolveContainerAlignmentAuto(style->alignItemsPosition(), renderer), style->alignItemsOverflowAlignment(), NonLegacyPosition);
case CSSPropertyAlignSelf: {
@@ -2230,8 +2239,12 @@
return cssValuePool().createValue(style->flexShrink());
case CSSPropertyFlexWrap:
return cssValuePool().createValue(style->flexWrap());
- case CSSPropertyJustifyContent:
- return valueForContentPositionAndDistributionWithOverflowAlignment(resolveContentAlignmentAuto(style->justifyContentPosition(), style->justifyContentDistribution(), renderer), style->justifyContentDistribution(), style->justifyContentOverflowAlignment());
+ case CSSPropertyJustifyContent: {
+ ContentPosition position = style->justifyContentPosition();
+ ContentDistributionType distribution = style->justifyContentDistribution();
+ resolveContentAlignmentAuto(position, distribution, renderer);
+ return valueForContentPositionAndDistributionWithOverflowAlignment(position, distribution, style->justifyContentOverflowAlignment());
+ }
case CSSPropertyJustifyItems:
return valueForItemPositionWithOverflowAlignment(resolveContainerAlignmentAuto(style->justifyItemsPosition(), renderer), style->justifyItemsOverflowAlignment(), style->justifyItemsPositionType());
case CSSPropertyJustifySelf: {
Modified: trunk/Source/WebCore/css/CSSParser.cpp (183804 => 183805)
--- trunk/Source/WebCore/css/CSSParser.cpp 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/Source/WebCore/css/CSSParser.cpp 2015-05-05 15:15:38 UTC (rev 183805)
@@ -880,11 +880,6 @@
if (valueID == CSSValueAuto || valueID == CSSValueBalance)
return true;
break;
- case CSSPropertyAlignContent:
- // FIXME: Per CSS alignment, this property should accept an optional <overflow-position>. We should share this parsing code with 'justify-self'.
- if (valueID == CSSValueFlexStart || valueID == CSSValueFlexEnd || valueID == CSSValueCenter || valueID == CSSValueSpaceBetween || valueID == CSSValueSpaceAround || valueID == CSSValueStretch)
- return true;
- break;
case CSSPropertyFlexDirection:
if (valueID == CSSValueRow || valueID == CSSValueRowReverse || valueID == CSSValueColumn || valueID == CSSValueColumnReverse)
return true;
@@ -1121,7 +1116,6 @@
case CSSPropertyWebkitColumnBreakInside:
case CSSPropertyColumnFill:
case CSSPropertyColumnRuleStyle:
- case CSSPropertyAlignContent:
case CSSPropertyFlexDirection:
case CSSPropertyFlexWrap:
case CSSPropertyWebkitFontKerning:
@@ -3043,6 +3037,9 @@
parsedValue = parseImageResolution();
break;
#endif
+ case CSSPropertyAlignContent:
+ parsedValue = parseContentDistributionOverflowPosition();
+ break;
case CSSPropertyAlignSelf:
return parseItemPositionOverflowPosition(propId, important);
@@ -3108,7 +3105,6 @@
case CSSPropertyWebkitColumnBreakInside:
case CSSPropertyColumnFill:
case CSSPropertyColumnRuleStyle:
- case CSSPropertyAlignContent:
case CSSPropertyFlexDirection:
case CSSPropertyFlexWrap:
case CSSPropertyWebkitFontKerning:
Modified: trunk/Source/WebCore/css/CSSPropertyNames.in (183804 => 183805)
--- trunk/Source/WebCore/css/CSSPropertyNames.in 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/Source/WebCore/css/CSSPropertyNames.in 2015-05-05 15:15:38 UTC (rev 183805)
@@ -453,7 +453,7 @@
isolation
#endif
-webkit-filter [ConditionalConverter=FilterOperations]
-align-content
+align-content [Initial=initialContentAlignment, Converter=ContentAlignmentData]
-webkit-align-content = align-content
align-items [Initial=initialSelfAlignment, Converter=SelfOrDefaultAlignmentData]
-webkit-align-items = align-items
Modified: trunk/Source/WebCore/rendering/RenderFlexibleBox.cpp (183804 => 183805)
--- trunk/Source/WebCore/rendering/RenderFlexibleBox.cpp 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/Source/WebCore/rendering/RenderFlexibleBox.cpp 2015-05-05 15:15:38 UTC (rev 183805)
@@ -1057,10 +1057,14 @@
{
ASSERT(childSizes.size() == children.size());
+ ContentPosition position = style().justifyContentPosition();
+ ContentDistributionType distribution = style().justifyContentDistribution();
+ RenderStyle::resolveContentJustification(style(), position);
+
size_t numberOfChildrenForJustifyContent = numberOfInFlowPositionedChildren(children);
LayoutUnit autoMarginOffset = autoMarginOffsetInMainAxis(children, availableFreeSpace);
LayoutUnit mainAxisOffset = flowAwareBorderStart() + flowAwarePaddingStart();
- mainAxisOffset += initialJustifyContentOffset(availableFreeSpace, style().justifyContentPosition(), style().justifyContentDistribution(), numberOfChildrenForJustifyContent);
+ mainAxisOffset += initialJustifyContentOffset(availableFreeSpace, position, distribution, numberOfChildrenForJustifyContent);
if (style().flexDirection() == FlowRowReverse)
mainAxisOffset += isHorizontalFlow() ? verticalScrollbarWidth() : horizontalScrollbarHeight();
@@ -1117,7 +1121,7 @@
++seenInFlowPositionedChildren;
if (seenInFlowPositionedChildren < numberOfChildrenForJustifyContent)
- mainAxisOffset += justifyContentSpaceBetweenChildren(availableFreeSpace, style().justifyContentDistribution(), numberOfChildrenForJustifyContent);
+ mainAxisOffset += justifyContentSpaceBetweenChildren(availableFreeSpace, distribution, numberOfChildrenForJustifyContent);
}
if (isColumnFlow())
@@ -1138,12 +1142,16 @@
void RenderFlexibleBox::layoutColumnReverse(const OrderedFlexItemList& children, LayoutUnit crossAxisOffset, LayoutUnit availableFreeSpace)
{
+ ContentPosition position = style().justifyContentPosition();
+ ContentDistributionType distribution = style().justifyContentDistribution();
+ RenderStyle::resolveContentJustification(style(), position);
+
// This is similar to the logic in layoutAndPlaceChildren, except we place the children
// starting from the end of the flexbox. We also don't need to layout anything since we're
// just moving the children to a new position.
size_t numberOfChildrenForJustifyContent = numberOfInFlowPositionedChildren(children);
LayoutUnit mainAxisOffset = logicalHeight() - flowAwareBorderEnd() - flowAwarePaddingEnd();
- mainAxisOffset -= initialJustifyContentOffset(availableFreeSpace, style().justifyContentPosition(), style().justifyContentDistribution(), numberOfChildrenForJustifyContent);
+ mainAxisOffset -= initialJustifyContentOffset(availableFreeSpace, position, distribution, numberOfChildrenForJustifyContent);
mainAxisOffset -= isHorizontalFlow() ? verticalScrollbarWidth() : horizontalScrollbarHeight();
size_t seenInFlowPositionedChildren = 0;
@@ -1161,17 +1169,17 @@
++seenInFlowPositionedChildren;
if (seenInFlowPositionedChildren < numberOfChildrenForJustifyContent)
- mainAxisOffset -= justifyContentSpaceBetweenChildren(availableFreeSpace, style().justifyContentDistribution(), numberOfChildrenForJustifyContent);
+ mainAxisOffset -= justifyContentSpaceBetweenChildren(availableFreeSpace, distribution, numberOfChildrenForJustifyContent);
}
}
-static LayoutUnit initialAlignContentOffset(LayoutUnit availableFreeSpace, EAlignContent alignContent, unsigned numberOfLines)
+static LayoutUnit initialAlignContentOffset(LayoutUnit availableFreeSpace, ContentPosition alignContent, ContentDistributionType alignContentDistribution, unsigned numberOfLines)
{
- if (alignContent == AlignContentFlexEnd)
+ if (alignContent == ContentPositionFlexEnd)
return availableFreeSpace;
- if (alignContent == AlignContentCenter)
+ if (alignContent == ContentPositionCenter)
return availableFreeSpace / 2;
- if (alignContent == AlignContentSpaceAround) {
+ if (alignContentDistribution == ContentDistributionSpaceAround) {
if (availableFreeSpace > 0 && numberOfLines)
return availableFreeSpace / (2 * numberOfLines);
if (availableFreeSpace < 0)
@@ -1180,12 +1188,12 @@
return 0;
}
-static LayoutUnit alignContentSpaceBetweenChildren(LayoutUnit availableFreeSpace, EAlignContent alignContent, unsigned numberOfLines)
+static LayoutUnit alignContentSpaceBetweenChildren(LayoutUnit availableFreeSpace, ContentDistributionType alignContentDistribution, unsigned numberOfLines)
{
if (availableFreeSpace > 0 && numberOfLines > 1) {
- if (alignContent == AlignContentSpaceBetween)
+ if (alignContentDistribution == ContentDistributionSpaceBetween)
return availableFreeSpace / (numberOfLines - 1);
- if (alignContent == AlignContentSpaceAround || alignContent == AlignContentStretch)
+ if (alignContentDistribution == ContentDistributionSpaceAround || alignContentDistribution == ContentDistributionStretch)
return availableFreeSpace / numberOfLines;
}
return 0;
@@ -1193,7 +1201,11 @@
void RenderFlexibleBox::alignFlexLines(Vector<LineContext>& lineContexts)
{
- if (!isMultiline() || style().alignContent() == AlignContentFlexStart)
+ ContentPosition position = style().alignContentPosition();
+ ContentDistributionType distribution = style().alignContentDistribution();
+ RenderStyle::resolveContentAlignment(style(), position, distribution);
+
+ if (!isMultiline() || position == ContentPositionFlexStart)
return;
LayoutUnit availableCrossAxisSpace = crossAxisContentExtent();
@@ -1201,16 +1213,16 @@
availableCrossAxisSpace -= lineContexts[i].crossAxisExtent;
RenderBox* child = m_orderIterator.first();
- LayoutUnit lineOffset = initialAlignContentOffset(availableCrossAxisSpace, style().alignContent(), lineContexts.size());
+ LayoutUnit lineOffset = initialAlignContentOffset(availableCrossAxisSpace, position, distribution, lineContexts.size());
for (unsigned lineNumber = 0; lineNumber < lineContexts.size(); ++lineNumber) {
lineContexts[lineNumber].crossAxisOffset += lineOffset;
for (size_t childNumber = 0; childNumber < lineContexts[lineNumber].numberOfChildren; ++childNumber, child = m_orderIterator.next())
adjustAlignmentForChild(*child, lineOffset);
- if (style().alignContent() == AlignContentStretch && availableCrossAxisSpace > 0)
+ if (distribution == ContentDistributionStretch && availableCrossAxisSpace > 0)
lineContexts[lineNumber].crossAxisExtent += availableCrossAxisSpace / static_cast<unsigned>(lineContexts.size());
- lineOffset += alignContentSpaceBetweenChildren(availableCrossAxisSpace, style().alignContent(), lineContexts.size());
+ lineOffset += alignContentSpaceBetweenChildren(availableCrossAxisSpace, distribution, lineContexts.size());
}
}
Modified: trunk/Source/WebCore/rendering/style/RenderStyle.cpp (183804 => 183805)
--- trunk/Source/WebCore/rendering/style/RenderStyle.cpp 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/Source/WebCore/rendering/style/RenderStyle.cpp 2015-05-05 15:15:38 UTC (rev 183805)
@@ -208,6 +208,28 @@
return resolveJustificationData(parentStyle, childStyle, ItemPositionStretch).overflow();
}
+void RenderStyle::resolveContentAlignment(const RenderStyle& style, ContentPosition& position, ContentDistributionType& distribution)
+{
+ if (position != ContentPositionAuto || distribution != ContentDistributionDefault)
+ return;
+
+ if (style.isDisplayFlexibleBox())
+ distribution = ContentDistributionStretch;
+ else
+ position = ContentPositionStart;
+}
+
+void RenderStyle::resolveContentJustification(const RenderStyle& style, ContentPosition& position)
+{
+ if (position != ContentPositionAuto || style.justifyContentDistribution() != ContentDistributionDefault)
+ return;
+
+ if (style.isDisplayFlexibleBox())
+ position = ContentPositionFlexStart;
+ else
+ position = ContentPositionStart;
+}
+
void RenderStyle::inheritFrom(const RenderStyle* inheritParent, IsAtShadowBoundary isAtShadowBoundary)
{
if (isAtShadowBoundary == AtShadowBoundary) {
Modified: trunk/Source/WebCore/rendering/style/RenderStyle.h (183804 => 183805)
--- trunk/Source/WebCore/rendering/style/RenderStyle.h 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/Source/WebCore/rendering/style/RenderStyle.h 2015-05-05 15:15:38 UTC (rev 183805)
@@ -491,6 +491,8 @@
// Create a RenderStyle for generated content by inheriting from a pseudo style.
static Ref<RenderStyle> createStyleInheritingFromPseudoStyle(const RenderStyle& pseudoStyle);
+ static void resolveContentAlignment(const RenderStyle&, ContentPosition&, ContentDistributionType&);
+ static void resolveContentJustification(const RenderStyle&, ContentPosition&);
static ItemPosition resolveAlignment(const RenderStyle& parentStyle, const RenderStyle& childStyle, ItemPosition resolvedAutoPositionForRenderer);
static OverflowAlignment resolveAlignmentOverflow(const RenderStyle& parentStyle, const RenderStyle& childStyle);
static ItemPosition resolveJustification(const RenderStyle& parentStyle, const RenderStyle& childStyle, ItemPosition resolvedAutoPositionForRenderer);
@@ -911,7 +913,10 @@
float flexGrow() const { return rareNonInheritedData->m_flexibleBox->m_flexGrow; }
float flexShrink() const { return rareNonInheritedData->m_flexibleBox->m_flexShrink; }
const Length& flexBasis() const { return rareNonInheritedData->m_flexibleBox->m_flexBasis; }
- EAlignContent alignContent() const { return static_cast<EAlignContent>(rareNonInheritedData->m_alignContent); }
+ const StyleContentAlignmentData& alignContent() const { return rareNonInheritedData->m_alignContent; }
+ ContentPosition alignContentPosition() const { return rareNonInheritedData->m_alignContent.position(); }
+ ContentDistributionType alignContentDistribution() const { return rareNonInheritedData->m_alignContent.distribution(); }
+ OverflowAlignment alignContentOverflowAlignment() const { return rareNonInheritedData->m_alignContent.overflow(); }
const StyleSelfAlignmentData& alignItems() const { return rareNonInheritedData->m_alignItems; }
ItemPosition alignItemsPosition() const { return rareNonInheritedData->m_alignItems.position(); }
OverflowAlignment alignItemsOverflowAlignment() const { return rareNonInheritedData->m_alignItems.overflow(); }
@@ -1504,7 +1509,10 @@
void setFlexShrink(float f) { SET_VAR(rareNonInheritedData.access()->m_flexibleBox, m_flexShrink, f); }
void setFlexBasis(Length length) { SET_VAR(rareNonInheritedData.access()->m_flexibleBox, m_flexBasis, WTF::move(length)); }
void setOrder(int o) { SET_VAR(rareNonInheritedData, m_order, o); }
- void setAlignContent(EAlignContent p) { SET_VAR(rareNonInheritedData, m_alignContent, p); }
+ void setAlignContent(const StyleContentAlignmentData& data) { SET_VAR(rareNonInheritedData, m_alignContent, data); }
+ void setAlignContentPosition(ContentPosition position) { rareNonInheritedData.access()->m_alignContent.setPosition(position); }
+ void setAlignContentOverflow(OverflowAlignment overflow) { rareNonInheritedData.access()->m_alignContent.setOverflow(overflow); }
+ void setAlignContentDistribution(ContentDistributionType distribution) { rareNonInheritedData.access()->m_alignContent.setDistribution(distribution); }
void setAlignItems(const StyleSelfAlignmentData& data) { SET_VAR(rareNonInheritedData, m_alignItems, data); }
void setAlignItemsPosition(ItemPosition position) { rareNonInheritedData.access()->m_alignItems.setPosition(position); }
void setAlignItemsOverflow(OverflowAlignment overflow) { rareNonInheritedData.access()->m_alignItems.setOverflow(overflow); }
@@ -1933,7 +1941,6 @@
static float initialFlexShrink() { return 1; }
static Length initialFlexBasis() { return Length(Auto); }
static int initialOrder() { return 0; }
- static EAlignContent initialAlignContent() { return AlignContentStretch; }
static StyleSelfAlignmentData initialSelfAlignment() { return StyleSelfAlignmentData(ItemPositionAuto, OverflowAlignmentDefault); }
static StyleContentAlignmentData initialContentAlignment() { return StyleContentAlignmentData(ContentPositionAuto, ContentDistributionDefault, OverflowAlignmentDefault); }
static EFlexDirection initialFlexDirection() { return FlowRow; }
Modified: trunk/Source/WebCore/rendering/style/StyleRareNonInheritedData.cpp (183804 => 183805)
--- trunk/Source/WebCore/rendering/style/StyleRareNonInheritedData.cpp 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/Source/WebCore/rendering/style/StyleRareNonInheritedData.cpp 2015-05-05 15:15:38 UTC (rev 183805)
@@ -71,6 +71,7 @@
, m_order(RenderStyle::initialOrder())
, m_flowThread(RenderStyle::initialFlowThread())
, m_regionThread(RenderStyle::initialRegionThread())
+ , m_alignContent(RenderStyle::initialContentAlignment())
, m_alignItems(RenderStyle::initialSelfAlignment())
, m_alignSelf(RenderStyle::initialSelfAlignment())
, m_justifyContent(RenderStyle::initialContentAlignment())
@@ -86,7 +87,6 @@
, m_pageSizeType(PAGE_SIZE_AUTO)
, m_transformStyle3D(RenderStyle::initialTransformStyle3D())
, m_backfaceVisibility(RenderStyle::initialBackfaceVisibility())
- , m_alignContent(RenderStyle::initialAlignContent())
, userDrag(RenderStyle::initialUserDrag())
, textOverflow(RenderStyle::initialTextOverflow())
, marginBeforeCollapse(MCOLLAPSE)
@@ -159,6 +159,7 @@
, m_order(o.m_order)
, m_flowThread(o.m_flowThread)
, m_regionThread(o.m_regionThread)
+ , m_alignContent(o.m_alignContent)
, m_alignItems(o.m_alignItems)
, m_alignSelf(o.m_alignSelf)
, m_justifyContent(o.m_justifyContent)
@@ -174,7 +175,6 @@
, m_pageSizeType(o.m_pageSizeType)
, m_transformStyle3D(o.m_transformStyle3D)
, m_backfaceVisibility(o.m_backfaceVisibility)
- , m_alignContent(o.m_alignContent)
, userDrag(o.userDrag)
, textOverflow(o.textOverflow)
, marginBeforeCollapse(o.marginBeforeCollapse)
@@ -256,6 +256,7 @@
&& m_visitedLinkBorderBottomColor == o.m_visitedLinkBorderBottomColor
&& m_order == o.m_order
&& m_flowThread == o.m_flowThread
+ && m_alignContent == o.m_alignContent
&& m_alignItems == o.m_alignItems
&& m_alignSelf == o.m_alignSelf
&& m_justifyContent == o.m_justifyContent
@@ -269,7 +270,6 @@
&& m_pageSizeType == o.m_pageSizeType
&& m_transformStyle3D == o.m_transformStyle3D
&& m_backfaceVisibility == o.m_backfaceVisibility
- && m_alignContent == o.m_alignContent
&& userDrag == o.userDrag
&& textOverflow == o.textOverflow
&& marginBeforeCollapse == o.marginBeforeCollapse
Modified: trunk/Source/WebCore/rendering/style/StyleRareNonInheritedData.h (183804 => 183805)
--- trunk/Source/WebCore/rendering/style/StyleRareNonInheritedData.h 2015-05-05 13:43:52 UTC (rev 183804)
+++ trunk/Source/WebCore/rendering/style/StyleRareNonInheritedData.h 2015-05-05 15:15:38 UTC (rev 183805)
@@ -177,6 +177,7 @@
AtomicString m_flowThread;
AtomicString m_regionThread;
+ StyleContentAlignmentData m_alignContent;
StyleSelfAlignmentData m_alignItems;
StyleSelfAlignmentData m_alignSelf;
StyleContentAlignmentData m_justifyContent;
@@ -197,7 +198,6 @@
unsigned m_transformStyle3D : 1; // ETransformStyle3D
unsigned m_backfaceVisibility : 1; // EBackfaceVisibility
- unsigned m_alignContent : 3; // EAlignContent
unsigned userDrag : 2; // EUserDrag
unsigned textOverflow : 1; // Whether or not lines that spill out should be truncated with "..."
