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

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: third_party/WebKit/LayoutTests/external/wpt/cssom-view/scrollIntoView-smooth.html

Issue 2936283003: Update CSSOM SmoothScroll Web Platform Test (Closed)
Patch Set: Update the test 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
« no previous file with comments | « no previous file | third_party/WebKit/LayoutTests/external/wpt/scroll-into-view/check-scroll-position.html » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: third_party/WebKit/LayoutTests/external/wpt/cssom-view/scrollIntoView-smooth.html
diff --git a/third_party/WebKit/LayoutTests/external/wpt/cssom-view/scrollIntoView-smooth.html b/third_party/WebKit/LayoutTests/external/wpt/cssom-view/scrollIntoView-smooth.html
new file mode 100644
index 0000000000000000000000000000000000000000..7a240222ffebf373dc94169c1a52e1c716b83208
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/external/wpt/cssom-view/scrollIntoView-smooth.html
@@ -0,0 +1,147 @@
+<!DOCTYPE HTML>
+<script src='/resources/testharness.js'></script>
+<script src='/resources/testharnessreport.js'></script>
+<title>Check End Position of scrollIntoView</title>
+<div id='container' style='height: 2500px; width: 2500px;'>
+ <div id='content' style='height: 500px; width: 500px;margin-left: 1000px; margin-right: 1000px; margin-top: 1000px;margin-bottom: 1000px;background-color: red'>
+ </div>
+ <div id='shadow'></div>
+</div>
+<script>
+var content_height = 500;
+var content_width = 500;
+var window_height = document.documentElement.clientHeight;
+var window_width = document.documentElement.clientWidth;
+var content = document.getElementById('content');
+add_completion_callback(() => document.getElementById('container').remove());
+
+function waitForScrollEnd(frames, last_changed_frame, last_x, last_y) {
+ return new Promise((resolve, reject) => {
+ requestAnimationFrame(() => {
+ // We requestAnimationFrame either for 500 frames or until 20 frames with
+ // no change have been observed.
+ if (frames >= 500 || frames - last_changed_frame > 20) {
+ resolve();
+ } else {
+ if (window.scrollX != last_x || window.scrollY != last_y) {
+ last_changed_frame = frames;
+ }
+ waitForScrollEnd(frames + 1, last_changed_frame, window.scrollX, window.scrollY).then(resolve);
foolip 2017/06/15 19:41:53 optional nit: This will build up a very long promi
+ }
+ })
+ });
+}
+
+// When testing manually, we need an additional frame at beginning
+// to trigger the effect.
+requestAnimationFrame(() => {
+promise_test(t => {
+ window.scrollTo(0, 0);
+ var expected_x = content.offsetLeft + content_width - window_width;
+ var expected_y = content.offsetTop + content_height - window_height;
+ assert_not_equals(window.scrollX, expected_x);
+ assert_not_equals(window.scrollY, expected_y);
+ content.scrollIntoView({behavior: 'smooth', block: 'nearest', inlinePosition:
+'nearest'});
+ return waitForScrollEnd(0, 0, window.scrollX, window.scrollY).then(() => {
+ assert_approx_equals(window.scrollX, expected_x, 1);
+ assert_approx_equals(window.scrollY, expected_y, 1);
+ });
+}, "Smooth scrollIntoView should scroll the element to the 'nearest' position");
+
+promise_test(t => {
+ window.scrollTo(0, 0);
+ var expected_x = content.offsetLeft;
+ var expected_y = content.offsetTop;
+ assert_not_equals(window.scrollX, expected_x);
+ assert_not_equals(window.scrollY, expected_y);
+ content.scrollIntoView({behavior: 'smooth', block: 'start', inlinePosition:
+'start'});
+ return waitForScrollEnd(0, 0, window.scrollX, window.scrollY).then(() => {
+ assert_approx_equals(window.scrollX, expected_x, 1);
+ assert_approx_equals(window.scrollY, expected_y, 1);
+ });
+}, "Smooth scrollIntoView should scroll the element to the 'start' position");
+
+promise_test(t => {
+ window.scrollTo(0, 0);
+ var expected_x = content.offsetLeft + (content_width - window_width) / 2;
+ var expected_y = content.offsetTop + (content_height - window_height) / 2;
+ assert_not_equals(window.scrollX, expected_x);
+ assert_not_equals(window.scrollY, expected_y);
+ content.scrollIntoView({behavior: 'smooth', block: 'center', inlinePosition:
+'center'});
+ return waitForScrollEnd(0, 0, window.scrollX, window.scrollY).then(() => {
+ assert_approx_equals(window.scrollX, expected_x, 1);
+ assert_approx_equals(window.scrollY, expected_y, 1);
+ });
+}, "Smooth scrollIntoView should scroll the element to the 'center' position");
+
+promise_test(t => {
+ window.scrollTo(0, 0);
+ var expected_x = content.offsetLeft + content_width - window_width;
+ var expected_y = content.offsetTop + content_height - window_height;
+ assert_not_equals(window.scrollX, expected_x);
+ assert_not_equals(window.scrollY, expected_y);
+ content.scrollIntoView({behavior: 'smooth', block: 'end', inlinePosition:
+'end'});
+ return waitForScrollEnd(0, 0, window.scrollX, window.scrollY).then(() => {
+ assert_approx_equals(window.scrollX, expected_x, 1);
+ assert_approx_equals(window.scrollY, expected_y, 1);
+ });
+}, "Smooth scrollIntoView should scroll the element to the 'end' position");
+
+function instantScrollToTestArgs(arg, expected_x, expected_y) {
foolip 2017/06/15 19:41:53 This and the following test you might want to spli
+ window.scrollTo(0, 0);
+ assert_not_equals(window.scrollX, expected_x);
+ assert_not_equals(window.scrollY, expected_y);
+ if (arg == "omitted")
+ content.scrollIntoView();
+ else
+ content.scrollIntoView(arg);
+ assert_approx_equals(window.scrollX, expected_x, 1);
+ assert_approx_equals(window.scrollY, expected_y, 1);
+}
+
+test(t => {
+ instantScrollToTestArgs("omitted",
+ content.offsetLeft + content_width - window_width,
+ content.offsetTop);
+ instantScrollToTestArgs(true,
+ content.offsetLeft + content_width - window_width,
+ content.offsetTop);
+ instantScrollToTestArgs(false,
+ content.offsetLeft + content_width - window_width,
+ content.offsetTop + content_height - window_height);
+ instantScrollToTestArgs({},
+ content.offsetLeft + (content_width - window_width) / 2,
+ content.offsetTop + (content_height - window_height) / 2);
+ instantScrollToTestArgs(null,
+ content.offsetLeft + content_width - window_width,
+ content.offsetTop);
+ instantScrollToTestArgs(undefined,
+ content.offsetLeft + content_width - window_width,
+ content.offsetTop);
+}, "scrollIntoView should behave correctly when the arg is not fully specified as ScrollIntoViewOptions");
+
+test(t => {
+ var shadow = document.getElementById("shadow");
+ var shadowRoot = shadow.createShadowRoot();
+ var shadowDiv = document.createElement("div");
+ shadowDiv.style.height = "200px";
+ shadowDiv.style.width = "200px";
+ shadowDiv.style.backgroundColor = "green";
+ shadowRoot.appendChild(shadowDiv);
+
+ window.scrollTo(0, 0);
+ var expected_x = shadowDiv.offsetLeft;
+ var expected_y = shadowDiv.offsetTop;
+ assert_not_equals(window.scrollX, expected_x);
+ assert_not_equals(window.scrollY, expected_y);
+ shadowDiv.scrollIntoView({block: 'start', inlinePosition: 'start'});
+ assert_approx_equals(window.scrollX, expected_x, 1);
+ assert_approx_equals(window.scrollY, expected_y, 1);
+}, "scrollIntoView should behave correctly if appliex to shadow dom elements");
foolip 2017/06/15 19:41:53 typo: appliex
+
+});
+</script>
« no previous file with comments | « no previous file | third_party/WebKit/LayoutTests/external/wpt/scroll-into-view/check-scroll-position.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698