[CSS Box Alignment] New CSS Value 'normal' for Self Alignment
authorjfernandez@igalia.com <jfernandez@igalia.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 30 May 2016 08:14:31 +0000 (08:14 +0000)
committerjfernandez@igalia.com <jfernandez@igalia.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Mon, 30 May 2016 08:14:31 +0000 (08:14 +0000)
https://bugs.webkit.org/show_bug.cgi?id=156254

Reviewed by Darin Adler.

Source/WebCore:

The Box Alignment specification defines a new value 'normal' to be used
as default for the different layout models, which will define the
specific behavior for each case. This patch adds a new CSS value in the
parsing logic and adapts the Self Alignment properties to the new
value.

The 'auto' value is no longer valid for the 'align-items' property and
the Computed Value will be always the specified value. Hence, I removed
the StyleResolver logic because is not required now; the specific
behavior of the 'normal' value will be resolved at layout time.

Additionally, this patch updates the layout logic as well, for both
Flexbox and Grid layout models.

Test: css3/parse-alignment-of-root-elements.html

* css/CSSComputedStyleDeclaration.cpp:
(WebCore::resolveLegacyJustifyItems): Added.
(WebCore::resolveJustifyItemsAuto): Added.
(WebCore::resolveJustifySelfAuto): Added.
(WebCore::resolveAlignSelfAuto): Added.
(WebCore::valueForItemPositionWithOverflowAlignment): Using a StyleSelfAlignmentData argument.
(WebCore::ComputedStyleExtractor::propertyValue): Using the new resolving functions.
* css/CSSParser.cpp:
(WebCore::CSSParser::parseItemPositionOverflowPosition): A new value 'normal' is now valid.
* css/CSSPrimitiveValueMappings.h:
(WebCore::CSSPrimitiveValue::CSSPrimitiveValue): Mappings for the new value 'normal'.
(WebCore::CSSPrimitiveValue::operator ItemPosition): Mappings for the new value 'normal'.
* css/CSSPropertyNames.in:
* css/StyleResolver.cpp:
(WebCore::StyleResolver::adjustRenderStyle): We don't need to resolve 'legacy" keyword.
* rendering/RenderBox.cpp:
(WebCore::flexItemHasStretchAlignment):
(WebCore::RenderBox::hasStretchedLogicalWidth):
* rendering/RenderFlexibleBox.cpp:
(WebCore::RenderFlexibleBox::styleDidChange):
(WebCore::RenderFlexibleBox::alignmentForChild):
(WebCore::contentAlignmentNormalBehaviorFlexibleBox):
(WebCore::RenderFlexibleBox::layoutAndPlaceChildren):
(WebCore::RenderFlexibleBox::layoutColumnReverse):
(WebCore::RenderFlexibleBox::alignFlexLines):
(WebCore::RenderFlexibleBox::alignChildren):
* rendering/RenderGrid.cpp:
(WebCore::defaultAlignmentChangedToStretchInRowAxis):
(WebCore::defaultAlignmentChangedFromStretchInRowAxis):
(WebCore::defaultAlignmentChangedFromStretchInColumnAxis):
(WebCore::selfAlignmentChangedToStretchInRowAxis):
(WebCore::selfAlignmentChangedFromStretchInRowAxis):
(WebCore::selfAlignmentChangedFromStretchInColumnAxis):
(WebCore::contentAlignmentNormalBehaviorGrid):
(WebCore::RenderGrid::applyStretchAlignmentToTracksIfNeeded):
(WebCore::RenderGrid::needToStretchChildLogicalHeight):
(WebCore::RenderGrid::applyStretchAlignmentToChildIfNeeded):
(WebCore::RenderGrid::columnAxisPositionForChild):
(WebCore::RenderGrid::rowAxisPositionForChild):
(WebCore::RenderGrid::columnAxisOffsetForChild):
(WebCore::RenderGrid::rowAxisOffsetForChild):
(WebCore::RenderGrid::computeContentPositionAndDistributionOffset):
* rendering/style/RenderStyle.cpp:
(WebCore::resolvedSelfAlignment):
(WebCore::RenderStyle::resolvedAlignItems):
(WebCore::RenderStyle::resolvedAlignSelf):
(WebCore::RenderStyle::resolvedJustifyItems):
(WebCore::RenderStyle::resolvedJustifySelf):
* rendering/style/RenderStyle.h:
* rendering/style/RenderStyleConstants.h:
* rendering/style/StyleRareNonInheritedData.cpp:
(WebCore::StyleRareNonInheritedData::StyleRareNonInheritedData): align-items uses now a different initial function.

LayoutTests:

Changes in the already defined tests for the alignment properties to
consider the new CSS value 'normal', which is the default for align-items
and the value to resolve 'auto' when there is no parent.

Added a new test to verify the Self-Alignment properties work as expected
with root elements.

* css3/flexbox/css-properties-expected.txt:
* css3/flexbox/css-properties.html:
* css3/parse-align-items-expected.txt:
* css3/parse-align-items.html:
* css3/parse-align-self-expected.txt:
* css3/parse-align-self.html:
* css3/parse-alignment-of-root-elements-expected.txt: Added.
* css3/parse-alignment-of-root-elements.html: Added.
* fast/css/getComputedStyle/computed-style-expected.txt:
* fast/css/getComputedStyle/computed-style-without-renderer-expected.txt:
* fast/css/parse-justify-items-expected.txt:
* fast/css/parse-justify-items.html:
* fast/css/parse-justify-self-expected.txt:
* fast/css/parse-justify-self.html:
* fast/css/resources/alignment-parsing-utils.js:
* svg/css/getComputedStyle-basic-expected.txt:
(checkBadValues):
* svg/css/getComputedStyle-basic-expected.txt:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@201498 268f45cc-cd09-0410-ab3c-d52691b4dbfc

30 files changed:
LayoutTests/ChangeLog
LayoutTests/css3/flexbox/css-properties-expected.txt
LayoutTests/css3/flexbox/css-properties.html
LayoutTests/css3/parse-align-items-expected.txt
LayoutTests/css3/parse-align-items.html
LayoutTests/css3/parse-align-self-expected.txt
LayoutTests/css3/parse-align-self.html
LayoutTests/css3/parse-alignment-of-root-elements-expected.txt [new file with mode: 0644]
LayoutTests/css3/parse-alignment-of-root-elements.html [new file with mode: 0644]
LayoutTests/fast/css/getComputedStyle/computed-style-expected.txt
LayoutTests/fast/css/getComputedStyle/computed-style-without-renderer-expected.txt
LayoutTests/fast/css/parse-justify-items-expected.txt
LayoutTests/fast/css/parse-justify-items.html
LayoutTests/fast/css/parse-justify-self-expected.txt
LayoutTests/fast/css/parse-justify-self.html
LayoutTests/fast/css/resources/alignment-parsing-utils.js
LayoutTests/svg/css/getComputedStyle-basic-expected.txt
Source/WebCore/ChangeLog
Source/WebCore/css/CSSComputedStyleDeclaration.cpp
Source/WebCore/css/CSSParser.cpp
Source/WebCore/css/CSSPrimitiveValueMappings.h
Source/WebCore/css/CSSPropertyNames.in
Source/WebCore/css/StyleResolver.cpp
Source/WebCore/rendering/RenderBox.cpp
Source/WebCore/rendering/RenderFlexibleBox.cpp
Source/WebCore/rendering/RenderGrid.cpp
Source/WebCore/rendering/style/RenderStyle.cpp
Source/WebCore/rendering/style/RenderStyle.h
Source/WebCore/rendering/style/RenderStyleConstants.h
Source/WebCore/rendering/style/StyleRareNonInheritedData.cpp

index efb9a0f..4e2d505 100644 (file)
@@ -1,3 +1,36 @@
+2016-05-30  Javier Fernandez  <jfernandez@igalia.com>
+
+        [CSS Box Alignment] New CSS Value 'normal' for Self Alignment
+        https://bugs.webkit.org/show_bug.cgi?id=156254
+
+        Reviewed by Darin Adler.
+
+        Changes in the already defined tests for the alignment properties to
+        consider the new CSS value 'normal', which is the default for align-items
+        and the value to resolve 'auto' when there is no parent.
+
+        Added a new test to verify the Self-Alignment properties work as expected
+        with root elements.
+
+        * css3/flexbox/css-properties-expected.txt:
+        * css3/flexbox/css-properties.html:
+        * css3/parse-align-items-expected.txt:
+        * css3/parse-align-items.html:
+        * css3/parse-align-self-expected.txt:
+        * css3/parse-align-self.html:
+        * css3/parse-alignment-of-root-elements-expected.txt: Added.
+        * css3/parse-alignment-of-root-elements.html: Added.
+        * fast/css/getComputedStyle/computed-style-expected.txt:
+        * fast/css/getComputedStyle/computed-style-without-renderer-expected.txt:
+        * fast/css/parse-justify-items-expected.txt:
+        * fast/css/parse-justify-items.html:
+        * fast/css/parse-justify-self-expected.txt:
+        * fast/css/parse-justify-self.html:
+        * fast/css/resources/alignment-parsing-utils.js:
+        * svg/css/getComputedStyle-basic-expected.txt:
+        (checkBadValues):
+        * svg/css/getComputedStyle-basic-expected.txt:
+
 2016-05-25  Skachkov Oleksandr  <gskachkov@gmail.com>
 
         [ESNext] Support trailing commas in function param lists
index 4cecf63..a73f355 100644 (file)
@@ -29,12 +29,12 @@ PASS window.getComputedStyle(flexbox, null).webkitJustifyContent is "space-betwe
 PASS flexbox.style.webkitJustifyContent is ""
 PASS window.getComputedStyle(flexbox, null).webkitJustifyContent is "normal"
 PASS flexbox.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "start"
-PASS window.getComputedStyle(document.documentElement, null).webkitAlignSelf is "start"
+PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "normal"
+PASS window.getComputedStyle(document.documentElement, null).webkitAlignSelf is "normal"
 PASS flexbox.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "start"
+PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "normal"
 PASS flexbox.style.webkitAlignSelf is "auto"
-PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "start"
+PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "normal"
 PASS flexbox.style.webkitAlignSelf is "flex-start"
 PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "flex-start"
 PASS flexbox.style.webkitAlignSelf is "flex-end"
@@ -46,19 +46,19 @@ PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "stretch"
 PASS flexbox.style.webkitAlignSelf is "baseline"
 PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "baseline"
 PASS flexbox.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "start"
+PASS window.getComputedStyle(flexbox, null).webkitAlignSelf is "normal"
 PASS flexbox.style.webkitAlignItems is ""
 PASS flexitem.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "stretch"
-PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "stretch"
+PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "normal"
+PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "normal"
 PASS flexbox.style.webkitAlignItems is ""
 PASS flexitem.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "stretch"
-PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "stretch"
-PASS flexbox.style.webkitAlignItems is "auto"
+PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "normal"
+PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "normal"
+PASS flexbox.style.webkitAlignItems is ""
 PASS flexitem.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "stretch"
-PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "stretch"
+PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "normal"
+PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "normal"
 PASS flexbox.style.webkitAlignItems is "flex-start"
 PASS flexitem.style.webkitAlignSelf is ""
 PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "flex-start"
@@ -76,11 +76,11 @@ PASS flexbox.style.webkitAlignItems is "baseline"
 PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "baseline"
 PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "baseline"
 PASS flexbox.style.webkitAlignItems is ""
-PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "stretch"
-PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "stretch"
+PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "normal"
+PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "normal"
 PASS flexbox.style.webkitAlignItems is ""
-PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "auto"
-PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "auto"
+PASS window.getComputedStyle(flexbox, null).webkitAlignItems is "normal"
+PASS window.getComputedStyle(flexitem, null).webkitAlignSelf is "normal"
 PASS window.getComputedStyle(detachedFlexbox, null).webkitAlignSelf is ""
 PASS window.getComputedStyle(detachedFlexItem, null).webkitAlignSelf is ""
 PASS flexbox.style.webkitFlexDirection is ""
index 316e109..30b2532 100644 (file)
@@ -82,16 +82,16 @@ shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitJustifyConte
 
 shouldBeEqualToString('flexbox.style.webkitAlignSelf', '');
 // The initial value is 'auto', which will be resolved depending on parent's style (except for the 'document' element).
-shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'start');
-shouldBeEqualToString('window.getComputedStyle(document.documentElement, null).webkitAlignSelf', 'start');
+shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'normal');
+shouldBeEqualToString('window.getComputedStyle(document.documentElement, null).webkitAlignSelf', 'normal');
 
 flexbox.style.webkitAlignSelf = 'foo';
 shouldBeEqualToString('flexbox.style.webkitAlignSelf', '');
-shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'start');
+shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'normal');
 
 flexbox.style.webkitAlignSelf = 'auto';
 shouldBeEqualToString('flexbox.style.webkitAlignSelf', 'auto');
-shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'start');
+shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'normal');
 
 flexbox.style.webkitAlignSelf = 'flex-start';
 shouldBeEqualToString('flexbox.style.webkitAlignSelf', 'flex-start');
@@ -115,25 +115,26 @@ shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf',
 
 flexbox.style.webkitAlignSelf = '';
 shouldBeEqualToString('flexbox.style.webkitAlignSelf', '');
-shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'start');
+shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignSelf', 'normal');
 
 shouldBeEqualToString('flexbox.style.webkitAlignItems', '');
 shouldBeEqualToString('flexitem.style.webkitAlignSelf', '');
-// The initial value is 'auto', which will be resolved to 'stretch' in case of flexbox containers.
-shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'stretch');
-shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'stretch');
+// The initial value is 'auto', which will be resolved to 'normal' in case of flexbox containers.
+shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'normal');
+shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'normal');
 
 flexbox.style.webkitAlignItems = 'foo';
 shouldBeEqualToString('flexbox.style.webkitAlignItems', '');
 shouldBeEqualToString('flexitem.style.webkitAlignSelf', '');
-shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'stretch');
-shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'stretch');
+shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'normal');
+shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'normal');
 
+// The 'auto' value is not valid for the align-items property.
 flexbox.style.webkitAlignItems = 'auto';
-shouldBeEqualToString('flexbox.style.webkitAlignItems', 'auto');
+shouldBeEqualToString('flexbox.style.webkitAlignItems', '');
 shouldBeEqualToString('flexitem.style.webkitAlignSelf', '');
-shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'stretch');
-shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'stretch');
+shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'normal');
+shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'normal');
 
 flexbox.style.webkitAlignItems = 'flex-start';
 shouldBeEqualToString('flexbox.style.webkitAlignItems', 'flex-start');
@@ -163,13 +164,13 @@ shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf',
 
 flexbox.style.webkitAlignItems = '';
 shouldBeEqualToString('flexbox.style.webkitAlignItems', '');
-shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'stretch');
-shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'stretch');
+shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'normal');
+shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'normal');
 
 flexbox.style.display = 'none';
 shouldBeEqualToString('flexbox.style.webkitAlignItems', '');
-shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'auto');
-shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'auto');
+shouldBeEqualToString('window.getComputedStyle(flexbox, null).webkitAlignItems', 'normal');
+shouldBeEqualToString('window.getComputedStyle(flexitem, null).webkitAlignSelf', 'normal');
 flexbox.style.display = '';
 
 
index 27366f7..10937c7 100644 (file)
@@ -26,7 +26,7 @@ PASS getComputedStyle(alignItemsFlexStartUnsafe, '').getPropertyValue('-webkit-a
 PASS getComputedStyle(alignItemsFlexEndSafe, '').getPropertyValue('-webkit-align-items') is 'flex-end safe'
 
 Test initial value of align-items through JS
-PASS getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is 'start'
+PASS getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is 'normal'
 
 Test getting and setting align-items through JS
 PASS element.style.webkitAlignItems is "center"
@@ -41,82 +41,84 @@ PASS element.style.webkitAlignItems is "center"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "center"
 PASS element.style.webkitAlignItems is "self-start"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "self-start"
-PASS element.style.webkitAlignItems is "auto"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
-PASS element.style.webkitAlignItems is "auto"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "stretch"
-PASS element.style.webkitAlignItems is "auto"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "stretch"
+PASS element.style.webkitAlignItems is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
+PASS element.style.webkitAlignItems is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
+PASS element.style.webkitAlignItems is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is "self-end"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "self-end"
 
 Test bad combinations of align-items
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
+PASS element.style.webkitAlignItems is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 PASS element.style.webkitAlignItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 
 Test the value 'initial'
 PASS element.style.webkitAlignItems is "center"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "center"
 PASS element.style.webkitAlignItems is "initial"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 
 Test the value 'initial' for grid containers
 PASS element.style.webkitAlignItems is "left safe"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "left safe"
 PASS element.style.webkitAlignItems is "initial"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "stretch"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 
 Test the value 'initial' for flex containers
 PASS element.style.webkitAlignItems is "right unsafe"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "right unsafe"
 PASS element.style.webkitAlignItems is "initial"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "stretch"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
 
 Test the value 'inherit'
 PASS element.style.webkitAlignItems is "end"
index efce730..4b54c05 100644 (file)
@@ -176,7 +176,7 @@ debug("");
 debug("Test initial value of align-items through JS");
 element = document.createElement("div");
 document.body.appendChild(element);
-shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-align-items')", "'start'");
+shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-align-items')", "'normal'");
 
 debug("");
 debug("Test getting and setting align-items through JS");
@@ -200,16 +200,18 @@ checkValues(element, "webkitAlignItems", "-webkit-align-items",  "center", "cent
 element.style.webkitAlignItems = "self-start";
 checkValues(element, "webkitAlignItems", "-webkit-align-items",  "self-start", "self-start");
 
+<!-- The 'auto' value is no valid for the align-items property. -->
+element.style.webkitAlignItems = "";
 element.style.webkitAlignItems = "auto";
-checkValues(element, "webkitAlignItems", "-webkit-align-items",  "auto", "start");
+checkValues(element, "webkitAlignItems", "-webkit-align-items",  "", "normal");
 
 element.style.display = "-webkit-flex";
 element.style.webkitAlignItems = "auto";
-checkValues(element, "webkitAlignItems", "-webkit-align-items",  "auto", "stretch");
+checkValues(element, "webkitAlignItems", "-webkit-align-items",  "", "normal");
 
 element.style.display = "grid";
 element.style.webkitAlignItems = "auto";
-checkValues(element, "webkitAlignItems", "-webkit-align-items",  "auto", "stretch");
+checkValues(element, "webkitAlignItems", "-webkit-align-items",  "", "normal");
 
 element.style.webkitAlignItems = "self-end";
 checkValues(element, "webkitAlignItems", "-webkit-align-items",  "self-end", "self-end");
@@ -219,6 +221,7 @@ debug("Test bad combinations of align-items");
 element = document.createElement("div");
 document.body.appendChild(element);
 
+checkBadValues(element, "webkitAlignItems", "-webkit-align-items",  "auto");
 checkBadValues(element, "webkitAlignItems", "-webkit-align-items",  "unsafe auto");
 checkBadValues(element, "webkitAlignItems", "-webkit-align-items",  "auto safe");
 checkBadValues(element, "webkitAlignItems", "-webkit-align-items",  "auto left");
@@ -247,17 +250,17 @@ checkBadValues(element, "webkitAlignItems", "-webkit-align-items",  "legacy left
 debug("");
 debug("Test the value 'initial'");
 element.style.display = "";
-checkInitialValues(element, "webkitAlignItems", "-webkit-align-items", "center", "start");
+checkInitialValues(element, "webkitAlignItems", "-webkit-align-items", "center", "normal");
 
 debug("");
 debug("Test the value 'initial' for grid containers");
-element.style.display = "grid";
-checkInitialValues(element, "webkitAlignItems", "-webkit-align-items", "left safe", "stretch");
+element.style.display = "-webkit-grid";
+checkInitialValues(element, "webkitAlignItems", "-webkit-align-items", "left safe", "normal");
 
 debug("");
 debug("Test the value 'initial' for flex containers");
 element.style.display = "-webkit-flex";
-checkInitialValues(element, "webkitAlignItems", "-webkit-align-items", "right unsafe", "stretch");
+checkInitialValues(element, "webkitAlignItems", "-webkit-align-items", "right unsafe", "normal");
 
 debug("");
 debug("Test the value 'inherit'");
index fd52471..1ff234c 100644 (file)
@@ -26,7 +26,7 @@ PASS getComputedStyle(alignSelfFlexStartUnsafe, '').getPropertyValue('-webkit-al
 PASS getComputedStyle(alignSelfFlexEndSafe, '').getPropertyValue('-webkit-align-self') is 'flex-end safe'
 
 Test initial value of align-self through JS
-PASS getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is 'start'
+PASS getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is 'normal'
 
 Test getting and setting align-self through JS
 PASS element.style.webkitAlignSelf is "center"
@@ -42,99 +42,103 @@ PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self')
 PASS element.style.webkitAlignSelf is "self-start"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "self-start"
 PASS element.style.webkitAlignSelf is "auto"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is "auto"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "stretch"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is "auto"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "stretch"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is "self-end"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "self-end"
 
+Test 'auto' value resolution for the root node
+PASS element.style.webkitAlignSelf is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
+
 Test bad combinations of align-self
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 PASS element.style.webkitAlignSelf is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 
 Test the value 'initial'
 PASS element.style.webkitAlignSelf is "center"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "center"
 PASS element.style.webkitAlignSelf is "initial"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 
 Test the value 'initial' for grid containers
 PASS element.style.webkitAlignSelf is "left safe"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "left safe"
 PASS element.style.webkitAlignSelf is "initial"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "stretch"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 
 Test the value 'initial' for flex containers
 PASS element.style.webkitAlignSelf is "right unsafe"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "right unsafe"
 PASS element.style.webkitAlignSelf is "initial"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "stretch"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 
 Test the value 'initial' for positioned elements
 PASS element.style.webkitAlignSelf is "left"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "left"
 PASS element.style.webkitAlignSelf is "initial"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 
 Test the value 'initial' for positioned elements in grid containers
 PASS element.style.webkitAlignSelf is "right"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "right"
 PASS element.style.webkitAlignSelf is "initial"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 
 Test the value 'initial' for positioned elements in grid containers
 PASS element.style.webkitAlignSelf is "end"
 PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "end"
 PASS element.style.webkitAlignSelf is "initial"
-PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
 
 Test the value 'inherit'
 PASS element.style.webkitAlignSelf is "end"
index 051603f..a636f94 100644 (file)
@@ -60,7 +60,7 @@
 
 #alignSelfSelfEndSafe {
     -webkit-align-self: self-end safe;
-}
+x}
 
 #alignSelfSelfStartSafe {
     -webkit-align-self: self-start safe;
@@ -175,7 +175,7 @@ debug("");
 debug("Test initial value of align-self through JS");
 element = document.createElement("div");
 document.body.appendChild(element);
-shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-align-self')", "'start'");
+shouldBe("getComputedStyle(element, '').getPropertyValue('-webkit-align-self')", "'normal'");
 
 debug("");
 debug("Test getting and setting align-self through JS");
@@ -202,20 +202,25 @@ element.style.webkitAlignSelf = "self-start";
 checkValues(element, "webkitAlignSelf", "-webkit-align-self",  "self-start", "self-start");
 
 element.style.webkitAlignSelf = "auto";
-checkValues(element, "webkitAlignSelf", "-webkit-align-self",  "auto", "start");
+checkValues(element, "webkitAlignSelf", "-webkit-align-self",  "auto", "normal");
 
 container.style.display = "-webkit-flex";
 element.style.webkitAlignSelf = "auto";
-checkValues(element, "webkitAlignSelf", "-webkit-align-self",  "auto", "stretch");
+checkValues(element, "webkitAlignSelf", "-webkit-align-self",  "auto", "normal");
 
 container.style.display = "grid";
 element.style.webkitAlignSelf = "auto";
-checkValues(element, "webkitAlignSelf", "-webkit-align-self",  "auto", "stretch");
+checkValues(element, "webkitAlignSelf", "-webkit-align-self",  "auto", "normal");
 
 element.style.webkitAlignSelf = "self-end";
 checkValues(element, "webkitAlignSelf", "-webkit-align-self",  "self-end", "self-end");
 
 debug("");
+debug("Test 'auto' value resolution for the root node");
+document.documentElement.style.webkitAlignSelf = "auto";
+checkValues(document.documentElement, "webkitAlignSelf", "-webkit-align-self",  "auto", "normal");
+
+debug("");
 debug("Test bad combinations of align-self");
 container = document.createElement("div");
 element = document.createElement("div");
@@ -250,35 +255,35 @@ checkBadValues(element, "webkitAlignSelf", "-webkit-align-self",  "legacy left r
 debug("");
 debug("Test the value 'initial'");
 container.style.display = "";
-checkInitialValues(element, "webkitAlignSelf", "-webkit-align-self", "center", "start");
+checkInitialValues(element, "webkitAlignSelf", "-webkit-align-self", "center", "normal");
 
 debug("");
 debug("Test the value 'initial' for grid containers");
-container.style.display = "grid";
-checkInitialValues(element, "webkitAlignSelf", "-webkit-align-self", "left safe", "stretch");
+container.style.display = "-webkit-grid";
+checkInitialValues(element, "webkitAlignSelf", "-webkit-align-self", "left safe", "normal");
 
 debug("");
 debug("Test the value 'initial' for flex containers");
 container.style.display = "-webkit-flex";
-checkInitialValues(element, "webkitAlignSelf", "-webkit-align-self", "right unsafe", "stretch");
+checkInitialValues(element, "webkitAlignSelf", "-webkit-align-self", "right unsafe", "normal");
 
 debug("");
 debug("Test the value 'initial' for positioned elements");
 container.style.display = "";
 element.style.position = "absolute";
-checkInitialValues(element, "webkitAlignSelf", "-webkit-align-self", "left", "auto");
+checkInitialValues(element, "webkitAlignSelf", "-webkit-align-self", "left", "normal");
 
 debug("");
 debug("Test the value 'initial' for positioned elements in grid containers");
 container.style.display = "grid";
 element.style.position = "absolute";
-checkInitialValues(element, "webkitAlignSelf", "-webkit-align-self", "right", "auto");
+checkInitialValues(element, "webkitAlignSelf", "-webkit-align-self", "right", "normal");
 
 debug("");
 debug("Test the value 'initial' for positioned elements in grid containers");
 container.style.display = "-webkit-flex";
 element.style.position = "absolute";
-checkInitialValues(element, "webkitAlignSelf", "-webkit-align-self", "end", "auto");
+checkInitialValues(element, "webkitAlignSelf", "-webkit-align-self", "end", "normal");
 
 debug("");
 debug("Test the value 'inherit'");
diff --git a/LayoutTests/css3/parse-alignment-of-root-elements-expected.txt b/LayoutTests/css3/parse-alignment-of-root-elements-expected.txt
new file mode 100644 (file)
index 0000000..bd67414
--- /dev/null
@@ -0,0 +1,83 @@
+Test to verify auto value resolution works as expected in root elements (eg. document root / shadow roots / slotted elements / elements inside<slot>)
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+
+*** Test 'auto' value resolution for the document root node. ***
+
+Check out how the DOM's root element resolves the align-self 'auto' values.
+PASS element.style.webkitAlignSelf is "center"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "center"
+PASS element.style.webkitAlignSelf is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "normal"
+
+Check out how the DOM's root element align-items's value is used to resolve its children's align-self 'auto' values.
+PASS element.style.webkitAlignItems is "center"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "center"
+PASS element.style.webkitAlignItems is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
+PASS element.style.webkitAlignSelf is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-self') is "center"
+PASS element.style.webkitAlignItems is ""
+PASS window.getComputedStyle(host, '').getPropertyValue('-webkit-align-items') is "normal"
+PASS element.style.webkitAlignSelf is "auto"
+PASS window.getComputedStyle(host, '').getPropertyValue('-webkit-align-self') is "normal"
+
+Check out how the DOM's root element deals with 'auto' value in align-items.
+PASS element.style.webkitAlignItems is "center"
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "center"
+PASS element.style.webkitAlignItems is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('-webkit-align-items') is "normal"
+
+Check out how the DOM's root element resolves the justify-self 'auto' values.
+PASS element.style.justifySelf is "left"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "left"
+PASS element.style.justifySelf is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+
+Check out how the DOM's root element align-items's value is used to resolve its children's align-self 'auto' values.
+PASS element.style.justifyItems is "center"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "center"
+PASS element.style.justifyItems is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
+PASS element.style.justifySelf is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "center"
+PASS element.style.justifyItems is "auto"
+PASS window.getComputedStyle(host, '').getPropertyValue('justify-items') is "normal"
+PASS element.style.justifySelf is "auto"
+PASS window.getComputedStyle(host, '').getPropertyValue('justify-self') is "normal"
+
+Check out how the DOM's root element deals with 'auto' value in justify-items.
+PASS element.style.justifyItems is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
+PASS element.style.justifySelf is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is "auto"
+PASS window.getComputedStyle(host, '').getPropertyValue('justify-self') is "normal"
+
+Check out how the DOM's root element justify-items's value with 'legacy' keyword is used to resolve any descendant's justify-items 'auto' values.
+PASS element.style.justifyItems is "legacy center"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "legacy center"
+PASS element.style.justifyItems is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "legacy center"
+PASS element.style.justifySelf is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "center"
+PASS element.style.justifyItems is "auto"
+PASS window.getComputedStyle(host, '').getPropertyValue('justify-items') is "legacy center"
+PASS element.style.justifySelf is "auto"
+PASS window.getComputedStyle(host, '').getPropertyValue('justify-self') is "center"
+
+Check out how the DOM's root element recomputes its descendant's style when 'legacy' keyword is removed from its justify-items value.
+PASS element.style.justifyItems is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
+PASS element.style.justifySelf is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifyItems is "auto"
+PASS window.getComputedStyle(host, '').getPropertyValue('justify-items') is "normal"
+PASS element.style.justifySelf is "auto"
+PASS window.getComputedStyle(host, '').getPropertyValue('justify-self') is "normal"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
diff --git a/LayoutTests/css3/parse-alignment-of-root-elements.html b/LayoutTests/css3/parse-alignment-of-root-elements.html
new file mode 100644 (file)
index 0000000..97511e8
--- /dev/null
@@ -0,0 +1,95 @@
+<!DOCTYPE html>
+<script src="../resources/js-test.js"></script>
+<html>
+ <body>
+     <div id="host">
+         <div id="slotted" slot="s1"></div>
+     </div>
+<script src="resources/alignment-parsing-utils.js"></script>
+<script>
+description('Test to verify auto value resolution works as expected in root elements (eg. document root / shadow roots / slotted elements / elements inside&lt;slot&gt;)');
+
+var block = document.getElementById("host");
+
+debug("");
+debug("*** Test 'auto' value resolution for the document root node. ***");
+
+debug("");
+debug("Check out how the DOM's root element resolves the align-self 'auto' values.");
+document.documentElement.style.webkitAlignSelf = "center";
+checkValues(document.documentElement, "webkitAlignSelf", "-webkit-align-self", "center", "center");
+document.documentElement.style.webkitAlignSelf = "auto";
+checkValues(document.documentElement, "webkitAlignSelf", "-webkit-align-self", "auto", "normal");
+
+debug("");
+debug("Check out how the DOM's root element align-items's value is used to resolve its children's align-self 'auto' values.");
+document.documentElement.style.webkitAlignItems = "center";
+checkValues(document.documentElement, "webkitAlignItems", "-webkit-align-items", "center", "center");
+document.body.style.webkitAlignItems = "auto"; // The 'auto' value is not valid for align-items.
+document.body.style.webkitAlignSelf = "auto";
+checkValues(document.body, "webkitAlignItems", "-webkit-align-items", "", "normal");
+checkValues(document.body, "webkitAlignSelf", "-webkit-align-self", "auto", "center");
+block.style.webkitAlignItems = ""; // Default value is 'normal' for align-items.
+block.style.webkitAlignSelf = "auto";
+checkValues(block, "webkitAlignItems", "-webkit-align-items", "", "normal");
+checkValues(block, "webkitAlignSelf", "-webkit-align-self", "auto", "normal");
+
+debug("");
+debug("Check out how the DOM's root element deals with 'auto' value in align-items.");
+document.documentElement.style.webkitAlignItems = "auto"; // The 'auto' value is not valid for align-items.
+checkValues(document.documentElement, "webkitAlignItems", "-webkit-align-items", "center", "center");
+document.documentElement.style.webkitAlignItems = ""; // Default value is 'normal' for align-items.
+checkValues(document.documentElement, "webkitAlignItems", "-webkit-align-items", "", "normal");
+
+debug("");
+debug("Check out how the DOM's root element resolves the justify-self 'auto' values.");
+document.documentElement.style.justifySelf = "left";
+checkValues(document.documentElement, "justifySelf", "justify-self", "left", "left");
+document.documentElement.style.justifySelf = "auto";
+checkValues(document.documentElement, "justifySelf", "justify-self", "auto", "normal");
+
+debug("");
+debug("Check out how the DOM's root element align-items's value is used to resolve its children's align-self 'auto' values.");
+document.documentElement.style.justifyItems = "center";
+checkValues(document.documentElement, "justifyItems", "justify-items", "center", "center");
+document.body.style.justifyItems = "auto";
+document.body.style.justifySelf = "auto";
+checkValues(document.body, "justifyItems", "justify-items", "auto", "normal");
+checkValues(document.body, "justifySelf", "justify-self", "auto", "center");
+block.style.justifyItems = "auto";
+block.style.justifySelf = "auto";
+checkValues(block, "justifyItems", "justify-items",  "auto", "normal");
+checkValues(block, "justifySelf", "justify-self",  "auto", "normal");
+
+debug("");
+debug("Check out how the DOM's root element deals with 'auto' value in justify-items.");
+document.documentElement.style.justifyItems = "auto";
+checkValues(document.documentElement, "justifyItems", "justify-items", "auto", "normal");
+checkValues(document.body, "justifySelf", "justify-self",  "auto", "normal");
+checkValues(block, "justifySelf", "justify-self",  "auto", "normal");
+
+debug("");
+debug("Check out how the DOM's root element justify-items's value with 'legacy' keyword is used to resolve any descendant's justify-items 'auto' values.");
+document.documentElement.style.justifyItems = "legacy center";
+checkValues(document.documentElement, "justifyItems", "justify-items",  "legacy center", "legacy center");
+document.body.style.justifyItems = "auto";
+document.body.style.justifySelf = "auto";
+checkValues(document.body, "justifyItems", "justify-items",  "auto", "legacy center");
+checkValues(document.body, "justifySelf", "justify-self",  "auto", "center");
+block.style.justifyItems = "auto";
+block.style.justifySelf = "auto";
+checkValues(block, "justifyItems", "justify-items",  "auto", "legacy center");
+checkValues(block, "justifySelf", "justify-self",  "auto", "center");
+
+debug("");
+debug("Check out how the DOM's root element recomputes its descendant's style when 'legacy' keyword is removed from its justify-items value.");
+document.documentElement.style.justifyItems = "auto";
+checkValues(document.body, "justifyItems", "justify-items",  "auto", "normal");
+checkValues(document.body, "justifySelf", "justify-self",  "auto", "normal");
+checkValues(block, "justifyItems", "justify-items",  "auto", "normal");
+checkValues(block, "justifySelf", "justify-self",  "auto", "normal");
+
+</script>
+
+</body>
+</html>
index 127a806..1f0d6d6 100644 (file)
@@ -149,14 +149,14 @@ column-rule-width: 0px;
 column-span: none;
 column-width: auto;
 align-content: normal;
-align-items: start;
-align-self: start;
+align-items: normal;
+align-self: normal;
 filter: none;
 flex-direction: row;
 flex-wrap: nowrap;
 justify-content: normal;
-justify-self: start;
-justify-items: start;
+justify-self: normal;
+justify-items: normal;
 -webkit-font-kerning: auto;
 -webkit-font-smoothing: auto;
 font-variant-ligatures: normal;
index 83b71ad..83979d8 100644 (file)
@@ -148,14 +148,14 @@ column-rule-width: 0px
 column-span: none
 column-width: auto
 align-content: normal
-align-items: auto
-align-self: auto
+align-items: normal
+align-self: normal
 filter: none
 flex-direction: row
 flex-wrap: nowrap
 justify-content: normal
-justify-self: auto
-justify-items: auto
+justify-self: normal
+justify-items: normal
 -webkit-font-kerning: auto
 -webkit-font-smoothing: auto
 font-variant-ligatures: normal
index dc23cb6..6332a2f 100644 (file)
@@ -32,7 +32,7 @@ PASS getComputedStyle(justifyItemsCenterLegacy, '').getPropertyValue('justify-it
 PASS getComputedStyle(justifyItemsRightLegacy, '').getPropertyValue('justify-items') is 'legacy right'
 
 Test initial value of justify-items through JS
-PASS getComputedStyle(element, '').getPropertyValue('justify-items') is 'start'
+PASS getComputedStyle(element, '').getPropertyValue('justify-items') is 'normal'
 
 Test getting and setting justify-items through JS
 PASS element.style.justifyItems is "center"
@@ -48,83 +48,81 @@ PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "
 PASS element.style.justifyItems is "legacy left"
 PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "legacy left"
 PASS element.style.justifyItems is "auto"
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is "auto"
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "stretch"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is "auto"
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "stretch"
-PASS getComputedStyle(element, '').getPropertyValue('justify-items') is 'stretch'
-PASS element.style.justifyItems is 'auto'
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is "self-end"
 PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "self-end"
 
 Test bad combinations of justify-items
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 PASS element.style.justifyItems is ""
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 
 Test the value 'initial'
-PASS element.style.justifyItems is "center"
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "center"
+PASS element.style.justifyItems is "legacy center"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "legacy center"
 PASS element.style.justifyItems is "initial"
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 
 Test the value 'initial' for grid containers
 PASS element.style.justifyItems is "left safe"
 PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "left safe"
 PASS element.style.justifyItems is "initial"
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "stretch"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 
 Test the value 'initial' for flex containers
 PASS element.style.justifyItems is "right unsafe"
 PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "right unsafe"
 PASS element.style.justifyItems is "initial"
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "stretch"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "normal"
 
 Test the value 'inherit'
 PASS element.style.justifyItems is "end"
@@ -135,10 +133,10 @@ PASS element.style.justifyItems is "left safe"
 PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "left safe"
 PASS element.style.justifyItems is "inherit"
 PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "left safe"
-PASS element.style.justifyItems is "center unsafe"
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "center unsafe"
+PASS element.style.justifyItems is "legacy center"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "legacy center"
 PASS element.style.justifyItems is "inherit"
-PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "center unsafe"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-items') is "legacy center"
 
 Test the value 'legacy'
 PASS element.style.justifyItems is "legacy left"
index e31893a..3a2aa6a 100644 (file)
@@ -223,7 +223,7 @@ debug("");
 debug("Test initial value of justify-items through JS");
 element = document.createElement("div");
 document.body.appendChild(element);
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-items')", "'start'");
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-items')", "'normal'");
 
 debug("");
 debug("Test getting and setting justify-items through JS");
@@ -248,17 +248,15 @@ element.style.justifyItems = "left legacy";
 checkValues(element, "justifyItems", "justify-items",  "legacy left", "legacy left");
 
 element.style.justifyItems = "auto";
-checkValues(element, "justifyItems", "justify-items",  "auto", "start");
+checkValues(element, "justifyItems", "justify-items",  "auto", "normal");
 
 element.style.display = "flex";
 element.style.justifyItems = "auto";
-checkValues(element, "justifyItems", "justify-items",  "auto", "stretch");
+checkValues(element, "justifyItems", "justify-items",  "auto", "normal");
 
 element.style.display = "grid";
 element.style.justifyItems = "auto";
-checkValues(element, "justifyItems", "justify-items",  "auto", "stretch");
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-items')", "'stretch'");
-shouldBe("element.style.justifyItems", "'auto'");
+checkValues(element, "justifyItems", "justify-items",  "auto", "normal");
 
 element.style.justifyItems = "self-end";
 checkValues(element, "justifyItems", "justify-items",  "self-end", "self-end");
@@ -296,24 +294,23 @@ checkBadValues(element, "justifyItems", "justify-items",  "legacy left right");
 debug("");
 debug("Test the value 'initial'");
 element.style.display = "";
-checkInitialValues(element, "justifyItems", "justify-items", "center", "start");
+checkInitialValues(element, "justifyItems", "justify-items", "legacy center", "normal");
 
 debug("");
 debug("Test the value 'initial' for grid containers");
 element.style.display = "grid";
-checkInitialValues(element, "justifyItems", "justify-items", "left safe", "stretch");
+checkInitialValues(element, "justifyItems", "justify-items", "left safe", "normal");
 
 debug("");
 debug("Test the value 'initial' for flex containers");
-element.style.display = "-webkit-flex";
-checkInitialValues(element, "justifyItems", "justify-items", "right unsafe", "stretch");
+element.style.display = "flex";
+checkInitialValues(element, "justifyItems", "justify-items", "right unsafe", "normal");
 
 debug("");
 debug("Test the value 'inherit'");
-parentElement = document.createElement("div");
 checkInheritValues("justifyItems", "justify-items", "end");
 checkInheritValues("justifyItems", "justify-items", "left safe");
-checkInheritValues("justifyItems", "justify-items", "center unsafe");
+checkInheritValues("justifyItems", "justify-items", "legacy center");
 
 debug("");
 debug("Test the value 'legacy'");
index 26a298a..cf7b29c 100644 (file)
@@ -5,6 +5,7 @@ On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE
 
 Test getting justify-self set through CSS
 PASS getComputedStyle(justifySelfBaseline, '').getPropertyValue('justify-self') is 'baseline'
+PASS getComputedStyle(justifySelfLastBaseline, '').getPropertyValue('justify-self') is 'last-baseline'
 PASS getComputedStyle(justifySelfStretch, '').getPropertyValue('justify-self') is 'stretch'
 PASS getComputedStyle(justifySelfStart, '').getPropertyValue('justify-self') is 'start'
 PASS getComputedStyle(justifySelfEnd, '').getPropertyValue('justify-self') is 'end'
@@ -13,47 +14,141 @@ PASS getComputedStyle(justifySelfSelfEnd, '').getPropertyValue('justify-self') i
 PASS getComputedStyle(justifySelfSelfStart, '').getPropertyValue('justify-self') is 'self-start'
 PASS getComputedStyle(justifySelfLeft, '').getPropertyValue('justify-self') is 'left'
 PASS getComputedStyle(justifySelfRight, '').getPropertyValue('justify-self') is 'right'
+PASS getComputedStyle(justifySelfFlexStart, '').getPropertyValue('justify-self') is 'flex-start'
+PASS getComputedStyle(justifySelfFlexEnd, '').getPropertyValue('justify-self') is 'flex-end'
 PASS getComputedStyle(justifySelfEndUnsafe, '').getPropertyValue('justify-self') is 'end unsafe'
 PASS getComputedStyle(justifySelfCenterUnsafe, '').getPropertyValue('justify-self') is 'center unsafe'
 PASS getComputedStyle(justifySelfSelfEndSafe, '').getPropertyValue('justify-self') is 'self-end safe'
 PASS getComputedStyle(justifySelfSelfStartSafe, '').getPropertyValue('justify-self') is 'self-start safe'
 PASS getComputedStyle(justifySelfRightSafe, '').getPropertyValue('justify-self') is 'right safe'
 PASS getComputedStyle(justifySelfLeftUnsafe, '').getPropertyValue('justify-self') is 'left unsafe'
+PASS getComputedStyle(justifySelfFlexStartUnsafe, '').getPropertyValue('justify-self') is 'flex-start unsafe'
+PASS getComputedStyle(justifySelfFlexEndSafe, '').getPropertyValue('justify-self') is 'flex-end safe'
 
 Test initial value of justify-self through JS
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
+PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'normal'
 
 Test getting and setting justify-self through JS
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'center'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start unsafe'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
+PASS element.style.justifySelf is "center"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "center"
+PASS element.style.justifySelf is "start unsafe"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "start unsafe"
+PASS element.style.justifySelf is "flex-end safe"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "flex-end safe"
+PASS element.style.justifySelf is "right"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "right"
+PASS element.style.justifySelf is "center"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "center"
+PASS element.style.justifySelf is "self-start"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "self-start"
+PASS element.style.justifySelf is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is "auto"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is "self-end"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "self-end"
 
 Test bad combinations of justify-self
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+PASS element.style.justifySelf is ""
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
 
 Test the value 'initial'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'center'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'start'
+PASS element.style.justifySelf is "center"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "center"
+PASS element.style.justifySelf is "initial"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+
+Test the value 'initial' for grid containers
+PASS element.style.justifySelf is "left safe"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "left safe"
+PASS element.style.justifySelf is "initial"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+
+Test the value 'initial' for flex containers
+PASS element.style.justifySelf is "right unsafe"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "right unsafe"
+PASS element.style.justifySelf is "initial"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+
+Test the value 'initial' for positioned elements
+PASS element.style.justifySelf is "left"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "left"
+PASS element.style.justifySelf is "initial"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+
+Test the value 'initial' for positioned elements in grid containers
+PASS element.style.justifySelf is "right"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "right"
+PASS element.style.justifySelf is "initial"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
+
+Test the value 'initial' for positioned elements in grid containers
+PASS element.style.justifySelf is "end"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "end"
+PASS element.style.justifySelf is "initial"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "normal"
 
 Test the value 'inherit'
-PASS getComputedStyle(parentElement, '').getPropertyValue('justify-self') is 'end'
-PASS getComputedStyle(element, '').getPropertyValue('justify-self') is 'end'
+PASS element.style.justifySelf is "end"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "end"
+PASS element.style.justifySelf is "inherit"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "end"
+PASS element.style.justifySelf is "left safe"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "left safe"
+PASS element.style.justifySelf is "inherit"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "left safe"
+PASS element.style.justifySelf is "center unsafe"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "center unsafe"
+PASS element.style.justifySelf is "inherit"
+PASS window.getComputedStyle(element, '').getPropertyValue('justify-self') is "center unsafe"
 PASS successfullyParsed is true
 
 TEST COMPLETE
index 70ae924..31f0bc6 100644 (file)
@@ -6,6 +6,10 @@
     justify-self: baseline;
 }
 
+#justifySelfLastBaseline {
+    justify-self: last-baseline;
+}
+
 #justifySelfStretch {
     justify-self: stretch;
 }
     justify-self: right;
 }
 
+#justifySelfFlexStart {
+    justify-self: flex-start;
+}
+
+#justifySelfFlexEnd {
+    justify-self: flex-end;
+}
+
 #justifySelfEndUnsafe {
     justify-self: end unsafe;
 }
 #justifySelfLeftUnsafe {
     justify-self: left unsafe;
 }
+
+#justifySelfFlexStartUnsafe {
+    justify-self: flex-start unsafe;
+}
+
+#justifySelfFlexEndSafe {
+    justify-self: flex-end safe;
+}
 </style>
 <script src="../../resources/js-test.js"></script>
 </head>
 <body>
 <div id="justifySelfBaseline"></div>
+<div id="justifySelfLastBaseline"></div>
 <div id="justifySelfStretch"></div>
 <div id="justifySelfStart"></div>
 <div id="justifySelfEnd"></div>
@@ -74,6 +95,8 @@
 <div id="justifySelfSelfEnd"></div>
 <div id="justifySelfLeft"></div>
 <div id="justifySelfRight"></div>
+<div id="justifySelfFlexStart"></div>
+<div id="justifySelfFlexEnd"></div>
 
 <div id="justifySelfEndUnsafe"></div>
 <div id="justifySelfCenterUnsafe"></div>
 <div id="justifySelfSelfStartSafe"></div>
 <div id="justifySelfRightSafe"></div>
 <div id="justifySelfLeftUnsafe"></div>
+<div id="justifySelfFlexStartUnsafe"></div>
+<div id="justifySelfFlexEndSafe"></div>
+<script src="resources/alignment-parsing-utils.js"></script>
 <script>
 description('Test that setting and getting justify-self works as expected');
 
@@ -88,6 +114,9 @@ debug("Test getting justify-self set through CSS");
 var justifySelfBaseline = document.getElementById("justifySelfBaseline");
 shouldBe("getComputedStyle(justifySelfBaseline, '').getPropertyValue('justify-self')", "'baseline'");
 
+var justifySelfLastBaseline = document.getElementById("justifySelfLastBaseline");
+shouldBe("getComputedStyle(justifySelfLastBaseline, '').getPropertyValue('justify-self')", "'last-baseline'");
+
 var justifySelfStretch = document.getElementById("justifySelfStretch");
 shouldBe("getComputedStyle(justifySelfStretch, '').getPropertyValue('justify-self')", "'stretch'");
 
@@ -112,6 +141,12 @@ shouldBe("getComputedStyle(justifySelfLeft, '').getPropertyValue('justify-self')
 var justifySelfRight = document.getElementById("justifySelfRight");
 shouldBe("getComputedStyle(justifySelfRight, '').getPropertyValue('justify-self')", "'right'");
 
+var justifySelfFlexStart = document.getElementById("justifySelfFlexStart");
+shouldBe("getComputedStyle(justifySelfFlexStart, '').getPropertyValue('justify-self')", "'flex-start'");
+
+var justifySelfFlexEnd = document.getElementById("justifySelfFlexEnd");
+shouldBe("getComputedStyle(justifySelfFlexEnd, '').getPropertyValue('justify-self')", "'flex-end'");
+
 var justifySelfEndUnsafe = document.getElementById("justifySelfEndUnsafe");
 shouldBe("getComputedStyle(justifySelfEndUnsafe, '').getPropertyValue('justify-self')", "'end unsafe'");
 
@@ -130,100 +165,127 @@ shouldBe("getComputedStyle(justifySelfRightSafe, '').getPropertyValue('justify-s
 var justifySelfLeftUnsafe = document.getElementById("justifySelfLeftUnsafe");
 shouldBe("getComputedStyle(justifySelfLeftUnsafe, '').getPropertyValue('justify-self')", "'left unsafe'");
 
+var justifySelfFlexStartUnsafe = document.getElementById("justifySelfFlexStartUnsafe");
+shouldBe("getComputedStyle(justifySelfFlexStartUnsafe, '').getPropertyValue('justify-self')", "'flex-start unsafe'");
+
+var justifySelfFlexEndSafe = document.getElementById("justifySelfFlexEndSafe");
+shouldBe("getComputedStyle(justifySelfFlexEndSafe, '').getPropertyValue('justify-self')", "'flex-end safe'");
+
 debug("");
 debug("Test initial value of justify-self through JS");
 element = document.createElement("div");
 document.body.appendChild(element);
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'normal'");
 
 debug("");
 debug("Test getting and setting justify-self through JS");
+container = document.createElement("div");
 element = document.createElement("div");
-document.body.appendChild(element);
+container.appendChild(element);
+document.body.appendChild(container);
 element.style.justifySelf = "center";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'center'");
+checkValues(element, "justifySelf", "justify-self",  "center", "center");
 
-element = document.createElement("div");
-document.body.appendChild(element);
 element.style.justifySelf = "unsafe start";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start unsafe'");
+checkValues(element, "justifySelf", "justify-self",  "start unsafe", "start unsafe");
 
-element.style.justifySelf = "start";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+element.style.justifySelf = "flex-end safe";
+checkValues(element, "justifySelf", "justify-self",  "flex-end safe", "flex-end safe");
 
-debug("");
-debug("Test bad combinations of justify-self");
-element = document.createElement("div");
-document.body.appendChild(element);
-element.style.justifySelf = "start left";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
-
-element.style.justifySelf = "baseline safe";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
-
-element.style.justifySelf = "baseline center";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
-
-element.style.justifySelf = "stretch unsafe";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+element.style.justifySelf = "right";
+checkValues(element, "justifySelf", "justify-self",  "right", "right");
 
-element.style.justifySelf = "stretch right";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
-
-element.style.justifySelf = "unsafe unsafe";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+element.style.justifySelf = "center";
+checkValues(element, "justifySelf", "justify-self",  "center", "center");
 
-element.style.justifySelf = "unsafe";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+element.style.justifySelf = "self-start";
+checkValues(element, "justifySelf", "justify-self",  "self-start", "self-start");
 
-element.style.justifySelf = "unsafe safe";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+element.style.justifySelf = "auto";
+checkValues(element, "justifySelf", "justify-self",  "auto", "normal");
 
-element.style.justifySelf = "center start";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+container.style.display = "flex";
+element.style.justifySelf = "auto";
+checkValues(element, "justifySelf", "justify-self",  "auto", "normal");
 
-element.style.justifySelf = "stretch unsafe";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+container.style.display = "grid";
+element.style.justifySelf = "auto";
+checkValues(element, "justifySelf", "justify-self",  "auto", "normal");
 
-element.style.justifySelf = "safe stretch";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+element.style.justifySelf = "self-end";
+checkValues(element, "justifySelf", "justify-self",  "self-end", "self-end");
 
-element.style.justifySelf = "baseline safe";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+debug("");
+debug("Test bad combinations of justify-self");
+container = document.createElement("div");
+element = document.createElement("div");
+container.appendChild(element);
+document.body.appendChild(container);
+
+checkBadValues(element, "justifySelf", "justify-self",  "unsafe auto");
+checkBadValues(element, "justifySelf", "justify-self",  "auto safe");
+checkBadValues(element, "justifySelf", "justify-self",  "auto left");
+checkBadValues(element, "justifySelf", "justify-self",  "baseline safe");
+checkBadValues(element, "justifySelf", "justify-self",  "baseline center");
+checkBadValues(element, "justifySelf", "justify-self",  "stretch unsafe");
+checkBadValues(element, "justifySelf", "justify-self",  "stretch right");
+checkBadValues(element, "justifySelf", "justify-self",  "unsafe unsafe");
+checkBadValues(element, "justifySelf", "justify-self",  "unsafe safe");
+checkBadValues(element, "justifySelf", "justify-self",  "center start");
+checkBadValues(element, "justifySelf", "justify-self",  "stretch unsafe");
+checkBadValues(element, "justifySelf", "justify-self",  "safe stretch");
+checkBadValues(element, "justifySelf", "justify-self",  "baseline safe");
+checkBadValues(element, "justifySelf", "justify-self",  "unsafe baseline");
+checkBadValues(element, "justifySelf", "justify-self",  "unsafe safe left");
+checkBadValues(element, "justifySelf", "justify-self",  "unsafe left safe");
+checkBadValues(element, "justifySelf", "justify-self",  "left safe unsafe safe");
+checkBadValues(element, "justifySelf", "justify-self",  "legacy start");
+checkBadValues(element, "justifySelf", "justify-self",  "legacy end");
+checkBadValues(element, "justifySelf", "justify-self",  "legacy right unsafe");
+checkBadValues(element, "justifySelf", "justify-self",  "legacy auto");
+checkBadValues(element, "justifySelf", "justify-self",  "legacy stretch");
+checkBadValues(element, "justifySelf", "justify-self",  "legacy");
+checkBadValues(element, "justifySelf", "justify-self",  "legacy left right");
 
-element.style.justifySelf = "unsafe baseline";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+debug("");
+debug("Test the value 'initial'");
+container.style.display = "";
+checkInitialValues(element, "justifySelf", "justify-self", "center", "normal");
 
-element.style.justifySelf = "unsafe safe";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+debug("");
+debug("Test the value 'initial' for grid containers");
+container.style.display = "grid";
+checkInitialValues(element, "justifySelf", "justify-self", "left safe", "normal");
 
-element.style.justifySelf = "unsafe safe left";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+debug("");
+debug("Test the value 'initial' for flex containers");
+container.style.display = "flex";
+checkInitialValues(element, "justifySelf", "justify-self", "right unsafe", "normal");
 
-element.style.justifySelf = "unsafe left safe";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+debug("");
+debug("Test the value 'initial' for positioned elements");
+container.style.display = "";
+element.style.position = "absolute";
+checkInitialValues(element, "justifySelf", "justify-self", "left", "normal");
 
-element.style.justifySelf = "left safe unsafe safe";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+debug("");
+debug("Test the value 'initial' for positioned elements in grid containers");
+container.style.display = "grid";
+element.style.position = "absolute";
+checkInitialValues(element, "justifySelf", "justify-self", "right", "normal");
 
 debug("");
-debug("Test the value 'initial'");
-element.style.justifySelf = "center";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'center'");
-element.style.justifySelf = "initial";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'start'");
+debug("Test the value 'initial' for positioned elements in grid containers");
+container.style.display = "flex";
+element.style.position = "absolute";
+checkInitialValues(element, "justifySelf", "justify-self", "end", "normal");
 
 debug("");
 debug("Test the value 'inherit'");
-parentElement = document.createElement("div");
-document.body.appendChild(parentElement);
-parentElement.style.justifySelf = "end";
-shouldBe("getComputedStyle(parentElement, '').getPropertyValue('justify-self')", "'end'");
+checkInheritValues("justifySelf", "justify-self", "end");
+checkInheritValues("justifySelf", "justify-self", "left safe");
+checkInheritValues("justifySelf", "justify-self", "center unsafe");
 
-element = document.createElement("div");
-parentElement.appendChild(element);
-element.style.justifySelf = "inherit";
-shouldBe("getComputedStyle(element, '').getPropertyValue('justify-self')", "'end'");
 </script>
 </body>
 </html>
index b97022a..c8d6b27 100644 (file)
@@ -8,8 +8,10 @@ function checkValues(element, property, propertyID, value, computedValue)
 
 function checkBadValues(element, property, propertyID, value)
 {
+    var elementID = element.id || "element";
+    var initialValue = eval("window.getComputedStyle(" + elementID + " , '').getPropertyValue('" + propertyID + "')");
     element.style[property] = value;
-    checkValues(element, property, propertyID, "", "start");
+    checkValues(element, property, propertyID, "", initialValue);
 }
 
 function checkInitialValues(element, property, propertyID, value, initial)
index 166ab8e..d5a9ba2 100644 (file)
@@ -296,9 +296,9 @@ rect: style.getPropertyValue(column-width) : auto
 rect: style.getPropertyCSSValue(column-width) : [object CSSPrimitiveValue]
 rect: style.getPropertyValue(align-content) : normal
 rect: style.getPropertyCSSValue(align-content) : [object CSSValueList]
-rect: style.getPropertyValue(align-items) : start
+rect: style.getPropertyValue(align-items) : normal
 rect: style.getPropertyCSSValue(align-items) : [object CSSValueList]
-rect: style.getPropertyValue(align-self) : start
+rect: style.getPropertyValue(align-self) : normal
 rect: style.getPropertyCSSValue(align-self) : [object CSSValueList]
 rect: style.getPropertyValue(filter) : none
 rect: style.getPropertyCSSValue(filter) : [object CSSPrimitiveValue]
@@ -308,9 +308,9 @@ rect: style.getPropertyValue(flex-wrap) : nowrap
 rect: style.getPropertyCSSValue(flex-wrap) : [object CSSPrimitiveValue]
 rect: style.getPropertyValue(justify-content) : normal
 rect: style.getPropertyCSSValue(justify-content) : [object CSSValueList]
-rect: style.getPropertyValue(justify-self) : start
+rect: style.getPropertyValue(justify-self) : normal
 rect: style.getPropertyCSSValue(justify-self) : [object CSSValueList]
-rect: style.getPropertyValue(justify-items) : start
+rect: style.getPropertyValue(justify-items) : normal
 rect: style.getPropertyCSSValue(justify-items) : [object CSSValueList]
 rect: style.getPropertyValue(-webkit-font-kerning) : auto
 rect: style.getPropertyCSSValue(-webkit-font-kerning) : [object CSSPrimitiveValue]
@@ -830,9 +830,9 @@ g: style.getPropertyValue(column-width) : auto
 g: style.getPropertyCSSValue(column-width) : [object CSSPrimitiveValue]
 g: style.getPropertyValue(align-content) : normal
 g: style.getPropertyCSSValue(align-content) : [object CSSValueList]
-g: style.getPropertyValue(align-items) : start
+g: style.getPropertyValue(align-items) : normal
 g: style.getPropertyCSSValue(align-items) : [object CSSValueList]
-g: style.getPropertyValue(align-self) : start
+g: style.getPropertyValue(align-self) : normal
 g: style.getPropertyCSSValue(align-self) : [object CSSValueList]
 g: style.getPropertyValue(filter) : none
 g: style.getPropertyCSSValue(filter) : [object CSSPrimitiveValue]
@@ -842,9 +842,9 @@ g: style.getPropertyValue(flex-wrap) : nowrap
 g: style.getPropertyCSSValue(flex-wrap) : [object CSSPrimitiveValue]
 g: style.getPropertyValue(justify-content) : normal
 g: style.getPropertyCSSValue(justify-content) : [object CSSValueList]
-g: style.getPropertyValue(justify-self) : start
+g: style.getPropertyValue(justify-self) : normal
 g: style.getPropertyCSSValue(justify-self) : [object CSSValueList]
-g: style.getPropertyValue(justify-items) : start
+g: style.getPropertyValue(justify-items) : normal
 g: style.getPropertyCSSValue(justify-items) : [object CSSValueList]
 g: style.getPropertyValue(-webkit-font-kerning) : auto
 g: style.getPropertyCSSValue(-webkit-font-kerning) : [object CSSPrimitiveValue]
index 67dd6f2..bcd01b3 100644 (file)
@@ -1,3 +1,79 @@
+2016-05-30  Javier Fernandez  <jfernandez@igalia.com>
+
+        [CSS Box Alignment] New CSS Value 'normal' for Self Alignment
+        https://bugs.webkit.org/show_bug.cgi?id=156254
+
+        Reviewed by Darin Adler.
+
+        The Box Alignment specification defines a new value 'normal' to be used
+        as default for the different layout models, which will define the
+        specific behavior for each case. This patch adds a new CSS value in the
+        parsing logic and adapts the Self Alignment properties to the new
+        value.
+
+        The 'auto' value is no longer valid for the 'align-items' property and
+        the Computed Value will be always the specified value. Hence, I removed
+        the StyleResolver logic because is not required now; the specific
+        behavior of the 'normal' value will be resolved at layout time.
+
+        Additionally, this patch updates the layout logic as well, for both
+        Flexbox and Grid layout models.
+
+        Test: css3/parse-alignment-of-root-elements.html
+
+        * css/CSSComputedStyleDeclaration.cpp:
+        (WebCore::resolveLegacyJustifyItems): Added.
+        (WebCore::resolveJustifyItemsAuto): Added.
+        (WebCore::resolveJustifySelfAuto): Added.
+        (WebCore::resolveAlignSelfAuto): Added.
+        (WebCore::valueForItemPositionWithOverflowAlignment): Using a StyleSelfAlignmentData argument.
+        (WebCore::ComputedStyleExtractor::propertyValue): Using the new resolving functions.
+        * css/CSSParser.cpp:
+        (WebCore::CSSParser::parseItemPositionOverflowPosition): A new value 'normal' is now valid.
+        * css/CSSPrimitiveValueMappings.h:
+        (WebCore::CSSPrimitiveValue::CSSPrimitiveValue): Mappings for the new value 'normal'.
+        (WebCore::CSSPrimitiveValue::operator ItemPosition): Mappings for the new value 'normal'.
+        * css/CSSPropertyNames.in:
+        * css/StyleResolver.cpp:
+        (WebCore::StyleResolver::adjustRenderStyle): We don't need to resolve 'legacy" keyword.
+        * rendering/RenderBox.cpp:
+        (WebCore::flexItemHasStretchAlignment):
+        (WebCore::RenderBox::hasStretchedLogicalWidth):
+        * rendering/RenderFlexibleBox.cpp:
+        (WebCore::RenderFlexibleBox::styleDidChange):
+        (WebCore::RenderFlexibleBox::alignmentForChild):
+        (WebCore::contentAlignmentNormalBehaviorFlexibleBox):
+        (WebCore::RenderFlexibleBox::layoutAndPlaceChildren):
+        (WebCore::RenderFlexibleBox::layoutColumnReverse):
+        (WebCore::RenderFlexibleBox::alignFlexLines):
+        (WebCore::RenderFlexibleBox::alignChildren):
+        * rendering/RenderGrid.cpp:
+        (WebCore::defaultAlignmentChangedToStretchInRowAxis):
+        (WebCore::defaultAlignmentChangedFromStretchInRowAxis):
+        (WebCore::defaultAlignmentChangedFromStretchInColumnAxis):
+        (WebCore::selfAlignmentChangedToStretchInRowAxis):
+        (WebCore::selfAlignmentChangedFromStretchInRowAxis):
+        (WebCore::selfAlignmentChangedFromStretchInColumnAxis):
+        (WebCore::contentAlignmentNormalBehaviorGrid):
+        (WebCore::RenderGrid::applyStretchAlignmentToTracksIfNeeded):
+        (WebCore::RenderGrid::needToStretchChildLogicalHeight):
+        (WebCore::RenderGrid::applyStretchAlignmentToChildIfNeeded):
+        (WebCore::RenderGrid::columnAxisPositionForChild):
+        (WebCore::RenderGrid::rowAxisPositionForChild):
+        (WebCore::RenderGrid::columnAxisOffsetForChild):
+        (WebCore::RenderGrid::rowAxisOffsetForChild):
+        (WebCore::RenderGrid::computeContentPositionAndDistributionOffset):
+        * rendering/style/RenderStyle.cpp:
+        (WebCore::resolvedSelfAlignment):
+        (WebCore::RenderStyle::resolvedAlignItems):
+        (WebCore::RenderStyle::resolvedAlignSelf):
+        (WebCore::RenderStyle::resolvedJustifyItems):
+        (WebCore::RenderStyle::resolvedJustifySelf):
+        * rendering/style/RenderStyle.h:
+        * rendering/style/RenderStyleConstants.h:
+        * rendering/style/StyleRareNonInheritedData.cpp:
+        (WebCore::StyleRareNonInheritedData::StyleRareNonInheritedData): align-items uses now a different initial function.
+
 2016-05-29  Brady Eidson  <beidson@apple.com>
 
         Transition various Task/Function queues from std::function to NoncopyableFunction.
index d093352..79c5c27 100644 (file)
@@ -2275,25 +2275,47 @@ Node* ComputedStyleExtractor::styledNode() const
     return &element;
 }
 
-static ItemPosition resolveContainerAlignmentAuto(ItemPosition position, RenderObject* element)
+static StyleSelfAlignmentData resolveLegacyJustifyItems(const StyleSelfAlignmentData& data)
 {
-    if (position != ItemPositionAuto || !element)
-        return position;
+    if (data.positionType() == LegacyPosition)
+        return { data.position(), OverflowAlignmentDefault };
+    return data;
+}
 
-    return element->style().isDisplayFlexibleOrGridBox() ? ItemPositionStretch : ItemPositionStart;
+static StyleSelfAlignmentData resolveJustifyItemsAuto(const StyleSelfAlignmentData& data, Node* parent)
+{
+    if (data.position() != ItemPositionAuto)
+        return data;
+
+    // If the inherited value of justify-items includes the 'legacy' keyword, 'auto' computes to the inherited value.
+    const auto& inheritedValue = (!parent || !parent->computedStyle()) ? RenderStyle::initialDefaultAlignment() : parent->computedStyle()->justifyItems();
+    if (inheritedValue.positionType() == LegacyPosition)
+        return inheritedValue;
+    if (inheritedValue.position() == ItemPositionAuto)
+        return resolveJustifyItemsAuto(inheritedValue, parent->parentNode());
+    return { ItemPositionNormal, OverflowAlignmentDefault };
 }
 
-static ItemPosition resolveSelfAlignmentAuto(ItemPosition position, OverflowAlignment& overflow, RenderObject* element)
+static StyleSelfAlignmentData resolveJustifySelfAuto(const StyleSelfAlignmentData& data, Node* parent)
 {
-    if (position != ItemPositionAuto || !element || element->isOutOfFlowPositioned())
-        return position;
+    if (data.position() != ItemPositionAuto)
+        return data;
+
+    // The 'auto' keyword computes to the computed value of justify-items on the parent or 'normal' if the box has no parent.
+    if (!parent || !parent->computedStyle())
+        return { ItemPositionNormal, OverflowAlignmentDefault };
+    return resolveLegacyJustifyItems(resolveJustifyItemsAuto(parent->computedStyle()->justifyItems(), parent->parentNode()));
+}
 
-    RenderBlock* parent = element->containingBlock();
-    if (!parent)
-        return ItemPositionStart;
+static StyleSelfAlignmentData resolveAlignSelfAuto(const StyleSelfAlignmentData& data, Node* parent)
+{
+    if (data.position() != ItemPositionAuto)
+        return data;
 
-    overflow = parent->style().alignItemsOverflowAlignment();
-    return resolveContainerAlignmentAuto(parent->style().alignItemsPosition(), parent);
+    // The 'auto' keyword computes to the computed value of align-items on the parent or 'normal' if the box has no parent.
+    if (!parent || !parent->computedStyle())
+        return { ItemPositionNormal, OverflowAlignmentDefault };
+    return parent->computedStyle()->alignItems();
 }
 
 RefPtr<CSSValue> CSSComputedStyleDeclaration::getPropertyCSSValue(CSSPropertyID propertyID, EUpdateLayout updateLayout) const
@@ -2376,30 +2398,31 @@ static Ref<CSSValue> shapePropertyValue(const RenderStyle& style, const ShapeVal
 }
 #endif
 
-static RefPtr<CSSValueList> valueForItemPositionWithOverflowAlignment(ItemPosition itemPosition, OverflowAlignment overflowAlignment, ItemPositionType positionType)
+static Ref<CSSValueList> valueForItemPositionWithOverflowAlignment(const StyleSelfAlignmentData& data)
 {
     auto& cssValuePool = CSSValuePool::singleton();
-    RefPtr<CSSValueList> result = CSSValueList::createSpaceSeparated();
-    if (positionType == LegacyPosition)
-        result->append(CSSPrimitiveValue::createIdentifier(CSSValueLegacy));
-    result->append(cssValuePool.createValue(itemPosition));
-    if (overflowAlignment != OverflowAlignmentDefault)
-        result->append(cssValuePool.createValue(overflowAlignment));
-    ASSERT(result->length() <= 2);
+    auto result = CSSValueList::createSpaceSeparated();
+    if (data.positionType() == LegacyPosition)
+        result.get().append(cssValuePool.createIdentifierValue(CSSValueLegacy));
+    result.get().append(cssValuePool.createValue(data.position()));
+    if (data.position() >= ItemPositionCenter && data.overflow() != OverflowAlignmentDefault)
+        result.get().append(cssValuePool.createValue(data.overflow()));
+    ASSERT(result.get().length() <= 2);
     return result;
 }
 
-static RefPtr<CSSValueList> valueForContentPositionAndDistributionWithOverflowAlignment(const StyleContentAlignmentData& data)
+static Ref<CSSValueList> valueForContentPositionAndDistributionWithOverflowAlignment(const StyleContentAlignmentData& data)
 {
-    RefPtr<CSSValueList> result = CSSValueList::createSpaceSeparated();
+    auto& cssValuePool = CSSValuePool::singleton();
+    auto result = CSSValueList::createSpaceSeparated();
     if (data.distribution() != ContentDistributionDefault)
-        result->append(CSSPrimitiveValue::create(data.distribution()));
+        result.get().append(cssValuePool.createValue(data.distribution()));
     if (data.distribution() == ContentDistributionDefault || data.position() != ContentPositionNormal)
-        result->append(CSSPrimitiveValue::create(data.position()));
+        result.get().append(cssValuePool.createValue(data.position()));
     if ((data.position() >= ContentPositionCenter || data.distribution() != ContentDistributionDefault) && data.overflow() != OverflowAlignmentDefault)
-        result->append(CSSPrimitiveValue::create(data.overflow()));
-    ASSERT(result->length() > 0);
-    ASSERT(result->length() <= 3);
+        result.get().append(cssValuePool.createValue(data.overflow()));
+    ASSERT(result.get().length() > 0);
+    ASSERT(result.get().length() <= 3);
     return result;
 }
 
@@ -2779,12 +2802,9 @@ RefPtr<CSSValue> ComputedStyleExtractor::propertyValue(CSSPropertyID propertyID,
         case CSSPropertyAlignContent:
             return valueForContentPositionAndDistributionWithOverflowAlignment(style->alignContent());
         case CSSPropertyAlignItems:
-            return valueForItemPositionWithOverflowAlignment(resolveContainerAlignmentAuto(style->alignItemsPosition(), renderer), style->alignItemsOverflowAlignment(), NonLegacyPosition);
-        case CSSPropertyAlignSelf: {
-            OverflowAlignment overflow = style->alignSelfOverflowAlignment();
-            ItemPosition alignSelf = resolveSelfAlignmentAuto(style->alignSelfPosition(), overflow, renderer);
-            return valueForItemPositionWithOverflowAlignment(alignSelf, overflow, NonLegacyPosition);
-        }
+            return valueForItemPositionWithOverflowAlignment(style->alignItems());
+        case CSSPropertyAlignSelf:
+            return valueForItemPositionWithOverflowAlignment(resolveAlignSelfAuto(style->alignSelf(), styledNode->parentNode()));
         case CSSPropertyFlex:
             return getCSSPropertyValuesForShorthandProperties(flexShorthand());
         case CSSPropertyFlexBasis:
@@ -2802,12 +2822,9 @@ RefPtr<CSSValue> ComputedStyleExtractor::propertyValue(CSSPropertyID propertyID,
         case CSSPropertyJustifyContent:
             return valueForContentPositionAndDistributionWithOverflowAlignment(style->justifyContent());
         case CSSPropertyJustifyItems:
-            return valueForItemPositionWithOverflowAlignment(resolveContainerAlignmentAuto(style->justifyItemsPosition(), renderer), style->justifyItemsOverflowAlignment(), style->justifyItemsPositionType());
-        case CSSPropertyJustifySelf: {
-            OverflowAlignment overflow = style->justifySelfOverflowAlignment();
-            ItemPosition justifySelf = resolveSelfAlignmentAuto(style->justifySelfPosition(), overflow, renderer);
-            return valueForItemPositionWithOverflowAlignment(justifySelf, overflow, NonLegacyPosition);
-        }
+            return valueForItemPositionWithOverflowAlignment(resolveJustifyItemsAuto(style->justifyItems(), styledNode->parentNode()));
+        case CSSPropertyJustifySelf:
+            return valueForItemPositionWithOverflowAlignment(resolveJustifySelfAuto(style->justifySelf(), styledNode->parentNode()));
         case CSSPropertyOrder:
             return cssValuePool.createValue(style->order(), CSSPrimitiveValue::CSS_NUMBER);
         case CSSPropertyFloat:
index 22aed41..a4994f6 100644 (file)
@@ -3423,16 +3423,19 @@ RefPtr<CSSContentDistributionValue> CSSParser::parseContentDistributionOverflowP
 
 bool CSSParser::parseItemPositionOverflowPosition(CSSPropertyID propId, bool important)
 {
-    // auto | stretch | <baseline-position> | [<item-position> && <overflow-position>? ]
+    // auto | normal | stretch | <baseline-position> | [<item-position> && <overflow-position>? ]
     // <baseline-position> = baseline | last-baseline;
     // <item-position> = center | start | end | self-start | self-end | flex-start | flex-end | left | right;
-    // <overflow-position> = true | safe
+    // <overflow-position> = unsafe | safe
 
     CSSParserValue* value = m_valueList->current();
     if (!value)
         return false;
 
-    if (value->id == CSSValueAuto || value->id == CSSValueStretch || isBaselinePositionKeyword(value->id)) {
+    if (value->id == CSSValueAuto || value->id == CSSValueNormal || value->id == CSSValueStretch || isBaselinePositionKeyword(value->id)) {
+        // align-items property does not allow the 'auto' value.
+        if (value->id == CSSValueAuto && propId == CSSPropertyAlignItems)
+            return false;
         if (m_valueList->next())
             return false;
 
index 9bd0b76..4efc07f 100644 (file)
@@ -5118,6 +5118,9 @@ template<> inline CSSPrimitiveValue::CSSPrimitiveValue(ItemPosition itemPosition
     case ItemPositionAuto:
         m_value.valueID = CSSValueAuto;
         break;
+    case ItemPositionNormal:
+        m_value.valueID = CSSValueNormal;
+        break;
     case ItemPositionStretch:
         m_value.valueID = CSSValueStretch;
         break;
@@ -5162,6 +5165,8 @@ template<> inline CSSPrimitiveValue::operator ItemPosition() const
     switch (m_value.valueID) {
     case CSSValueAuto:
         return ItemPositionAuto;
+    case CSSValueNormal:
+        return ItemPositionNormal;
     case CSSValueStretch:
         return ItemPositionStretch;
     case CSSValueBaseline:
index df7981b..aac239b 100644 (file)
@@ -468,7 +468,7 @@ filter [ConditionalConverter=FilterOperations]
 -webkit-filter = filter
 align-content [Initial=initialContentAlignment, Converter=ContentAlignmentData]
 -webkit-align-content = align-content
-align-items [Initial=initialSelfAlignment, Converter=SelfOrDefaultAlignmentData]
+align-items [Initial=initialDefaultAlignment, Converter=SelfOrDefaultAlignmentData]
 -webkit-align-items = align-items
 align-self [Initial=initialSelfAlignment, Converter=SelfOrDefaultAlignmentData]
 -webkit-align-self = align-self
index d881c15..cfca06a 100644 (file)
@@ -1009,11 +1009,6 @@ void StyleResolver::adjustRenderStyle(RenderStyle& style, const RenderStyle& par
         if ((element->hasTagName(SVGNames::foreignObjectTag) || element->hasTagName(SVGNames::textTag)) && style.isDisplayInlineType())
             style.setDisplay(BLOCK);
     }
-
-    // If the inherited value of justify-items includes the legacy keyword, 'auto'
-    // computes to the the inherited value.
-    if (parentStyle.justifyItemsPositionType() == LegacyPosition && style.justifyItemsPosition() == ItemPositionAuto)
-        style.setJustifyItems(parentStyle.justifyItems());
 }
 
 bool StyleResolver::checkRegionStyle(const Element* regionElement)
index f905a21..9e1a5a2 100644 (file)
@@ -2519,7 +2519,7 @@ LayoutUnit RenderBox::computeLogicalWidthInRegionUsing(SizeType widthType, Lengt
 static bool flexItemHasStretchAlignment(const RenderBox& flexitem)
 {
     auto parent = flexitem.parent();
-    return RenderStyle::resolveAlignment(parent->style(), flexitem.style(), ItemPositionStretch) == ItemPositionStretch;
+    return flexitem.style().resolvedAlignSelf(parent->style(), ItemPositionStretch).position() == ItemPositionStretch;
 }
 
 static bool isStretchingColumnFlexItem(const RenderBox& flexitem)
@@ -2547,8 +2547,8 @@ bool RenderBox::hasStretchedLogicalWidth() const
         return false;
     }
     if (containingBlock->isHorizontalWritingMode() != isHorizontalWritingMode())
-        return RenderStyle::resolveAlignment(containingBlock->style(), style, ItemPositionStretch) == ItemPositionStretch;
-    return RenderStyle::resolveJustification(containingBlock->style(), style, ItemPositionStretch) == ItemPositionStretch;
+        return style.resolvedAlignSelf(containingBlock->style(), ItemPositionStretch).position() == ItemPositionStretch;
+    return style.resolvedJustifySelf(containingBlock->style(), ItemPositionStretch).position() == ItemPositionStretch;
 }
 
 bool RenderBox::sizesLogicalWidthToFitContent(SizeType widthType) const
index 3297151..377a3c7 100644 (file)
@@ -39,6 +39,8 @@
 
 namespace WebCore {
 
+static constexpr ItemPosition selfAlignmentNormalBehaviorFlexibleBox = ItemPositionStretch;
+
 struct RenderFlexibleBox::LineContext {
     LineContext(LayoutUnit crossAxisOffset, LayoutUnit crossAxisExtent, size_t numberOfChildren, LayoutUnit maxAscent)
         : crossAxisOffset(crossAxisOffset)
@@ -231,12 +233,14 @@ void RenderFlexibleBox::styleDidChange(StyleDifference diff, const RenderStyle*
 {
     RenderBlock::styleDidChange(diff, oldStyle);
 
-    if (oldStyle && (oldStyle->alignItemsPosition() == ItemPositionStretch || oldStyle->alignItemsPosition() == ItemPositionAuto) && diff == StyleDifferenceLayout) {
+    if (oldStyle && oldStyle->resolvedAlignItems(selfAlignmentNormalBehaviorFlexibleBox).position() == ItemPositionStretch && diff == StyleDifferenceLayout) {
         // Flex items that were previously stretching need to be relayed out so we can compute new available cross axis space.
         // This is only necessary for stretching since other alignment values don't change the size of the box.
+        auto& newStyle = style();
         for (RenderBox* child = firstChildBox(); child; child = child->nextSiblingBox()) {
-            ItemPosition previousAlignment = RenderStyle::resolveAlignment(*oldStyle, child->style(), ItemPositionStretch);
-            if (previousAlignment == ItemPositionStretch && previousAlignment != RenderStyle::resolveAlignment(style(), child->style(), ItemPositionStretch))
+            auto& childStyle = child->style();
+            auto previousAlignment = childStyle.resolvedAlignSelf(*oldStyle, selfAlignmentNormalBehaviorFlexibleBox).position();
+            if (previousAlignment == ItemPositionStretch && previousAlignment != childStyle.resolvedAlignSelf(newStyle, selfAlignmentNormalBehaviorFlexibleBox).position())
                 child->setChildNeedsLayout(MarkOnlyThis);
         }
     }
@@ -1046,7 +1050,7 @@ void RenderFlexibleBox::prepareChildForPositionedLayout(RenderBox& child, Layout
 
 ItemPosition RenderFlexibleBox::alignmentForChild(RenderBox& child) const
 {
-    ItemPosition align = RenderStyle::resolveAlignment(style(), child.style(), ItemPositionStretch);
+    ItemPosition align = child.style().resolvedAlignSelf(style(), selfAlignmentNormalBehaviorFlexibleBox).position();
 
     if (align == ItemPositionBaseline && hasOrthogonalFlow(child))
         align = ItemPositionFlexStart;
@@ -1094,7 +1098,7 @@ EOverflow RenderFlexibleBox::mainAxisOverflowForChild(RenderBox& child) const
     return child.style().overflowY();
 }
 
-static const StyleContentAlignmentData& normalValueBehaviorFlexibleBox()
+static const StyleContentAlignmentData& contentAlignmentNormalBehaviorFlexibleBox()
 {
     // The justify-content property applies along the main axis, but since flexing
     // in the main axis is controlled by flex, stretch behaves as flex-start (ignoring
@@ -1108,8 +1112,8 @@ void RenderFlexibleBox::layoutAndPlaceChildren(LayoutUnit& crossAxisOffset, cons
 {
     ASSERT(childSizes.size() == children.size());
 
-    ContentPosition position = style().resolvedJustifyContentPosition(normalValueBehaviorFlexibleBox());
-    ContentDistributionType distribution = style().resolvedJustifyContentDistribution(normalValueBehaviorFlexibleBox());
+    auto position = style().resolvedJustifyContentPosition(contentAlignmentNormalBehaviorFlexibleBox());
+    auto distribution = style().resolvedJustifyContentDistribution(contentAlignmentNormalBehaviorFlexibleBox());
 
     size_t numberOfChildrenForJustifyContent = numberOfInFlowPositionedChildren(children);
     LayoutUnit autoMarginOffset = autoMarginOffsetInMainAxis(children, availableFreeSpace);
@@ -1192,8 +1196,8 @@ void RenderFlexibleBox::layoutAndPlaceChildren(LayoutUnit& crossAxisOffset, cons
 
 void RenderFlexibleBox::layoutColumnReverse(const OrderedFlexItemList& children, LayoutUnit crossAxisOffset, LayoutUnit availableFreeSpace)
 {
-    ContentPosition position = style().resolvedJustifyContentPosition(normalValueBehaviorFlexibleBox());
-    ContentDistributionType distribution = style().resolvedJustifyContentDistribution(normalValueBehaviorFlexibleBox());
+    auto position = style().resolvedJustifyContentPosition(contentAlignmentNormalBehaviorFlexibleBox());
+    auto distribution = style().resolvedJustifyContentDistribution(contentAlignmentNormalBehaviorFlexibleBox());
 
     // 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
@@ -1250,8 +1254,8 @@ static LayoutUnit alignContentSpaceBetweenChildren(LayoutUnit availableFreeSpace
 
 void RenderFlexibleBox::alignFlexLines(Vector<LineContext>& lineContexts)
 {
-    ContentPosition position = style().resolvedAlignContentPosition(normalValueBehaviorFlexibleBox());
-    ContentDistributionType distribution = style().resolvedAlignContentDistribution(normalValueBehaviorFlexibleBox());
+    ContentPosition position = style().resolvedAlignContentPosition(contentAlignmentNormalBehaviorFlexibleBox());
+    ContentDistributionType distribution = style().resolvedAlignContentDistribution(contentAlignmentNormalBehaviorFlexibleBox());
 
     if (!isMultiline() || position == ContentPositionFlexStart)
         return;
@@ -1313,6 +1317,7 @@ void RenderFlexibleBox::alignChildren(const Vector<LineContext>& lineContexts)
 
             switch (alignmentForChild(*child)) {
             case ItemPositionAuto:
+            case ItemPositionNormal:
                 ASSERT_NOT_REACHED();
                 break;
             case ItemPositionStart:
index b9fffe1..a75fc15 100644 (file)
@@ -39,6 +39,7 @@
 namespace WebCore {
 
 static const int infinity = -1;
+static constexpr ItemPosition selfAlignmentNormalBehavior = ItemPositionStretch;
 
 class GridTrack {
 public:
@@ -264,35 +265,35 @@ static inline bool defaultAlignmentIsStretch(ItemPosition position)
 
 static inline bool defaultAlignmentChangedToStretchInRowAxis(const RenderStyle& oldStyle, const RenderStyle& newStyle)
 {
-    return !defaultAlignmentIsStretch(oldStyle.justifyItemsPosition()) && defaultAlignmentIsStretch(newStyle.justifyItemsPosition());
+    return !defaultAlignmentIsStretch(oldStyle.justifyItems().position()) && defaultAlignmentIsStretch(newStyle.justifyItems().position());
 }
 
 static inline bool defaultAlignmentChangedFromStretchInRowAxis(const RenderStyle& oldStyle, const RenderStyle& newStyle)
 {
-    return defaultAlignmentIsStretch(oldStyle.justifyItemsPosition()) && !defaultAlignmentIsStretch(newStyle.justifyItemsPosition());
+    return defaultAlignmentIsStretch(oldStyle.justifyItems().position()) && !defaultAlignmentIsStretch(newStyle.justifyItems().position());
 }
 
 static inline bool defaultAlignmentChangedFromStretchInColumnAxis(const RenderStyle& oldStyle, const RenderStyle& newStyle)
 {
-    return defaultAlignmentIsStretch(oldStyle.alignItemsPosition()) && !defaultAlignmentIsStretch(newStyle.alignItemsPosition());
+    return defaultAlignmentIsStretch(oldStyle.alignItems().position()) && !defaultAlignmentIsStretch(newStyle.alignItems().position());
 }
 
 static inline bool selfAlignmentChangedToStretchInRowAxis(const RenderStyle& oldStyle, const RenderStyle& newStyle, const RenderStyle& childStyle)
 {
-    return RenderStyle::resolveJustification(oldStyle, childStyle, ItemPositionStretch) != ItemPositionStretch
-        && RenderStyle::resolveJustification(newStyle, childStyle, ItemPositionStretch) == ItemPositionStretch;
+    return childStyle.resolvedJustifySelf(oldStyle, selfAlignmentNormalBehavior).position() != ItemPositionStretch
+        && childStyle.resolvedJustifySelf(newStyle, selfAlignmentNormalBehavior).position() == ItemPositionStretch;
 }
 
 static inline bool selfAlignmentChangedFromStretchInRowAxis(const RenderStyle& oldStyle, const RenderStyle& newStyle, const RenderStyle& childStyle)
 {
-    return RenderStyle::resolveJustification(oldStyle, childStyle, ItemPositionStretch) == ItemPositionStretch
-        && RenderStyle::resolveJustification(newStyle, childStyle, ItemPositionStretch) != ItemPositionStretch;
+    return childStyle.resolvedJustifySelf(oldStyle, selfAlignmentNormalBehavior).position() == ItemPositionStretch
+        && childStyle.resolvedJustifySelf(newStyle, selfAlignmentNormalBehavior).position() != ItemPositionStretch;
 }
 
 static inline bool selfAlignmentChangedFromStretchInColumnAxis(const RenderStyle& oldStyle, const RenderStyle& newStyle, const RenderStyle& childStyle)
 {
-    return RenderStyle::resolveAlignment(oldStyle, childStyle, ItemPositionStretch) == ItemPositionStretch
-        && RenderStyle::resolveAlignment(newStyle, childStyle, ItemPositionStretch) != ItemPositionStretch;
+    return childStyle.resolvedAlignSelf(oldStyle, selfAlignmentNormalBehavior).position() == ItemPositionStretch
+        && childStyle.resolvedAlignSelf(newStyle, selfAlignmentNormalBehavior).position() != ItemPositionStretch;
 }
 
 void RenderGrid::styleDidChange(StyleDifference diff, const RenderStyle* oldStyle)
@@ -1511,7 +1512,7 @@ void RenderGrid::clearGrid()
     m_gridItemArea.clear();
 }
 
-static const StyleContentAlignmentData& normalValueBehaviorGrid()
+static const StyleContentAlignmentData& contentAlignmentNormalBehaviorGrid()
 {
     static const StyleContentAlignmentData normalBehavior = {ContentPositionNormal, ContentDistributionStretch};
     return normalBehavior;
@@ -1522,8 +1523,8 @@ void RenderGrid::applyStretchAlignmentToTracksIfNeeded(GridTrackSizingDirection
     Optional<LayoutUnit> freeSpace = sizingData.freeSpaceForDirection(direction);
     if (!freeSpace
         || freeSpace.value() <= 0
-        || (direction == ForColumns && style().resolvedJustifyContentDistribution(normalValueBehaviorGrid()) != ContentDistributionStretch)
-        || (direction == ForRows && style().resolvedAlignContentDistribution(normalValueBehaviorGrid()) != ContentDistributionStretch))
+        || (direction == ForColumns && style().resolvedJustifyContentDistribution(contentAlignmentNormalBehaviorGrid()) != ContentDistributionStretch)
+        || (direction == ForRows && style().resolvedAlignContentDistribution(contentAlignmentNormalBehaviorGrid()) != ContentDistributionStretch))
         return;
 
     // Spec defines auto-sized tracks as the ones with an 'auto' max-sizing function.
@@ -1803,7 +1804,7 @@ static inline LayoutUnit computeOverflowAlignmentOffset(OverflowAlignment overfl
 // FIXME: This logic is shared by RenderFlexibleBox, so it should be moved to RenderBox.
 bool RenderGrid::needToStretchChildLogicalHeight(const RenderBox& child) const
 {
-    if (RenderStyle::resolveAlignment(style(), child.style(), ItemPositionStretch) != ItemPositionStretch)
+    if (child.style().resolvedAlignSelf(style(), selfAlignmentNormalBehavior).position() != ItemPositionStretch)
         return false;
 
     return isHorizontalWritingMode() && child.style().height().isAuto();
@@ -1852,7 +1853,7 @@ void RenderGrid::applyStretchAlignmentToChildIfNeeded(RenderBox& child)
     bool isHorizontalMode = isHorizontalWritingMode();
     bool hasAutoSizeInColumnAxis = isHorizontalMode ? childStyle.height().isAuto() : childStyle.width().isAuto();
     bool allowedToStretchChildAlongColumnAxis = hasAutoSizeInColumnAxis && !childStyle.marginBeforeUsing(&gridStyle).isAuto() && !childStyle.marginAfterUsing(&gridStyle).isAuto();
-    if (allowedToStretchChildAlongColumnAxis && RenderStyle::resolveAlignment(gridStyle, childStyle, ItemPositionStretch) == ItemPositionStretch) {
+    if (allowedToStretchChildAlongColumnAxis && childStyle.resolvedAlignSelf(style(), selfAlignmentNormalBehavior).position() == ItemPositionStretch) {
         // TODO (lajava): If the child has orthogonal flow, then it already has an override height set, so use it.
         // TODO (lajava): grid track sizing and positioning do not support orthogonal modes yet.
         if (child.isHorizontalWritingMode() == isHorizontalMode) {
@@ -1933,7 +1934,7 @@ GridAxisPosition RenderGrid::columnAxisPositionForChild(const RenderBox& child)
     bool hasOrthogonalWritingMode = child.isHorizontalWritingMode() != isHorizontalWritingMode();
     bool hasSameWritingMode = child.style().writingMode() == style().writingMode();
 
-    switch (RenderStyle::resolveAlignment(style(), child.style(), ItemPositionStretch)) {
+    switch (child.style().resolvedAlignSelf(style(), selfAlignmentNormalBehavior).position()) {
     case ItemPositionSelfStart:
         // If orthogonal writing-modes, this computes to 'start'.
         // FIXME: grid track sizing and positioning do not support orthogonal modes yet.
@@ -1969,6 +1970,7 @@ GridAxisPosition RenderGrid::columnAxisPositionForChild(const RenderBox& child)
         // FIXME: Implement the previous values. For now, we always 'start' align the child.
         return GridAxisStart;
     case ItemPositionAuto:
+    case ItemPositionNormal:
         break;
     }
 
@@ -1982,7 +1984,7 @@ GridAxisPosition RenderGrid::rowAxisPositionForChild(const RenderBox& child) con
     bool hasSameDirection = child.style().direction() == style().direction();
     bool isLTR = style().isLeftToRightDirection();
 
-    switch (RenderStyle::resolveJustification(style(), child.style(), ItemPositionStretch)) {
+    switch (child.style().resolvedJustifySelf(style(), selfAlignmentNormalBehavior).position()) {
     case ItemPositionSelfStart:
         // For orthogonal writing-modes, this computes to 'start'
         // FIXME: grid track sizing and positioning do not support orthogonal modes yet.
@@ -2011,6 +2013,7 @@ GridAxisPosition RenderGrid::rowAxisPositionForChild(const RenderBox& child) con
         // FIXME: Implement the previous values. For now, we always 'start' align the child.
         return GridAxisStart;
     case ItemPositionAuto:
+    case ItemPositionNormal:
         break;
     }
 
@@ -2040,7 +2043,8 @@ LayoutUnit RenderGrid::columnAxisOffsetForChild(const RenderBox& child) const
         if (childEndLine < m_rowPositions.size() - 1)
             endOfRow -= guttersSize(ForRows, 2) + m_offsetBetweenRows;
         LayoutUnit childBreadth = child.logicalHeight() + child.marginLogicalHeight();
-        LayoutUnit offsetFromStartPosition = computeOverflowAlignmentOffset(RenderStyle::resolveAlignmentOverflow(style(), child.style()), endOfRow - startOfRow, childBreadth);
+        auto overflow = child.style().resolvedAlignSelf(style(), selfAlignmentNormalBehavior).overflow();
+        LayoutUnit offsetFromStartPosition = computeOverflowAlignmentOffset(overflow, endOfRow - startOfRow, childBreadth);
         return startPosition + (axisPosition == GridAxisEnd ? offsetFromStartPosition : offsetFromStartPosition / 2);
     }
     }
@@ -2072,7 +2076,8 @@ LayoutUnit RenderGrid::rowAxisOffsetForChild(const RenderBox& child) const
         if (childEndLine < m_columnPositions.size() - 1)
             endOfColumn -= guttersSize(ForColumns, 2) + m_offsetBetweenColumns;
         LayoutUnit childBreadth = child.logicalWidth() + child.marginLogicalWidth();
-        LayoutUnit offsetFromStartPosition = computeOverflowAlignmentOffset(RenderStyle::resolveJustificationOverflow(style(), child.style()), endOfColumn - startOfColumn, childBreadth);
+        auto overflow = child.style().resolvedJustifySelf(style(), selfAlignmentNormalBehavior).overflow();
+        LayoutUnit offsetFromStartPosition = computeOverflowAlignmentOffset(overflow, endOfColumn - startOfColumn, childBreadth);
         return startPosition + (axisPosition == GridAxisEnd ? offsetFromStartPosition : offsetFromStartPosition / 2);
     }
     }
@@ -2134,15 +2139,15 @@ static ContentAlignmentData contentDistributionOffset(const LayoutUnit& availabl
 ContentAlignmentData RenderGrid::computeContentPositionAndDistributionOffset(GridTrackSizingDirection direction, const LayoutUnit& availableFreeSpace, unsigned numberOfGridTracks) const
 {
     bool isRowAxis = direction == ForColumns;
-    ContentPosition position = isRowAxis ? style().resolvedJustifyContentPosition(normalValueBehaviorGrid()) : style().resolvedAlignContentPosition(normalValueBehaviorGrid());
-    ContentDistributionType distribution = isRowAxis ? style().resolvedJustifyContentDistribution(normalValueBehaviorGrid()) : style().resolvedAlignContentDistribution(normalValueBehaviorGrid());
+    auto position = isRowAxis ? style().resolvedJustifyContentPosition(contentAlignmentNormalBehaviorGrid()) : style().resolvedAlignContentPosition(contentAlignmentNormalBehaviorGrid());
+    auto distribution = isRowAxis ? style().resolvedJustifyContentDistribution(contentAlignmentNormalBehaviorGrid()) : style().resolvedAlignContentDistribution(contentAlignmentNormalBehaviorGrid());
     // If <content-distribution> value can't be applied, 'position' will become the associated
     // <content-position> fallback value.
-    ContentAlignmentData contentAlignment = contentDistributionOffset(availableFreeSpace, position, distribution, numberOfGridTracks);
+    auto contentAlignment = contentDistributionOffset(availableFreeSpace, position, distribution, numberOfGridTracks);
     if (contentAlignment.isValid())
         return contentAlignment;
 
-    OverflowAlignment overflow = isRowAxis ? style().justifyContentOverflowAlignment() : style().alignContentOverflowAlignment();
+    auto overflow = isRowAxis ? style().justifyContentOverflowAlignment() : style().alignContentOverflowAlignment();
     if (availableFreeSpace <= 0 && overflow == OverflowAlignmentSafe)
         return {0, 0};
 
index 1a9b200..f813ecd 100644 (file)
@@ -190,40 +190,46 @@ RenderStyle::~RenderStyle()
 #endif
 }
 
-static inline StyleSelfAlignmentData resolveAlignmentData(const RenderStyle& parentStyle, const RenderStyle& childStyle, ItemPosition resolvedAutoPositionForRenderer)
+static StyleSelfAlignmentData resolvedSelfAlignment(const StyleSelfAlignmentData& value, ItemPosition normalValueBehavior)
 {
-    // The auto keyword computes to the parent's align-items computed value, or to "stretch", if not set or "auto".
-    if (childStyle.alignSelfPosition() == ItemPositionAuto)
-        return (parentStyle.alignItemsPosition() == ItemPositionAuto) ? StyleSelfAlignmentData(resolvedAutoPositionForRenderer, OverflowAlignmentDefault) : parentStyle.alignItems();
-    return childStyle.alignSelf();
+    ASSERT(value.position() != ItemPositionAuto);
+    if (value.position() == ItemPositionNormal)
+        return { normalValueBehavior, OverflowAlignmentDefault };
+    return value;
 }
 
-static inline StyleSelfAlignmentData resolveJustificationData(const RenderStyle& parentStyle, const RenderStyle& childStyle, ItemPosition resolvedAutoPositionForRenderer)
+StyleSelfAlignmentData RenderStyle::resolvedAlignItems(ItemPosition normalValueBehaviour) const
 {
-    // The auto keyword computes to the parent's justify-items computed value, or to "stretch", if not set or "auto".
-    if (childStyle.justifySelfPosition() == ItemPositionAuto)
-        return (parentStyle.justifyItemsPosition() == ItemPositionAuto) ? StyleSelfAlignmentData(resolvedAutoPositionForRenderer, OverflowAlignmentDefault) : parentStyle.justifyItems();
-    return childStyle.justifySelf();
+    return resolvedSelfAlignment(alignItems(), normalValueBehaviour);
 }
 
-ItemPosition RenderStyle::resolveAlignment(const RenderStyle& parentStyle, const RenderStyle& childStyle, ItemPosition resolvedAutoPositionForRenderer)
+StyleSelfAlignmentData RenderStyle::resolvedAlignSelf(const RenderStyle& parentStyle, ItemPosition normalValueBehaviour) const
 {
-    return resolveAlignmentData(parentStyle, childStyle, resolvedAutoPositionForRenderer).position();
+    // The auto keyword computes to the parent's align-items computed value.
+    // We will return the behaviour of 'normal' value if needed, which is specific of each layout model.
+    if (alignSelfPosition() == ItemPositionAuto)
+        return parentStyle.resolvedAlignItems(normalValueBehaviour);
+    return resolvedSelfAlignment(alignSelf(), normalValueBehaviour);
 }
 
-OverflowAlignment RenderStyle::resolveAlignmentOverflow(const RenderStyle& parentStyle, const RenderStyle& childStyle)
+StyleSelfAlignmentData RenderStyle::resolvedJustifyItems(ItemPosition normalValueBehaviour) const
 {
-    return resolveAlignmentData(parentStyle, childStyle, ItemPositionStretch).overflow();
-}
+    // FIXME: justify-items 'auto' value is allowed only to provide the 'legacy' keyword's behavior, which it's still not implemented for layout.
+    // "If the inherited value of justify-items includes the legacy keyword, auto computes to the inherited value."
+    // https://drafts.csswg.org/css-align/#justify-items-property
+    if (justifyItemsPosition() == ItemPositionAuto)
+        return { normalValueBehaviour, OverflowAlignmentDefault };
 
-ItemPosition RenderStyle::resolveJustification(const RenderStyle& parentStyle, const RenderStyle& childStyle, ItemPosition resolvedAutoPositionForRenderer)
-{
-    return resolveJustificationData(parentStyle, childStyle, resolvedAutoPositionForRenderer).position();
+    return resolvedSelfAlignment(justifyItems(), normalValueBehaviour);
 }
 
-OverflowAlignment RenderStyle::resolveJustificationOverflow(const RenderStyle& parentStyle, const RenderStyle& childStyle)
+StyleSelfAlignmentData RenderStyle::resolvedJustifySelf(const RenderStyle& parentStyle, ItemPosition normalValueBehaviour) const
 {
-    return resolveJustificationData(parentStyle, childStyle, ItemPositionStretch).overflow();
+    // The auto keyword computes to the parent's justify-items computed value.
+    // We will return the behaviour of 'normal' value if needed, which is specific of each layout model.
+    if (justifySelfPosition() == ItemPositionAuto)
+        return parentStyle.resolvedJustifyItems(normalValueBehaviour);
+    return resolvedSelfAlignment(justifySelf(), normalValueBehaviour);
 }
 
 static inline ContentPosition resolvedContentAlignmentPosition(const StyleContentAlignmentData& value, const StyleContentAlignmentData& normalValueBehavior)
index 74a45d8..5ad3184 100644 (file)
@@ -508,10 +508,10 @@ public:
     ContentDistributionType resolvedJustifyContentDistribution(const StyleContentAlignmentData& normalValueBehavior) const;
     ContentPosition resolvedAlignContentPosition(const StyleContentAlignmentData& normalValueBehavior) const;
     ContentDistributionType resolvedAlignContentDistribution(const StyleContentAlignmentData& normalValueBehavior) const;
-    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);
-    static OverflowAlignment resolveJustificationOverflow(const RenderStyle& parentStyle, const RenderStyle& childStyle);
+    StyleSelfAlignmentData resolvedAlignItems(ItemPosition normalValueBehaviour) const;
+    StyleSelfAlignmentData resolvedAlignSelf(const RenderStyle& parentStyle, ItemPosition normalValueBehaviour) const;
+    StyleSelfAlignmentData resolvedJustifyItems(ItemPosition normalValueBehaviour) const;
+    StyleSelfAlignmentData resolvedJustifySelf(const RenderStyle& parentStyle, ItemPosition normalValueBehaviour) const;
 
     enum IsAtShadowBoundary {
         AtShadowBoundary,
@@ -2004,6 +2004,7 @@ public:
     static Length initialFlexBasis() { return Length(Auto); }
     static int initialOrder() { return 0; }
     static StyleSelfAlignmentData initialSelfAlignment() { return StyleSelfAlignmentData(ItemPositionAuto, OverflowAlignmentDefault); }
+    static StyleSelfAlignmentData initialDefaultAlignment() { return StyleSelfAlignmentData(ItemPositionNormal, OverflowAlignmentDefault); }
     static StyleContentAlignmentData initialContentAlignment() { return StyleContentAlignmentData(ContentPositionNormal, ContentDistributionDefault, OverflowAlignmentDefault); }
     static EFlexDirection initialFlexDirection() { return FlowRow; }
     static EFlexWrap initialFlexWrap() { return FlexNoWrap; }
index cf559f8..3518c2f 100644 (file)
@@ -254,11 +254,11 @@ enum EBoxDirection { BNORMAL, BREVERSE };
 enum EAlignContent { AlignContentFlexStart, AlignContentFlexEnd, AlignContentCenter, AlignContentSpaceBetween, AlignContentSpaceAround, AlignContentStretch };
 enum EFlexDirection { FlowRow, FlowRowReverse, FlowColumn, FlowColumnReverse };
 enum EFlexWrap { FlexNoWrap, FlexWrap, FlexWrapReverse };
-enum ItemPosition {ItemPositionAuto, ItemPositionStretch, ItemPositionBaseline, ItemPositionLastBaseline, ItemPositionCenter, ItemPositionStart, ItemPositionEnd, ItemPositionSelfStart, ItemPositionSelfEnd, ItemPositionFlexStart, ItemPositionFlexEnd, ItemPositionLeft, ItemPositionRight};
-enum OverflowAlignment {OverflowAlignmentDefault, OverflowAlignmentUnsafe, OverflowAlignmentSafe};
-enum ItemPositionType {NonLegacyPosition, LegacyPosition};
-enum ContentPosition {ContentPositionNormal, ContentPositionBaseline, ContentPositionLastBaseline, ContentPositionCenter, ContentPositionStart, ContentPositionEnd, ContentPositionFlexStart, ContentPositionFlexEnd, ContentPositionLeft, ContentPositionRight};
-enum ContentDistributionType {ContentDistributionDefault, ContentDistributionSpaceBetween, ContentDistributionSpaceAround, ContentDistributionSpaceEvenly, ContentDistributionStretch};
+enum ItemPosition { ItemPositionAuto, ItemPositionNormal, ItemPositionStretch, ItemPositionBaseline, ItemPositionLastBaseline, ItemPositionCenter, ItemPositionStart, ItemPositionEnd, ItemPositionSelfStart, ItemPositionSelfEnd, ItemPositionFlexStart, ItemPositionFlexEnd, ItemPositionLeft, ItemPositionRight };
+enum OverflowAlignment { OverflowAlignmentDefault, OverflowAlignmentUnsafe, OverflowAlignmentSafe };
+enum ItemPositionType { NonLegacyPosition, LegacyPosition };
+enum ContentPosition { ContentPositionNormal, ContentPositionBaseline, ContentPositionLastBaseline, ContentPositionCenter, ContentPositionStart, ContentPositionEnd, ContentPositionFlexStart, ContentPositionFlexEnd, ContentPositionLeft, ContentPositionRight };
+enum ContentDistributionType { ContentDistributionDefault, ContentDistributionSpaceBetween, ContentDistributionSpaceAround, ContentDistributionSpaceEvenly, ContentDistributionStretch };
 
 enum ETextSecurity {
     TSNONE, TSDISC, TSCIRCLE, TSSQUARE
index bfdcf87..09d5aa4 100644 (file)
@@ -75,7 +75,7 @@ StyleRareNonInheritedData::StyleRareNonInheritedData()
     , m_flowThread(RenderStyle::initialFlowThread())
     , m_regionThread(RenderStyle::initialRegionThread())
     , m_alignContent(RenderStyle::initialContentAlignment())
-    , m_alignItems(RenderStyle::initialSelfAlignment())
+    , m_alignItems(RenderStyle::initialDefaultAlignment())
     , m_alignSelf(RenderStyle::initialSelfAlignment())
     , m_justifyContent(RenderStyle::initialContentAlignment())
     , m_justifyItems(RenderStyle::initialSelfAlignment())