Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(269)

Unified Diff: third_party/WebKit/Source/core/page/scrolling/SnapCoordinatorTest.cpp

Issue 2932593004: Update the snap points css properties (Closed)
Patch Set: Fix nits Created 3 years, 6 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: third_party/WebKit/Source/core/page/scrolling/SnapCoordinatorTest.cpp
diff --git a/third_party/WebKit/Source/core/page/scrolling/SnapCoordinatorTest.cpp b/third_party/WebKit/Source/core/page/scrolling/SnapCoordinatorTest.cpp
index fd5486f602f103c8e69cb5e6868480da8ef53a43..4f7c9efd517ae1c24bdca754c01a97a686f040f3 100644
--- a/third_party/WebKit/Source/core/page/scrolling/SnapCoordinatorTest.cpp
+++ b/third_party/WebKit/Source/core/page/scrolling/SnapCoordinatorTest.cpp
@@ -10,6 +10,7 @@
#include "core/dom/Element.h"
#include "core/frame/LocalFrameView.h"
#include "core/html/HTMLElement.h"
+#include "core/layout/LayoutBox.h"
#include "core/style/ComputedStyle.h"
#include "core/testing/DummyPageHolder.h"
#include "platform/scroll/ScrollTypes.h"
@@ -35,7 +36,7 @@ class SnapCoordinatorTest
" height: 1000px;"
" width: 1000px;"
" overflow: scroll;"
- " scroll-snap-type: mandatory;"
+ " scroll-snap-type: both mandatory;"
" }"
" #snap-element-fixed-position {"
" position: fixed;"
@@ -66,11 +67,10 @@ class SnapCoordinatorTest
return *GetDocument().getElementById("snap-container");
}
- SnapCoordinator& Coordinator() { return *GetDocument().GetSnapCoordinator(); }
-
- Vector<double> SnapOffsets(const ContainerNode& node,
- ScrollbarOrientation orientation) {
- return Coordinator().SnapOffsets(node, orientation);
+ unsigned SizeOfSnapAreas(const ContainerNode& node) {
+ if (node.GetLayoutBox()->SnapAreas())
+ return node.GetLayoutBox()->SnapAreas()->size();
+ return 0U;
}
std::unique_ptr<DummyPageHolder> page_holder_;
@@ -78,100 +78,25 @@ class SnapCoordinatorTest
INSTANTIATE_TEST_CASE_P(All, SnapCoordinatorTest, ::testing::Bool());
-TEST_P(SnapCoordinatorTest, ValidRepeat) {
- SnapContainer().setAttribute(styleAttr,
- "scroll-snap-points-x: repeat(20%); "
- "scroll-snap-points-y: repeat(400px);");
- GetDocument().UpdateStyleAndLayout();
- {
- const int expected_step_size = SnapContainer().clientWidth() * 0.2;
- Vector<double> actual = SnapOffsets(SnapContainer(), kHorizontalScrollbar);
- EXPECT_EQ(5U, actual.size());
- for (size_t i = 0; i < actual.size(); ++i)
- EXPECT_EQ((i + 1) * expected_step_size, actual[i]);
- }
- {
- Vector<double> actual = SnapOffsets(SnapContainer(), kVerticalScrollbar);
- EXPECT_EQ(2U, actual.size());
- EXPECT_EQ(400, actual[0]);
- EXPECT_EQ(800, actual[1]);
- }
-}
-
-TEST_P(SnapCoordinatorTest, EmptyRepeat) {
- SnapContainer().setAttribute(
- styleAttr, "scroll-snap-points-x: none; scroll-snap-points-y: none;");
- GetDocument().UpdateStyleAndLayout();
-
- EXPECT_EQ(0U, SnapOffsets(SnapContainer(), kHorizontalScrollbar).size());
- EXPECT_EQ(0U, SnapOffsets(SnapContainer(), kVerticalScrollbar).size());
-}
-
-TEST_P(SnapCoordinatorTest, ZeroAndNegativeRepeat) {
- // These be rejected as an invalid repeat values thus no snap offset is
- // created.
- SnapContainer().setAttribute(
- styleAttr,
- "scroll-snap-points-x: repeat(-1px); scroll-snap-points-y: repeat(0px);");
- GetDocument().UpdateStyleAndLayout();
-
- EXPECT_EQ(0U, SnapOffsets(SnapContainer(), kHorizontalScrollbar).size());
- EXPECT_EQ(0U, SnapOffsets(SnapContainer(), kVerticalScrollbar).size());
-
- // Calc values are not be rejected outright but instead clamped to 1px min
- // repeat value.
- SnapContainer().setAttribute(styleAttr,
- "scroll-snap-points-x: repeat(calc(10px - "
- "100%)); scroll-snap-points-y: "
- "repeat(calc(0px));");
- GetDocument().UpdateStyleAndLayout();
-
- // A repeat value of 1px should give us |(scroll size - client size) / 1| snap
- // offsets.
- unsigned expected_horizontal_snap_offsets =
- SnapContainer().scrollWidth() - SnapContainer().clientWidth();
- EXPECT_EQ(expected_horizontal_snap_offsets,
- SnapOffsets(SnapContainer(), kHorizontalScrollbar).size());
- unsigned expected_vertical_snap_offsets =
- SnapContainer().scrollHeight() - SnapContainer().clientHeight();
- EXPECT_EQ(expected_vertical_snap_offsets,
- SnapOffsets(SnapContainer(), kVerticalScrollbar).size());
-}
-
TEST_P(SnapCoordinatorTest, SimpleSnapElement) {
Element& snap_element = *GetDocument().getElementById("snap-element");
- snap_element.setAttribute(styleAttr, "scroll-snap-coordinate: 10px 11px;");
- GetDocument().UpdateStyleAndLayout();
-
- EXPECT_EQ(10, SnapOffsets(SnapContainer(), kHorizontalScrollbar)[0]);
- EXPECT_EQ(11, SnapOffsets(SnapContainer(), kVerticalScrollbar)[0]);
-
- // Multiple coordinate and translates
- snap_element.setAttribute(styleAttr,
- "scroll-snap-coordinate: 20px 21px, 40px 41px; "
- "transform: translate(10px, 10px);");
+ snap_element.setAttribute(styleAttr, "scroll-snap-align: start;");
GetDocument().UpdateStyleAndLayout();
- Vector<double> result = SnapOffsets(SnapContainer(), kHorizontalScrollbar);
- EXPECT_EQ(30, result[0]);
- EXPECT_EQ(50, result[1]);
- result = SnapOffsets(SnapContainer(), kVerticalScrollbar);
- EXPECT_EQ(31, result[0]);
- EXPECT_EQ(51, result[1]);
+ EXPECT_EQ(1U, SizeOfSnapAreas(SnapContainer()));
}
TEST_P(SnapCoordinatorTest, NestedSnapElement) {
Element& snap_element = *GetDocument().getElementById("nested-snap-element");
- snap_element.setAttribute(styleAttr, "scroll-snap-coordinate: 20px 25px;");
+ snap_element.setAttribute(styleAttr, "scroll-snap-align: start;");
GetDocument().UpdateStyleAndLayout();
- EXPECT_EQ(20, SnapOffsets(SnapContainer(), kHorizontalScrollbar)[0]);
- EXPECT_EQ(25, SnapOffsets(SnapContainer(), kVerticalScrollbar)[0]);
+ EXPECT_EQ(1U, SizeOfSnapAreas(SnapContainer()));
}
TEST_P(SnapCoordinatorTest, NestedSnapElementCaptured) {
Element& snap_element = *GetDocument().getElementById("nested-snap-element");
- snap_element.setAttribute(styleAttr, "scroll-snap-coordinate: 20px 25px;");
+ snap_element.setAttribute(styleAttr, "scroll-snap-align: start;");
Element* intermediate = GetDocument().getElementById("intermediate");
intermediate->setAttribute(styleAttr, "overflow: scroll;");
@@ -180,92 +105,47 @@ TEST_P(SnapCoordinatorTest, NestedSnapElementCaptured) {
// Intermediate scroller captures nested snap elements first so ancestor
// does not get them.
- EXPECT_EQ(0U, SnapOffsets(SnapContainer(), kHorizontalScrollbar).size());
- EXPECT_EQ(0U, SnapOffsets(SnapContainer(), kVerticalScrollbar).size());
+ EXPECT_EQ(0U, SizeOfSnapAreas(SnapContainer()));
+ EXPECT_EQ(1U, SizeOfSnapAreas(*intermediate));
}
TEST_P(SnapCoordinatorTest, PositionFixedSnapElement) {
Element& snap_element =
*GetDocument().getElementById("snap-element-fixed-position");
- snap_element.setAttribute(styleAttr, "scroll-snap-coordinate: 1px 1px;");
+ snap_element.setAttribute(styleAttr, "scroll-snap-align: start;");
GetDocument().UpdateStyleAndLayout();
// Position fixed elements are contained in document and not its immediate
// ancestor scroller. They cannot be a valid snap destination so they should
// not contribute snap points to their immediate snap container or document
// See: https://lists.w3.org/Archives/Public/www-style/2015Jun/0376.html
- EXPECT_EQ(0U, SnapOffsets(SnapContainer(), kHorizontalScrollbar).size());
- EXPECT_EQ(0U, SnapOffsets(SnapContainer(), kVerticalScrollbar).size());
+ EXPECT_EQ(0U, SizeOfSnapAreas(SnapContainer()));
Element* body = GetDocument().ViewportDefiningElement();
- EXPECT_EQ(0U, SnapOffsets(*body, kHorizontalScrollbar).size());
- EXPECT_EQ(0U, SnapOffsets(*body, kVerticalScrollbar).size());
-}
-
-TEST_P(SnapCoordinatorTest, RepeatAndSnapElementTogether) {
- GetDocument()
- .getElementById("snap-element")
- ->setAttribute(styleAttr, "scroll-snap-coordinate: 5px 10px;");
- GetDocument()
- .getElementById("nested-snap-element")
- ->setAttribute(styleAttr, "scroll-snap-coordinate: 250px 450px;");
-
- SnapContainer().setAttribute(styleAttr,
- "scroll-snap-points-x: repeat(200px); "
- "scroll-snap-points-y: repeat(400px);");
- GetDocument().UpdateStyleAndLayout();
-
- {
- Vector<double> result = SnapOffsets(SnapContainer(), kHorizontalScrollbar);
- EXPECT_EQ(7U, result.size());
- EXPECT_EQ(5, result[0]);
- EXPECT_EQ(200, result[1]);
- EXPECT_EQ(250, result[2]);
- }
- {
- Vector<double> result = SnapOffsets(SnapContainer(), kVerticalScrollbar);
- EXPECT_EQ(4U, result.size());
- EXPECT_EQ(10, result[0]);
- EXPECT_EQ(400, result[1]);
- EXPECT_EQ(450, result[2]);
- }
-}
-
-TEST_P(SnapCoordinatorTest, SnapPointsAreScrollOffsetIndependent) {
- Element& snap_element = *GetDocument().getElementById("snap-element");
- snap_element.setAttribute(styleAttr, "scroll-snap-coordinate: 10px 11px;");
- SnapContainer().scrollBy(100, 100);
- GetDocument().UpdateStyleAndLayout();
-
- EXPECT_EQ(SnapContainer().scrollLeft(), 100);
- EXPECT_EQ(SnapContainer().scrollTop(), 100);
- EXPECT_EQ(10, SnapOffsets(SnapContainer(), kHorizontalScrollbar)[0]);
- EXPECT_EQ(11, SnapOffsets(SnapContainer(), kVerticalScrollbar)[0]);
+ EXPECT_EQ(0U, SizeOfSnapAreas(*body));
}
TEST_P(SnapCoordinatorTest, UpdateStyleForSnapElement) {
Element& snap_element = *GetDocument().getElementById("snap-element");
- snap_element.setAttribute(styleAttr, "scroll-snap-coordinate: 10px 11px;");
+ snap_element.setAttribute(styleAttr, "scroll-snap-align: start;");
GetDocument().UpdateStyleAndLayout();
- EXPECT_EQ(10, SnapOffsets(SnapContainer(), kHorizontalScrollbar)[0]);
- EXPECT_EQ(11, SnapOffsets(SnapContainer(), kVerticalScrollbar)[0]);
+ EXPECT_EQ(1U, SizeOfSnapAreas(SnapContainer()));
snap_element.remove();
GetDocument().UpdateStyleAndLayout();
- EXPECT_EQ(0U, SnapOffsets(SnapContainer(), kHorizontalScrollbar).size());
- EXPECT_EQ(0U, SnapOffsets(SnapContainer(), kVerticalScrollbar).size());
+ EXPECT_EQ(0U, SizeOfSnapAreas(SnapContainer()));
// Add a new snap element
Element& container = *GetDocument().getElementById("snap-container");
container.setInnerHTML(
- "<div style='scroll-snap-coordinate: 20px 22px;'><div "
- "style='width:2000px; height:2000px;'></div></div>");
+ "<div style='scroll-snap-align: start;'>"
+ " <div style='width:2000px; height:2000px;'></div>"
+ "</div>");
GetDocument().UpdateStyleAndLayout();
- EXPECT_EQ(20, SnapOffsets(SnapContainer(), kHorizontalScrollbar)[0]);
- EXPECT_EQ(22, SnapOffsets(SnapContainer(), kVerticalScrollbar)[0]);
+ EXPECT_EQ(1U, SizeOfSnapAreas(SnapContainer()));
}
TEST_P(SnapCoordinatorTest, LayoutViewCapturesWhenBodyElementViewportDefining) {
@@ -273,18 +153,17 @@ TEST_P(SnapCoordinatorTest, LayoutViewCapturesWhenBodyElementViewportDefining) {
"<style>"
"body {"
" overflow: scroll;"
- " scroll-snap-type: mandatory;"
+ " scroll-snap-type: both mandatory;"
" height: 1000px;"
" width: 1000px;"
" margin: 5px;"
"}"
"</style>"
"<body>"
- " <div id='snap-element' style='scroll-snap-coordinate: 5px "
- "6px;'></div>"
- " <div>"
- " <div id='nested-snap-element' style='scroll-snap-coordinate: "
- "10px 11px;'></div>"
+ " <div id='snap-element' style='scroll-snap-align: start;></div>"
+ " <div id='intermediate'>"
+ " <div id='nested-snap-element'"
+ " style='scroll-snap-align: start;'></div>"
" </div>"
" <div style='width:2000px; height:2000px;'></div>"
"</body>");
@@ -296,12 +175,9 @@ TEST_P(SnapCoordinatorTest, LayoutViewCapturesWhenBodyElementViewportDefining) {
// When body is viewport defining and overflows then any snap points on the
// body element will be captured by layout view as the snap container.
- Vector<double> result = SnapOffsets(GetDocument(), kHorizontalScrollbar);
- EXPECT_EQ(10, result[0]);
- EXPECT_EQ(15, result[1]);
- result = SnapOffsets(GetDocument(), kVerticalScrollbar);
- EXPECT_EQ(11, result[0]);
- EXPECT_EQ(16, result[1]);
+ EXPECT_EQ(2U, SizeOfSnapAreas(GetDocument()));
+ EXPECT_EQ(0U, SizeOfSnapAreas(*(GetDocument().body())));
+ EXPECT_EQ(0U, SizeOfSnapAreas(*(GetDocument().documentElement())));
}
TEST_P(SnapCoordinatorTest,
@@ -310,7 +186,7 @@ TEST_P(SnapCoordinatorTest,
"<style>"
":root {"
" overflow: scroll;"
- " scroll-snap-type: mandatory;"
+ " scroll-snap-type: both mandatory;"
" height: 500px;"
" width: 500px;"
"}"
@@ -320,11 +196,10 @@ TEST_P(SnapCoordinatorTest,
"</style>"
"<html>"
" <body>"
- " <div id='snap-element' style='scroll-snap-coordinate: 5px "
- "6px;'></div>"
- " <div>"
- " <div id='nested-snap-element' style='scroll-snap-coordinate: "
- "10px 11px;'></div>"
+ " <div id='snap-element' style='scroll-snap-align: start;></div>"
+ " <div id='intermediate'>"
+ " <div id='nested-snap-element'"
+ " style='scroll-snap-align: start;'></div>"
" </div>"
" <div style='width:2000px; height:2000px;'></div>"
" </body>"
@@ -339,12 +214,9 @@ TEST_P(SnapCoordinatorTest,
// When body is viewport defining and overflows then any snap points on the
// the document element will be captured by layout view as the snap
// container.
- Vector<double> result = SnapOffsets(GetDocument(), kHorizontalScrollbar);
- EXPECT_EQ(10, result[0]);
- EXPECT_EQ(15, result[1]);
- result = SnapOffsets(GetDocument(), kVerticalScrollbar);
- EXPECT_EQ(11, result[0]);
- EXPECT_EQ(16, result[1]);
+ EXPECT_EQ(2U, SizeOfSnapAreas(GetDocument()));
+ EXPECT_EQ(0U, SizeOfSnapAreas(*(GetDocument().body())));
+ EXPECT_EQ(0U, SizeOfSnapAreas(*(GetDocument().documentElement())));
}
TEST_P(SnapCoordinatorTest,
@@ -353,26 +225,25 @@ TEST_P(SnapCoordinatorTest,
"<style>"
":root {"
" overflow: scroll;"
- " scroll-snap-type: mandatory;"
+ " scroll-snap-type: both mandatory;"
" height: 500px;"
" width: 500px;"
"}"
"body {"
" overflow: scroll;"
- " scroll-snap-type: mandatory;"
+ " scroll-snap-type: both mandatory;"
" height: 1000px;"
" width: 1000px;"
" margin: 5px;"
"}"
"</style>"
"<html>"
- " <body style='overflow: scroll; scroll-snap-type: mandatory; "
+ " <body style='overflow: scroll; scroll-snap-type: both mandatory; "
"height:1000px; width:1000px;'>"
- " <div id='snap-element' style='scroll-snap-coordinate: 5px "
- "6px;'></div>"
- " <div>"
- " <div id='nested-snap-element' style='scroll-snap-coordinate: "
- "10px 11px;'></div>"
+ " <div id='snap-element' style='scroll-snap-align: start;></div>"
+ " <div id='intermediate'>"
+ " <div id='nested-snap-element'"
+ " style='scroll-snap-align: start;'></div>"
" </div>"
" <div style='width:2000px; height:2000px;'></div>"
" </body>"
@@ -387,12 +258,7 @@ TEST_P(SnapCoordinatorTest,
// When body and document elements are both scrollable then body element
// should capture snap points defined on it as opposed to layout view.
Element& body = *GetDocument().body();
- Vector<double> result = SnapOffsets(body, kHorizontalScrollbar);
- EXPECT_EQ(5, result[0]);
- EXPECT_EQ(10, result[1]);
- result = SnapOffsets(body, kVerticalScrollbar);
- EXPECT_EQ(6, result[0]);
- EXPECT_EQ(11, result[1]);
+ EXPECT_EQ(2U, SizeOfSnapAreas(body));
}
} // namespace

Powered by Google App Engine
This is Rietveld 408576698