CSS scroll-snap-destination and scroll-snap-coordinate are not honoring position...
authorbfulgham@apple.com <bfulgham@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 10 Mar 2015 23:19:38 +0000 (23:19 +0000)
committerbfulgham@apple.com <bfulgham@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 10 Mar 2015 23:19:38 +0000 (23:19 +0000)
https://bugs.webkit.org/show_bug.cgi?id=142411

Reviewed by Simon Fraser.

Source/WebCore:

Tested by css3/scroll-snap/scroll-snap-position-values.html.

Revise the CSSParser to recognize that scroll-snap-coordinates and scroll-snap-destination
may be specified as positions, therefore allowing 'top', 'bottom', and 'center' for the Y axis,
and 'left', 'right', and 'center' for the X axis.

Correct implementation to support calculated values for Scroll Snap Point markup. This required the
Scroll Snap Point-specific LengthRepeat class to change its internal representation from a CSSPrimitiveValue
to a regular CSSValue.

Add tests that these position labels, as well as combinations with percentages and pixel offsets
are parsed properly.

* css/CSSComputedStyleDeclaration.cpp:
(WebCore::scrollSnapDestination): Switch from 'percentageOrZoomAdjustedValue' to 'zoomAdjustedPixelValueForLength'
when working with Length values. This is necessary to allow calculated results to be based on the proper default
page dimensions.
(WebCore::scrollSnapPoints): Ditto.
(WebCore::scrollSnapCoordinates): Ditto.
* css/CSSParser.cpp:
(WebCore::CSSParser::parseScrollSnapPositions): Consolidated code for dealing with snap point
positions.
(WebCore::CSSParser::parseScrollSnapDestination): Revise to call new helper function.
(WebCore::CSSParser::parseScrollSnapCoordinate): Ditto.
(WebCore::CSSParser::parseFillPositionX): Rename as parsePositionX.
(WebCore::CSSParser::parseFillPositionY): Rename as parsePositionY.
(WebCore::CSSParser::parseFillProperty): Update to call renamed parsePosition{X|Y} methods.
(WebCore::CSSParser::parseTransformOrigin): Ditto.
(WebCore::CSSParser::parsePerspectiveOrigin): Ditto.
* css/CSSParser.h:
* css/LengthRepeat.h: Revise class to use a CSSValue, rather than a CSSPrimitiveValue, so that we can represent
repeat values as calculations.

LayoutTests:

Add a test for <position> types in scroll snap operations. Also update the test expectations
for computed styles now that double-precision math is being used for calculated values.

* css3/scroll-snap/scroll-snap-position-values-expected.txt: Added.
* css3/scroll-snap/scroll-snap-position-values.html: Added.
* css3/scroll-snap/scroll-snap-property-computed-style-expected.txt: Updated
* css3/scroll-snap/scroll-snap-property-computed-style.js: Updated

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

LayoutTests/ChangeLog
LayoutTests/css3/scroll-snap/scroll-snap-position-values-expected.txt [new file with mode: 0644]
LayoutTests/css3/scroll-snap/scroll-snap-position-values.html [new file with mode: 0644]
LayoutTests/css3/scroll-snap/scroll-snap-property-computed-style-expected.txt
LayoutTests/css3/scroll-snap/scroll-snap-property-computed-style.js
Source/WebCore/ChangeLog
Source/WebCore/css/CSSComputedStyleDeclaration.cpp
Source/WebCore/css/CSSParser.cpp
Source/WebCore/css/CSSParser.h
Source/WebCore/css/LengthRepeat.h
Source/WebCore/css/StyleBuilderConverter.h

index c993024..e6290eb 100644 (file)
@@ -1,3 +1,19 @@
+2015-03-10  Brent Fulgham  <bfulgham@apple.com>
+
+        CSS scroll-snap-destination and scroll-snap-coordinate are not honoring position values
+        https://bugs.webkit.org/show_bug.cgi?id=142411
+
+        Reviewed by Simon Fraser.
+
+        Add a test for <position> types in scroll snap operations. Also update the test expectations
+        for computed styles now that double-precision math is being used for calculated values.
+
+        * css3/scroll-snap/scroll-snap-position-values-expected.txt: Added.
+        * css3/scroll-snap/scroll-snap-position-values.html: Added.
+        * css3/scroll-snap/scroll-snap-property-computed-style-expected.txt: Updated
+        * css3/scroll-snap/scroll-snap-property-computed-style.js: Updated
+
+
 2015-03-10  Enrica Casucci  <enrica@apple.com>
 
         Add support for more emoji with variation.
diff --git a/LayoutTests/css3/scroll-snap/scroll-snap-position-values-expected.txt b/LayoutTests/css3/scroll-snap/scroll-snap-position-values-expected.txt
new file mode 100644 (file)
index 0000000..64c9689
--- /dev/null
@@ -0,0 +1,99 @@
+Tests 'initial' on scroll snap properties.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS noInitial.style['-webkit-scroll-snap-type'] is ""
+PASS window.getComputedStyle(noInitial).getPropertyValue('-webkit-scroll-snap-type') is "mandatory"
+PASS noInitial.style['-webkit-scroll-snap-points-x'] is ""
+PASS window.getComputedStyle(noInitial).getPropertyValue('-webkit-scroll-snap-points-x') is "repeat(100%)"
+PASS noInitial.style['-webkit-scroll-snap-points-y'] is ""
+PASS window.getComputedStyle(noInitial).getPropertyValue('-webkit-scroll-snap-points-y') is "repeat(100%)"
+PASS noInitial.style['-webkit-scroll-snap-destination'] is "100% 100%"
+PASS window.getComputedStyle(noInitial).getPropertyValue('-webkit-scroll-snap-destination') is "100% 100%"
+PASS noInitial.style['-webkit-scroll-snap-coordinate'] is "0% 0%"
+PASS window.getComputedStyle(noInitial).getPropertyValue('-webkit-scroll-snap-coordinate') is "0% 0%"
+PASS initialType.style['-webkit-scroll-snap-type'] is "initial"
+PASS window.getComputedStyle(initialType).getPropertyValue('-webkit-scroll-snap-type') is "none"
+PASS initialType.style['-webkit-scroll-snap-points-x'] is ""
+PASS window.getComputedStyle(initialType).getPropertyValue('-webkit-scroll-snap-points-x') is "repeat(100%)"
+PASS initialType.style['-webkit-scroll-snap-points-y'] is ""
+PASS window.getComputedStyle(initialType).getPropertyValue('-webkit-scroll-snap-points-y') is "repeat(100%)"
+PASS initialType.style['-webkit-scroll-snap-destination'] is "0% 0%"
+PASS window.getComputedStyle(initialType).getPropertyValue('-webkit-scroll-snap-destination') is "0% 0%"
+PASS initialType.style['-webkit-scroll-snap-coordinate'] is "100% 100%"
+PASS window.getComputedStyle(initialType).getPropertyValue('-webkit-scroll-snap-coordinate') is "100% 100%"
+PASS initialXPoints.style['-webkit-scroll-snap-type'] is ""
+PASS window.getComputedStyle(initialXPoints).getPropertyValue('-webkit-scroll-snap-type') is "mandatory"
+PASS initialXPoints.style['-webkit-scroll-snap-points-x'] is "initial"
+PASS window.getComputedStyle(initialXPoints).getPropertyValue('-webkit-scroll-snap-points-x') is "none"
+PASS initialXPoints.style['-webkit-scroll-snap-points-y'] is ""
+PASS window.getComputedStyle(initialXPoints).getPropertyValue('-webkit-scroll-snap-points-y') is "repeat(100%)"
+PASS initialXPoints.style['-webkit-scroll-snap-destination'] is "50% 50%"
+PASS window.getComputedStyle(initialXPoints).getPropertyValue('-webkit-scroll-snap-destination') is "50% 50%"
+PASS initialXPoints.style['-webkit-scroll-snap-coordinate'] is "50% 50%"
+PASS window.getComputedStyle(initialXPoints).getPropertyValue('-webkit-scroll-snap-coordinate') is "50% 50%"
+PASS initialYPoints.style['-webkit-scroll-snap-type'] is ""
+PASS window.getComputedStyle(initialYPoints).getPropertyValue('-webkit-scroll-snap-type') is "mandatory"
+PASS initialYPoints.style['-webkit-scroll-snap-points-x'] is ""
+PASS window.getComputedStyle(initialYPoints).getPropertyValue('-webkit-scroll-snap-points-x') is "repeat(100%)"
+PASS initialYPoints.style['-webkit-scroll-snap-points-y'] is "initial"
+PASS window.getComputedStyle(initialYPoints).getPropertyValue('-webkit-scroll-snap-points-y') is "none"
+PASS initialYPoints.style['-webkit-scroll-snap-destination'] is "50% 20px"
+PASS window.getComputedStyle(initialYPoints).getPropertyValue('-webkit-scroll-snap-destination') is "50% 20px"
+PASS initialYPoints.style['-webkit-scroll-snap-coordinate'] is "50% 50%"
+PASS window.getComputedStyle(initialYPoints).getPropertyValue('-webkit-scroll-snap-coordinate') is "50% 50%"
+PASS initialDestination.style['-webkit-scroll-snap-type'] is ""
+PASS window.getComputedStyle(initialDestination).getPropertyValue('-webkit-scroll-snap-type') is "proximity"
+PASS initialDestination.style['-webkit-scroll-snap-points-x'] is ""
+PASS window.getComputedStyle(initialDestination).getPropertyValue('-webkit-scroll-snap-points-x') is "repeat(100%)"
+PASS initialDestination.style['-webkit-scroll-snap-points-y'] is ""
+PASS window.getComputedStyle(initialDestination).getPropertyValue('-webkit-scroll-snap-points-y') is "repeat(100%)"
+PASS initialDestination.style['-webkit-scroll-snap-destination'] is "initial"
+PASS window.getComputedStyle(initialDestination).getPropertyValue('-webkit-scroll-snap-destination') is "0px 0px"
+PASS initialDestination.style['-webkit-scroll-snap-coordinate'] is ""
+PASS window.getComputedStyle(initialDestination).getPropertyValue('-webkit-scroll-snap-coordinate') is "none"
+PASS initialSnapCoordinate.style['-webkit-scroll-snap-type'] is ""
+PASS window.getComputedStyle(initialSnapCoordinate).getPropertyValue('-webkit-scroll-snap-type') is "mandatory"
+PASS initialSnapCoordinate.style['-webkit-scroll-snap-points-x'] is ""
+PASS window.getComputedStyle(initialSnapCoordinate).getPropertyValue('-webkit-scroll-snap-points-x') is "repeat(100%)"
+PASS initialSnapCoordinate.style['-webkit-scroll-snap-points-y'] is ""
+PASS window.getComputedStyle(initialSnapCoordinate).getPropertyValue('-webkit-scroll-snap-points-y') is "repeat(100%)"
+PASS initialSnapCoordinate.style['-webkit-scroll-snap-destination'] is ""
+PASS window.getComputedStyle(initialSnapCoordinate).getPropertyValue('-webkit-scroll-snap-destination') is "0px 0px"
+PASS initialSnapCoordinate.style['-webkit-scroll-snap-coordinate'] is "initial"
+PASS window.getComputedStyle(initialSnapCoordinate).getPropertyValue('-webkit-scroll-snap-coordinate') is "none"
+PASS allInitial.style['-webkit-scroll-snap-type'] is "initial"
+PASS window.getComputedStyle(allInitial).getPropertyValue('-webkit-scroll-snap-type') is "none"
+PASS allInitial.style['-webkit-scroll-snap-points-x'] is "initial"
+PASS window.getComputedStyle(allInitial).getPropertyValue('-webkit-scroll-snap-points-x') is "none"
+PASS allInitial.style['-webkit-scroll-snap-points-y'] is "initial"
+PASS window.getComputedStyle(allInitial).getPropertyValue('-webkit-scroll-snap-points-y') is "none"
+PASS allInitial.style['-webkit-scroll-snap-destination'] is "initial"
+PASS window.getComputedStyle(allInitial).getPropertyValue('-webkit-scroll-snap-destination') is "0px 0px"
+PASS allInitial.style['-webkit-scroll-snap-coordinate'] is "initial"
+PASS window.getComputedStyle(allInitial).getPropertyValue('-webkit-scroll-snap-coordinate') is "none"
+PASS noneSnapCoordinateAndDestination.style['-webkit-scroll-snap-type'] is ""
+PASS window.getComputedStyle(noneSnapCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-type') is "mandatory"
+PASS noneSnapCoordinateAndDestination.style['-webkit-scroll-snap-points-x'] is ""
+PASS window.getComputedStyle(noneSnapCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-points-x') is "repeat(100%)"
+PASS noneSnapCoordinateAndDestination.style['-webkit-scroll-snap-points-y'] is ""
+PASS window.getComputedStyle(noneSnapCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-points-y') is "repeat(100%)"
+PASS noneSnapCoordinateAndDestination.style['-webkit-scroll-snap-destination'] is ""
+PASS window.getComputedStyle(noneSnapCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-destination') is "0px 0px"
+PASS noneSnapCoordinateAndDestination.style['-webkit-scroll-snap-coordinate'] is ""
+PASS window.getComputedStyle(noneSnapCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-coordinate') is "none"
+PASS calculatedCoordinateAndDestination.style['-webkit-scroll-snap-type'] is ""
+PASS window.getComputedStyle(calculatedCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-type') is "mandatory"
+PASS calculatedCoordinateAndDestination.style['-webkit-scroll-snap-points-x'] is ""
+PASS window.getComputedStyle(calculatedCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-points-x') is "repeat(96%)"
+PASS calculatedCoordinateAndDestination.style['-webkit-scroll-snap-points-y'] is ""
+PASS window.getComputedStyle(calculatedCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-points-y') is "repeat(52%)"
+PASS calculatedCoordinateAndDestination.style['-webkit-scroll-snap-destination'] is ""
+PASS window.getComputedStyle(calculatedCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-destination') is "106px 25px"
+PASS calculatedCoordinateAndDestination.style['-webkit-scroll-snap-coordinate'] is ""
+PASS window.getComputedStyle(calculatedCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-coordinate') is "16px 384px"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
diff --git a/LayoutTests/css3/scroll-snap/scroll-snap-position-values.html b/LayoutTests/css3/scroll-snap/scroll-snap-position-values.html
new file mode 100644 (file)
index 0000000..f9e2ad8
--- /dev/null
@@ -0,0 +1,310 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <style>
+            .horizontalGallery {
+                width: 400px;
+                height: 50px;
+                overflow-y: hidden;
+                overflow-x: auto;
+            }
+            .horizontalGalleryDrawer {
+                width: 3000px;
+                height: 50px;
+            }
+            .colorBox {
+                height: 50px;
+                width: 400px;
+                float: left;
+            }
+
+            .noInitial {
+                -webkit-scroll-snap-type: mandatory;
+                -webkit-scroll-snap-points-x: repeat(100%);
+                -webkit-scroll-snap-points-y: repeat(100%);
+                -webkit-scroll-snap-destination: right bottom;
+                -webkit-scroll-snap-coordinate: left top;
+            }
+
+            .initialType {
+                -webkit-scroll-snap-type: initial;
+                -webkit-scroll-snap-points-x: repeat(100%);
+                -webkit-scroll-snap-points-y: repeat(100%);
+                -webkit-scroll-snap-destination: left top;
+                -webkit-scroll-snap-coordinate: right bottom;
+            }
+
+            .initialXPoints {
+                -webkit-scroll-snap-type: mandatory;
+                -webkit-scroll-snap-points-x: initial;
+                -webkit-scroll-snap-points-y: repeat(100%);
+                -webkit-scroll-snap-destination: 50% center;
+                -webkit-scroll-snap-coordinate: center 50%;
+            }
+
+            .initialYPoints {
+                -webkit-scroll-snap-type: mandatory;
+                -webkit-scroll-snap-points-x: repeat(100%);
+                -webkit-scroll-snap-points-y: initial;
+                -webkit-scroll-snap-destination: center 20px;
+                -webkit-scroll-snap-coordinate: 50% center;
+            }
+
+            .initialDestination {
+                -webkit-scroll-snap-type: proximity;
+                -webkit-scroll-snap-points-x: repeat(100%);
+                -webkit-scroll-snap-points-y: repeat(100%);
+                -webkit-scroll-snap-destination: initial;
+                -webkit-scroll-snap-coordinate: none;
+            }
+
+            .initialSnapCoordinate {
+                -webkit-scroll-snap-type: mandatory;
+                -webkit-scroll-snap-points-x: repeat(100%);
+                -webkit-scroll-snap-points-y: repeat(100%);
+                -webkit-scroll-snap-destination: none;
+                -webkit-scroll-snap-coordinate: initial;
+            }
+
+            .noneSnapCoordinateAndDestination {
+                -webkit-scroll-snap-type: mandatory;
+                -webkit-scroll-snap-points-x: repeat(100%);
+                -webkit-scroll-snap-points-y: repeat(100%);
+                -webkit-scroll-snap-destination: none;
+                -webkit-scroll-snap-coordinate: none;
+            }
+
+            .allInitial {
+                -webkit-scroll-snap-type: initial;
+                -webkit-scroll-snap-points-x: initial;
+                -webkit-scroll-snap-points-y: initial;
+                -webkit-scroll-snap-destination: initial;
+                -webkit-scroll-snap-coordinate: initial
+            }
+
+            .calculatedCoordinateAndDestination {
+                -webkit-scroll-snap-type: mandatory;
+                -webkit-scroll-snap-points-x: repeat(-webkit-calc(100% - 4%));
+                -webkit-scroll-snap-points-y: repeat(-webkit-calc(20% + 32%));
+                -webkit-scroll-snap-destination: -webkit-calc(10px + 6em) -webkit-calc(22px + 3px);
+                -webkit-scroll-snap-coordinate: -webkit-calc(32px - 1em) -webkit-calc(19em + 5em);
+            }
+
+            #item0 { background-color: red; }
+            #item1 { background-color: green; }
+            #item2 { background-color: blue; }
+            #item3 { background-color: aqua; }
+            #item4 { background-color: yellow; }
+            #item5 { background-color: fuchsia; }
+        </style>
+        <script src="../../resources/js-test-pre.js"></script>
+    </head>
+    <body>
+        <div style="width: 400px">
+            <div id="noInitial" class="horizontalGallery noInitial" style="-webkit-scroll-snap-destination: right bottom; -webkit-scroll-snap-coordinate: left top;">
+                <div class="horizontalGalleryDrawer">
+                    <div id="item0" class="colorBox"></div>
+                    <div id="item1" class="colorBox"></div>
+                    <div id="item2" class="colorBox"></div>
+                    <div id="item3" class="colorBox"></div>
+                    <div id="item4" class="colorBox"></div>
+                    <div id="item5" class="colorBox"></div>
+                </div>
+            </div>
+            <div id="initialType" class="horizontalGallery initialType" style="-webkit-scroll-snap-type: initial; -webkit-scroll-snap-destination: left top; -webkit-scroll-snap-coordinate: right bottom;">
+                <div class="horizontalGalleryDrawer">
+                    <div id="item0" class="colorBox"></div>
+                    <div id="item1" class="colorBox"></div>
+                    <div id="item2" class="colorBox"></div>
+                    <div id="item3" class="colorBox"></div>
+                    <div id="item4" class="colorBox"></div>
+                    <div id="item5" class="colorBox"></div>
+                </div>
+            </div>
+            <div id="initialXPoints" class="horizontalGallery initialXPoints" style="-webkit-scroll-snap-points-x: initial; -webkit-scroll-snap-destination: 50% center; -webkit-scroll-snap-coordinate: center 50%;">
+                <div class="horizontalGalleryDrawer">
+                    <div id="item0" class="colorBox"></div>
+                    <div id="item1" class="colorBox"></div>
+                    <div id="item2" class="colorBox"></div>
+                    <div id="item3" class="colorBox"></div>
+                    <div id="item4" class="colorBox"></div>
+                    <div id="item5" class="colorBox"></div>
+                </div>
+            </div>
+            <div id="initialYPoints" class="horizontalGallery initialYPoints" style="-webkit-scroll-snap-points-y: initial; -webkit-scroll-snap-destination: center 20px; -webkit-scroll-snap-coordinate: 50% center;">
+                <div class="horizontalGalleryDrawer">
+                    <div id="item0" class="colorBox"></div>
+                    <div id="item1" class="colorBox"></div>
+                    <div id="item2" class="colorBox"></div>
+                    <div id="item3" class="colorBox"></div>
+                    <div id="item4" class="colorBox"></div>
+                    <div id="item5" class="colorBox"></div>
+                </div>
+            </div>
+            <div id="initialDestination" class="horizontalGallery initialDestination" style="-webkit-scroll-snap-destination: initial; -webkit-scroll-snap-coordinate: none;">
+                <div class="horizontalGalleryDrawer">
+                    <div id="item0" class="colorBox"></div>
+                    <div id="item1" class="colorBox"></div>
+                    <div id="item2" class="colorBox"></div>
+                    <div id="item3" class="colorBox"></div>
+                    <div id="item4" class="colorBox"></div>
+                    <div id="item5" class="colorBox"></div>
+                </div>
+            </div>
+            <div id="initialSnapCoordinate" class="horizontalGallery initialSnapCoordinate" style="-webkit-scroll-snap-coordinate: initial; -webkit-scroll-snap-destination: none;">
+                <div class="horizontalGalleryDrawer">
+                    <div id="item0" class="colorBox"></div>
+                    <div id="item1" class="colorBox"></div>
+                    <div id="item2" class="colorBox"></div>
+                    <div id="item3" class="colorBox"></div>
+                    <div id="item4" class="colorBox"></div>
+                    <div id="item5" class="colorBox"></div>
+                </div>
+            </div>
+            <div id="noneSnapCoordinateAndDestination" class="horizontalGallery noneSnapCoordinateAndDestination" style="-webkit-scroll-snap-destination: none; -webkit-scroll-snap-coordinate: none;">
+                <div class="horizontalGalleryDrawer">
+                    <div id="item0" class="colorBox"></div>
+                    <div id="item1" class="colorBox"></div>
+                    <div id="item2" class="colorBox"></div>
+                    <div id="item3" class="colorBox"></div>
+                    <div id="item4" class="colorBox"></div>
+                    <div id="item5" class="colorBox"></div>
+                </div>
+            </div>
+            <div id="allInitial" class="horizontalGallery allInitial" style="-webkit-scroll-snap-type: initial; -webkit-scroll-snap-points-x: initial; -webkit-scroll-snap-points-y: initial; -webkit-scroll-snap-destination: initial; -webkit-scroll-snap-coordinate: initial">
+                <div class="horizontalGalleryDrawer">
+                    <div id="item0" class="colorBox"></div>
+                    <div id="item1" class="colorBox"></div>
+                    <div id="item2" class="colorBox"></div>
+                    <div id="item3" class="colorBox"></div>
+                    <div id="item4" class="colorBox"></div>
+                    <div id="item5" class="colorBox"></div>
+                </div>
+            </div>
+            <div id="calculatedCoordinateAndDestination" class="horizontalGallery calculatedCoordinateAndDestination">
+                <div class="horizontalGalleryDrawer">
+                    <div id="item0" class="colorBox"></div>
+                    <div id="item1" class="colorBox"></div>
+                    <div id="item2" class="colorBox"></div>
+                    <div id="item3" class="colorBox"></div>
+                    <div id="item4" class="colorBox"></div>
+                    <div id="item5" class="colorBox"></div>
+                </div>
+            </div>
+        </div>
+        <div id="console"></div>
+        <script>
+        description("Tests 'initial' on scroll snap properties.");
+
+        var noInitial = document.getElementById('noInitial');
+        shouldBeEmptyString("noInitial.style['-webkit-scroll-snap-type']");
+        shouldBeEqualToString("window.getComputedStyle(noInitial).getPropertyValue('-webkit-scroll-snap-type')", "mandatory");
+        shouldBeEmptyString("noInitial.style['-webkit-scroll-snap-points-x']");
+        shouldBeEqualToString("window.getComputedStyle(noInitial).getPropertyValue('-webkit-scroll-snap-points-x')", "repeat(100%)");
+        shouldBeEmptyString("noInitial.style['-webkit-scroll-snap-points-y']");
+        shouldBeEqualToString("window.getComputedStyle(noInitial).getPropertyValue('-webkit-scroll-snap-points-y')", "repeat(100%)");
+        shouldBeEqualToString("noInitial.style['-webkit-scroll-snap-destination']", "100% 100%");
+        shouldBeEqualToString("window.getComputedStyle(noInitial).getPropertyValue('-webkit-scroll-snap-destination')", "100% 100%");
+        shouldBeEqualToString("noInitial.style['-webkit-scroll-snap-coordinate']", "0% 0%");
+        shouldBeEqualToString("window.getComputedStyle(noInitial).getPropertyValue('-webkit-scroll-snap-coordinate')", "0% 0%");
+
+        var initialType = document.getElementById('initialType');
+        shouldBeEqualToString("initialType.style['-webkit-scroll-snap-type']", "initial");
+        shouldBeEqualToString("window.getComputedStyle(initialType).getPropertyValue('-webkit-scroll-snap-type')", "none");
+        shouldBeEmptyString("initialType.style['-webkit-scroll-snap-points-x']");
+        shouldBeEqualToString("window.getComputedStyle(initialType).getPropertyValue('-webkit-scroll-snap-points-x')", "repeat(100%)");
+        shouldBeEmptyString("initialType.style['-webkit-scroll-snap-points-y']");
+        shouldBeEqualToString("window.getComputedStyle(initialType).getPropertyValue('-webkit-scroll-snap-points-y')", "repeat(100%)");
+        shouldBeEqualToString("initialType.style['-webkit-scroll-snap-destination']", "0% 0%");
+        shouldBeEqualToString("window.getComputedStyle(initialType).getPropertyValue('-webkit-scroll-snap-destination')", "0% 0%");
+        shouldBeEqualToString("initialType.style['-webkit-scroll-snap-coordinate']", "100% 100%");
+        shouldBeEqualToString("window.getComputedStyle(initialType).getPropertyValue('-webkit-scroll-snap-coordinate')", "100% 100%");
+
+        var initialXPoints = document.getElementById('initialXPoints');
+        shouldBeEmptyString("initialXPoints.style['-webkit-scroll-snap-type']");
+        shouldBeEqualToString("window.getComputedStyle(initialXPoints).getPropertyValue('-webkit-scroll-snap-type')", "mandatory");
+        shouldBeEqualToString("initialXPoints.style['-webkit-scroll-snap-points-x']", "initial");
+        shouldBeEqualToString("window.getComputedStyle(initialXPoints).getPropertyValue('-webkit-scroll-snap-points-x')", "none");
+        shouldBeEmptyString("initialXPoints.style['-webkit-scroll-snap-points-y']");
+        shouldBeEqualToString("window.getComputedStyle(initialXPoints).getPropertyValue('-webkit-scroll-snap-points-y')", "repeat(100%)");
+        shouldBeEqualToString("initialXPoints.style['-webkit-scroll-snap-destination']", "50% 50%");
+        shouldBeEqualToString("window.getComputedStyle(initialXPoints).getPropertyValue('-webkit-scroll-snap-destination')", "50% 50%");
+        shouldBeEqualToString("initialXPoints.style['-webkit-scroll-snap-coordinate']", "50% 50%");
+        shouldBeEqualToString("window.getComputedStyle(initialXPoints).getPropertyValue('-webkit-scroll-snap-coordinate')", "50% 50%");
+
+        var initialYPoints = document.getElementById('initialYPoints');
+        shouldBeEmptyString("initialYPoints.style['-webkit-scroll-snap-type']");
+        shouldBeEqualToString("window.getComputedStyle(initialYPoints).getPropertyValue('-webkit-scroll-snap-type')", "mandatory");
+        shouldBeEmptyString("initialYPoints.style['-webkit-scroll-snap-points-x']");
+        shouldBeEqualToString("window.getComputedStyle(initialYPoints).getPropertyValue('-webkit-scroll-snap-points-x')", "repeat(100%)");
+        shouldBeEqualToString("initialYPoints.style['-webkit-scroll-snap-points-y']", "initial");
+        shouldBeEqualToString("window.getComputedStyle(initialYPoints).getPropertyValue('-webkit-scroll-snap-points-y')", "none");
+        shouldBeEqualToString("initialYPoints.style['-webkit-scroll-snap-destination']", "50% 20px");
+        shouldBeEqualToString("window.getComputedStyle(initialYPoints).getPropertyValue('-webkit-scroll-snap-destination')", "50% 20px");
+        shouldBeEqualToString("initialYPoints.style['-webkit-scroll-snap-coordinate']", "50% 50%");
+        shouldBeEqualToString("window.getComputedStyle(initialYPoints).getPropertyValue('-webkit-scroll-snap-coordinate')", "50% 50%");
+
+        var initialDestination = document.getElementById('initialDestination');
+        shouldBeEmptyString("initialDestination.style['-webkit-scroll-snap-type']");
+        shouldBeEqualToString("window.getComputedStyle(initialDestination).getPropertyValue('-webkit-scroll-snap-type')", "proximity");
+        shouldBeEmptyString("initialDestination.style['-webkit-scroll-snap-points-x']");
+        shouldBeEqualToString("window.getComputedStyle(initialDestination).getPropertyValue('-webkit-scroll-snap-points-x')", "repeat(100%)");
+        shouldBeEmptyString("initialDestination.style['-webkit-scroll-snap-points-y']");
+        shouldBeEqualToString("window.getComputedStyle(initialDestination).getPropertyValue('-webkit-scroll-snap-points-y')", "repeat(100%)");
+        shouldBeEqualToString("initialDestination.style['-webkit-scroll-snap-destination']", "initial");
+        shouldBeEqualToString("window.getComputedStyle(initialDestination).getPropertyValue('-webkit-scroll-snap-destination')", "0px 0px");
+        shouldBeEmptyString("initialDestination.style['-webkit-scroll-snap-coordinate']");
+        shouldBeEqualToString("window.getComputedStyle(initialDestination).getPropertyValue('-webkit-scroll-snap-coordinate')", "none");
+
+        var initialSnapCoordinate = document.getElementById('initialSnapCoordinate');
+        shouldBeEmptyString("initialSnapCoordinate.style['-webkit-scroll-snap-type']");
+        shouldBeEqualToString("window.getComputedStyle(initialSnapCoordinate).getPropertyValue('-webkit-scroll-snap-type')", "mandatory");
+        shouldBeEmptyString("initialSnapCoordinate.style['-webkit-scroll-snap-points-x']");
+        shouldBeEqualToString("window.getComputedStyle(initialSnapCoordinate).getPropertyValue('-webkit-scroll-snap-points-x')", "repeat(100%)");
+        shouldBeEmptyString("initialSnapCoordinate.style['-webkit-scroll-snap-points-y']");
+        shouldBeEqualToString("window.getComputedStyle(initialSnapCoordinate).getPropertyValue('-webkit-scroll-snap-points-y')", "repeat(100%)");
+        shouldBeEmptyString("initialSnapCoordinate.style['-webkit-scroll-snap-destination']");
+        shouldBeEqualToString("window.getComputedStyle(initialSnapCoordinate).getPropertyValue('-webkit-scroll-snap-destination')", "0px 0px");
+        shouldBeEqualToString("initialSnapCoordinate.style['-webkit-scroll-snap-coordinate']", "initial");
+        shouldBeEqualToString("window.getComputedStyle(initialSnapCoordinate).getPropertyValue('-webkit-scroll-snap-coordinate')", "none");
+
+        var allInitial = document.getElementById('allInitial');
+        shouldBeEqualToString("allInitial.style['-webkit-scroll-snap-type']", "initial");
+        shouldBeEqualToString("window.getComputedStyle(allInitial).getPropertyValue('-webkit-scroll-snap-type')", "none");
+        shouldBeEqualToString("allInitial.style['-webkit-scroll-snap-points-x']", "initial");
+        shouldBeEqualToString("window.getComputedStyle(allInitial).getPropertyValue('-webkit-scroll-snap-points-x')", "none");
+        shouldBeEqualToString("allInitial.style['-webkit-scroll-snap-points-y']", "initial");
+        shouldBeEqualToString("window.getComputedStyle(allInitial).getPropertyValue('-webkit-scroll-snap-points-y')", "none");
+        shouldBeEqualToString("allInitial.style['-webkit-scroll-snap-destination']", "initial");
+        shouldBeEqualToString("window.getComputedStyle(allInitial).getPropertyValue('-webkit-scroll-snap-destination')", "0px 0px");
+        shouldBeEqualToString("allInitial.style['-webkit-scroll-snap-coordinate']", "initial");
+        shouldBeEqualToString("window.getComputedStyle(allInitial).getPropertyValue('-webkit-scroll-snap-coordinate')", "none");
+
+        var noneSnapCoordinateAndDestination = document.getElementById('noneSnapCoordinateAndDestination');
+        shouldBeEmptyString("noneSnapCoordinateAndDestination.style['-webkit-scroll-snap-type']");
+        shouldBeEqualToString("window.getComputedStyle(noneSnapCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-type')", "mandatory");
+        shouldBeEmptyString("noneSnapCoordinateAndDestination.style['-webkit-scroll-snap-points-x']");
+        shouldBeEqualToString("window.getComputedStyle(noneSnapCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-points-x')", "repeat(100%)");
+        shouldBeEmptyString("noneSnapCoordinateAndDestination.style['-webkit-scroll-snap-points-y']");
+        shouldBeEqualToString("window.getComputedStyle(noneSnapCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-points-y')", "repeat(100%)");
+        shouldBeEmptyString("noneSnapCoordinateAndDestination.style['-webkit-scroll-snap-destination']");
+        shouldBeEqualToString("window.getComputedStyle(noneSnapCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-destination')", "0px 0px");
+        shouldBeEmptyString("noneSnapCoordinateAndDestination.style['-webkit-scroll-snap-coordinate']");
+        shouldBeEqualToString("window.getComputedStyle(noneSnapCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-coordinate')", "none");
+
+        var calculatedCoordinateAndDestination = document.getElementById('calculatedCoordinateAndDestination');
+        shouldBeEmptyString("calculatedCoordinateAndDestination.style['-webkit-scroll-snap-type']");
+        shouldBeEqualToString("window.getComputedStyle(calculatedCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-type')", "mandatory");
+        shouldBeEmptyString("calculatedCoordinateAndDestination.style['-webkit-scroll-snap-points-x']");
+        shouldBeEqualToString("window.getComputedStyle(calculatedCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-points-x')", "repeat(96%)");
+        shouldBeEmptyString("calculatedCoordinateAndDestination.style['-webkit-scroll-snap-points-y']");
+        shouldBeEqualToString("window.getComputedStyle(calculatedCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-points-y')", "repeat(52%)");
+        shouldBeEmptyString("calculatedCoordinateAndDestination.style['-webkit-scroll-snap-destination']");
+        shouldBeEqualToString("window.getComputedStyle(calculatedCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-destination')", "106px 25px");
+        shouldBeEmptyString("calculatedCoordinateAndDestination.style['-webkit-scroll-snap-coordinate']");
+        shouldBeEqualToString("window.getComputedStyle(calculatedCoordinateAndDestination).getPropertyValue('-webkit-scroll-snap-coordinate')", "16px 384px");
+        </script>
+        <script src="../../resources/js-test-post.js"></script>
+    </body>
+</html>
+
index 5e7bfda..94df05d 100644 (file)
@@ -155,19 +155,19 @@ multiple percentage coordinates : 50% 100% 150% 100% 200% 100%
 PASS window.getComputedStyle(document.body).getPropertyValue('-webkit-scroll-snap-coordinate') is '50% 100%, 150% 100%, 200% 100%'
 
 mm along x axis with pixel repeat : 10mm repeat(42mm)
-PASS window.getComputedStyle(document.body).getPropertyValue('-webkit-scroll-snap-points-x') is '37.78125px repeat(158.734375px)'
+PASS window.getComputedStyle(document.body).getPropertyValue('-webkit-scroll-snap-points-x') is '37.7952766418457px repeat(158.7401580810547px)'
 
 in along x axis with pixel repeat : 10in repeat(4in)
 PASS window.getComputedStyle(document.body).getPropertyValue('-webkit-scroll-snap-points-x') is '960px repeat(384px)'
 
 pt along x axis with pixel repeat : 10pt repeat(42pt)
-PASS window.getComputedStyle(document.body).getPropertyValue('-webkit-scroll-snap-points-x') is '13.328125px repeat(56px)'
+PASS window.getComputedStyle(document.body).getPropertyValue('-webkit-scroll-snap-points-x') is '13.333333015441895px repeat(56px)'
 
 in/cm destination : 2in 5cm
-PASS window.getComputedStyle(document.body).getPropertyValue('-webkit-scroll-snap-destination') is '192px 188.96875px'
+PASS window.getComputedStyle(document.body).getPropertyValue('-webkit-scroll-snap-destination') is '192px 188.97637939453125px'
 
 in/cm coordinate : 2in 5cm 5in 2cm
-PASS window.getComputedStyle(document.body).getPropertyValue('-webkit-scroll-snap-coordinate') is '192px 188.96875px, 480px 75.578125px'
+PASS window.getComputedStyle(document.body).getPropertyValue('-webkit-scroll-snap-coordinate') is '192px 188.97637939453125px, 480px 75.5905532836914px'
 
 subpixel along x axis with pixel repeat : 100.5px repeat(50.25px)
 PASS window.getComputedStyle(document.body).getPropertyValue('-webkit-scroll-snap-points-x') is '100.5px repeat(50.25px)'
index 6daad1b..13293de 100644 (file)
@@ -72,11 +72,11 @@ testComputedScrollSnapRule("single percentage coordinate", "coordinate", "50% 10
 testComputedScrollSnapRule("multiple pixel coordinates", "coordinate", "50px 100px 150px 100px 200px 100px", "50px 100px, 150px 100px, 200px 100px");
 testComputedScrollSnapRule("multiple percentage coordinates", "coordinate", "50% 100% 150% 100% 200% 100%", "50% 100%, 150% 100%, 200% 100%");
 
-testComputedScrollSnapRule("mm along x axis with pixel repeat", "points-x", "10mm repeat(42mm)", "37.78125px repeat(158.734375px)");
+testComputedScrollSnapRule("mm along x axis with pixel repeat", "points-x", "10mm repeat(42mm)", "37.7952766418457px repeat(158.7401580810547px)");
 testComputedScrollSnapRule("in along x axis with pixel repeat", "points-x", "10in repeat(4in)", "960px repeat(384px)");
-testComputedScrollSnapRule("pt along x axis with pixel repeat", "points-x", "10pt repeat(42pt)", "13.328125px repeat(56px)");
-testComputedScrollSnapRule("in/cm destination", "destination", "2in 5cm", "192px 188.96875px");
-testComputedScrollSnapRule("in/cm coordinate", "coordinate", "2in 5cm 5in 2cm", "192px 188.96875px, 480px 75.578125px");
+testComputedScrollSnapRule("pt along x axis with pixel repeat", "points-x", "10pt repeat(42pt)", "13.333333015441895px repeat(56px)");
+testComputedScrollSnapRule("in/cm destination", "destination", "2in 5cm", "192px 188.97637939453125px");
+testComputedScrollSnapRule("in/cm coordinate", "coordinate", "2in 5cm 5in 2cm", "192px 188.97637939453125px, 480px 75.5905532836914px");
 
 testComputedScrollSnapRule("subpixel along x axis with pixel repeat", "points-x", "100.5px repeat(50.25px)", "100.5px repeat(50.25px)");
 testComputedScrollSnapRule("subpixel destination", "destination", "0.125px 2.4375px", "0.125px 2.4375px");
index c5599c9..34873f5 100644 (file)
@@ -1,3 +1,43 @@
+2015-03-10  Brent Fulgham  <bfulgham@apple.com>
+
+        CSS scroll-snap-destination and scroll-snap-coordinate are not honoring position values
+        https://bugs.webkit.org/show_bug.cgi?id=142411
+
+        Reviewed by Simon Fraser.
+
+        Tested by css3/scroll-snap/scroll-snap-position-values.html.
+
+        Revise the CSSParser to recognize that scroll-snap-coordinates and scroll-snap-destination
+        may be specified as positions, therefore allowing 'top', 'bottom', and 'center' for the Y axis,
+        and 'left', 'right', and 'center' for the X axis.
+
+        Correct implementation to support calculated values for Scroll Snap Point markup. This required the
+        Scroll Snap Point-specific LengthRepeat class to change its internal representation from a CSSPrimitiveValue
+        to a regular CSSValue.
+
+        Add tests that these position labels, as well as combinations with percentages and pixel offsets
+        are parsed properly.
+
+        * css/CSSComputedStyleDeclaration.cpp:
+        (WebCore::scrollSnapDestination): Switch from 'percentageOrZoomAdjustedValue' to 'zoomAdjustedPixelValueForLength'
+        when working with Length values. This is necessary to allow calculated results to be based on the proper default
+        page dimensions.
+        (WebCore::scrollSnapPoints): Ditto.
+        (WebCore::scrollSnapCoordinates): Ditto.
+        * css/CSSParser.cpp:
+        (WebCore::CSSParser::parseScrollSnapPositions): Consolidated code for dealing with snap point
+        positions.
+        (WebCore::CSSParser::parseScrollSnapDestination): Revise to call new helper function.
+        (WebCore::CSSParser::parseScrollSnapCoordinate): Ditto.
+        (WebCore::CSSParser::parseFillPositionX): Rename as parsePositionX.
+        (WebCore::CSSParser::parseFillPositionY): Rename as parsePositionY.
+        (WebCore::CSSParser::parseFillProperty): Update to call renamed parsePosition{X|Y} methods.
+        (WebCore::CSSParser::parseTransformOrigin): Ditto.
+        (WebCore::CSSParser::parsePerspectiveOrigin): Ditto.
+        * css/CSSParser.h:
+        * css/LengthRepeat.h: Revise class to use a CSSValue, rather than a CSSPrimitiveValue, so that we can represent
+        repeat values as calculations.
+
 2015-03-10  Enrica Casucci  <enrica@apple.com>
 
         Add support for more emoji with variation.
index 8cd7a27..bc8f598 100644 (file)
@@ -1109,8 +1109,8 @@ static Ref<CSSValueList> getTransitionPropertyValue(const AnimationList* animLis
 static Ref<CSSValueList> scrollSnapDestination(RenderStyle& style, const LengthSize& destination)
 {
     auto list = CSSValueList::createSpaceSeparated();
-    list.get().append(percentageOrZoomAdjustedValue(destination.width(), &style));
-    list.get().append(percentageOrZoomAdjustedValue(destination.height(), &style));
+    list.get().append(zoomAdjustedPixelValueForLength(destination.width(), &style));
+    list.get().append(zoomAdjustedPixelValueForLength(destination.height(), &style));
     return list;
 }
 
@@ -1123,9 +1123,9 @@ static Ref<CSSValue> scrollSnapPoints(RenderStyle& style, const ScrollSnapPoints
         return cssValuePool().createIdentifierValue(CSSValueElements);
     auto list = CSSValueList::createSpaceSeparated();
     for (auto& point : points->offsets)
-        list.get().append(percentageOrZoomAdjustedValue(point, &style));
+        list.get().append(zoomAdjustedPixelValueForLength(point, &style));
     if (points->hasRepeat)
-        list.get().append(cssValuePool().createValue(LengthRepeat::create(percentageOrZoomAdjustedValue(points->repeatOffset, &style))));
+        list.get().append(cssValuePool().createValue(LengthRepeat::create(zoomAdjustedPixelValueForLength(points->repeatOffset, &style))));
     return WTF::move(list);
 }
 
@@ -1138,8 +1138,8 @@ static Ref<CSSValue> scrollSnapCoordinates(RenderStyle& style, const Vector<Leng
 
     for (auto& coordinate : coordinates) {
         auto pair = CSSValueList::createSpaceSeparated();
-        pair.get().append(percentageOrZoomAdjustedValue(coordinate.width(), &style));
-        pair.get().append(percentageOrZoomAdjustedValue(coordinate.height(), &style));
+        pair.get().append(zoomAdjustedPixelValueForLength(coordinate.width(), &style));
+        pair.get().append(zoomAdjustedPixelValueForLength(coordinate.height(), &style));
         list.get().append(WTF::move(pair));
     }
 
index cb06dd0..6fb0285 100644 (file)
@@ -3319,20 +3319,33 @@ bool CSSParser::parseNonElementSnapPoints(CSSPropertyID propId, bool important)
     return false;
 }
 
+bool CSSParser::parseScrollSnapPositions(RefPtr<CSSValue>& cssValueX, RefPtr<CSSValue>& cssValueY)
+{
+    cssValueX = parsePositionX(*m_valueList);
+    if (!cssValueX)
+        return false;
+
+    // Don't accept odd-length lists of positions (must always have an X and a Y):
+    if (!m_valueList->next())
+        return false;
+
+    cssValueY = parsePositionY(*m_valueList);
+    if (!cssValueY)
+        return false;
+
+    return true;
+}
+
 bool CSSParser::parseScrollSnapDestination(CSSPropertyID propId, bool important)
 {
     RefPtr<CSSValueList> position = CSSValueList::createSpaceSeparated();
     if (m_valueList->size() != 2)
         return false;
-    ValueWithCalculation valueXWithCalculation(*m_valueList->current());
-    if (!validateUnit(valueXWithCalculation, FPercent | FLength))
-        return false;
-    RefPtr<CSSValue> cssValueX = createPrimitiveNumericValue(valueXWithCalculation);
 
-    ValueWithCalculation valueYWithCalculation(*m_valueList->next());
-    if (!validateUnit(valueYWithCalculation, FPercent | FLength))
+    RefPtr<CSSValue> cssValueX, cssValueY;
+    if (!parseScrollSnapPositions(cssValueX, cssValueY))
         return false;
-    RefPtr<CSSValue> cssValueY = createPrimitiveNumericValue(valueYWithCalculation);
+
     position->append(cssValueX.releaseNonNull());
     position->append(cssValueY.releaseNonNull());
     addProperty(propId, position, important);
@@ -3344,17 +3357,15 @@ bool CSSParser::parseScrollSnapCoordinate(CSSPropertyID propId, bool important)
 {
     RefPtr<CSSValueList> positions = CSSValueList::createSpaceSeparated();
     while (m_valueList->current()) {
-        ValueWithCalculation valueXWithCalculation(*m_valueList->current());
-        // Don't accept odd-length lists of coordinates.
-        if (!m_valueList->next())
-            return false;
-        ValueWithCalculation valueYWithCalculation(*m_valueList->current());
-        if (!validateUnit(valueXWithCalculation, FPercent | FLength) || !validateUnit(valueYWithCalculation, FPercent | FLength))
+        RefPtr<CSSValue> cssValueX, cssValueY;
+        if (!parseScrollSnapPositions(cssValueX, cssValueY))
             return false;
-        positions->append(createPrimitiveNumericValue(valueXWithCalculation));
-        positions->append(createPrimitiveNumericValue(valueYWithCalculation));
+
+        positions->append(cssValueX.releaseNonNull());
+        positions->append(cssValueY.releaseNonNull());
         m_valueList->next();
     }
+
     if (positions->length()) {
         addProperty(propId, positions.release(), important);
         return true;
@@ -4037,7 +4048,7 @@ bool CSSParser::parseFillImage(CSSParserValueList& valueList, RefPtr<CSSValue>&
     return false;
 }
 
-PassRefPtr<CSSValue> CSSParser::parseFillPositionX(CSSParserValueList& valueList)
+PassRefPtr<CSSValue> CSSParser::parsePositionX(CSSParserValueList& valueList)
 {
     int id = valueList.current()->id;
     if (id == CSSValueLeft || id == CSSValueRight || id == CSSValueCenter) {
@@ -4054,7 +4065,7 @@ PassRefPtr<CSSValue> CSSParser::parseFillPositionX(CSSParserValueList& valueList
     return nullptr;
 }
 
-PassRefPtr<CSSValue> CSSParser::parseFillPositionY(CSSParserValueList& valueList)
+PassRefPtr<CSSValue> CSSParser::parsePositionY(CSSParserValueList& valueList)
 {
     int id = valueList.current()->id;
     if (id == CSSValueTop || id == CSSValueBottom || id == CSSValueCenter) {
@@ -4564,14 +4575,14 @@ bool CSSParser::parseFillProperty(CSSPropertyID propId, CSSPropertyID& propId1,
                     break;
                 case CSSPropertyBackgroundPositionX:
                 case CSSPropertyWebkitMaskPositionX: {
-                    currValue = parseFillPositionX(*m_valueList);
+                    currValue = parsePositionX(*m_valueList);
                     if (currValue)
                         m_valueList->next();
                     break;
                 }
                 case CSSPropertyBackgroundPositionY:
                 case CSSPropertyWebkitMaskPositionY: {
-                    currValue = parseFillPositionY(*m_valueList);
+                    currValue = parsePositionY(*m_valueList);
                     if (currValue)
                         m_valueList->next();
                     break;
@@ -9714,13 +9725,13 @@ bool CSSParser::parseTransformOrigin(CSSPropertyID propId, CSSPropertyID& propId
             // parseTransformOriginShorthand advances the m_valueList pointer
             break;
         case CSSPropertyWebkitTransformOriginX: {
-            value = parseFillPositionX(*m_valueList);
+            value = parsePositionX(*m_valueList);
             if (value)
                 m_valueList->next();
             break;
         }
         case CSSPropertyWebkitTransformOriginY: {
-            value = parseFillPositionY(*m_valueList);
+            value = parsePositionY(*m_valueList);
             if (value)
                 m_valueList->next();
             break;
@@ -9757,13 +9768,13 @@ bool CSSParser::parsePerspectiveOrigin(CSSPropertyID propId, CSSPropertyID& prop
             parse2ValuesFillPosition(*m_valueList, value, value2);
             break;
         case CSSPropertyWebkitPerspectiveOriginX: {
-            value = parseFillPositionX(*m_valueList);
+            value = parsePositionX(*m_valueList);
             if (value)
                 m_valueList->next();
             break;
         }
         case CSSPropertyWebkitPerspectiveOriginY: {
-            value = parseFillPositionY(*m_valueList);
+            value = parsePositionY(*m_valueList);
             if (value)
                 m_valueList->next();
             break;
index 836fde9..66e21f8 100644 (file)
@@ -154,8 +154,8 @@ public:
     enum FillPositionFlag { InvalidFillPosition = 0, AmbiguousFillPosition = 1, XFillPosition = 2, YFillPosition = 4 };
     enum FillPositionParsingMode { ResolveValuesAsPercent = 0, ResolveValuesAsKeyword = 1 };
     PassRefPtr<CSSPrimitiveValue> parseFillPositionComponent(CSSParserValueList&, unsigned& cumulativeFlags, FillPositionFlag& individualFlag, FillPositionParsingMode = ResolveValuesAsPercent);
-    PassRefPtr<CSSValue> parseFillPositionX(CSSParserValueList&);
-    PassRefPtr<CSSValue> parseFillPositionY(CSSParserValueList&);
+    PassRefPtr<CSSValue> parsePositionX(CSSParserValueList&);
+    PassRefPtr<CSSValue> parsePositionY(CSSParserValueList&);
     void parse2ValuesFillPosition(CSSParserValueList&, RefPtr<CSSValue>&, RefPtr<CSSValue>&);
     bool isPotentialPositionValue(CSSParserValue&);
     void parseFillPosition(CSSParserValueList&, RefPtr<CSSValue>&, RefPtr<CSSValue>&);
@@ -559,6 +559,7 @@ private:
     bool parseNonElementSnapPoints(CSSPropertyID propId, bool important);
     bool parseScrollSnapDestination(CSSPropertyID propId, bool important);
     bool parseScrollSnapCoordinate(CSSPropertyID propId, bool important);
+    bool parseScrollSnapPositions(RefPtr<CSSValue>& cssValueX, RefPtr<CSSValue>& cssValueY);
 #endif
 
     bool parseFontFaceSrcURI(CSSValueList&);
index 83028e9..ae269e9 100644 (file)
@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2014 Apple Inc. All rights reserved.
+ * Copyright (C) 2014-2015 Apple Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
@@ -36,13 +36,13 @@ namespace WebCore {
 
 class LengthRepeat : public RefCounted<LengthRepeat> {
 public:
-    static PassRefPtr<LengthRepeat> create(PassRefPtr<CSSPrimitiveValue> interval) { return adoptRef(new LengthRepeat(interval)); }
+    static PassRefPtr<LengthRepeat> create(PassRefPtr<CSSValue> interval) { return adoptRef(new LengthRepeat(interval)); }
 
     PassRefPtr<LengthRepeat> cloneForCSSOM() const { return create(interval()); }
 
-    CSSPrimitiveValue* interval() const { return m_interval.get(); }
+    CSSValue* interval() const { return m_interval.get(); }
 
-    void setInterval(PassRefPtr<CSSPrimitiveValue> interval) { m_interval = interval; }
+    void setInterval(PassRefPtr<CSSValue> interval) { m_interval = interval; }
 
     bool equals(const LengthRepeat& other) const
     {
@@ -55,12 +55,12 @@ public:
     }
 
 private:
-    LengthRepeat(PassRefPtr<CSSPrimitiveValue> interval)
+    LengthRepeat(PassRefPtr<CSSValue> interval)
         : m_interval(interval)
     {
     }
 
-    RefPtr<CSSPrimitiveValue> m_interval;
+    RefPtr<CSSValue> m_interval;
 };
 
 } // namespace WebCore
index cf26c2e..8515c9b 100644 (file)
@@ -705,7 +705,7 @@ inline PassRefPtr<ShapeValue> StyleBuilderConverter::convertShapeValue(StyleReso
 #if ENABLE(CSS_SCROLL_SNAP)
 inline Length StyleBuilderConverter::parseSnapCoordinate(StyleResolver& styleResolver, const CSSValue& value)
 {
-    return downcast<CSSPrimitiveValue>(value).convertToLength<FixedIntegerConversion | PercentConversion | AutoConversion>(styleResolver.state().cssToLengthConversionData());
+    return downcast<CSSPrimitiveValue>(value).convertToLength<FixedIntegerConversion | PercentConversion | CalculatedConversion | AutoConversion>(styleResolver.state().cssToLengthConversionData());
 }
 
 inline std::unique_ptr<ScrollSnapPoints> StyleBuilderConverter::convertScrollSnapPoints(StyleResolver& styleResolver, CSSValue& value)