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

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: third_party/WebKit/LayoutTests/fast/scroll-behavior/scroll-boundary-behavior.html

Issue 2769793002: Implement CSS: scroll-boundary-behavior (Closed)
Patch Set: Disable touch on mac 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
« cc/trees/layer_tree_host_impl.cc ('K') | « cc/trees/scroll_node.cc ('k') | third_party/WebKit/LayoutTests/webexposed/css-properties-as-js-properties-expected.txt » ('j') | third_party/WebKit/Source/core/input/ScrollManager.cpp » ('J')
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: third_party/WebKit/LayoutTests/fast/scroll-behavior/scroll-boundary-behavior.html
diff --git a/third_party/WebKit/LayoutTests/fast/scroll-behavior/scroll-boundary-behavior.html b/third_party/WebKit/LayoutTests/fast/scroll-behavior/scroll-boundary-behavior.html
new file mode 100644
index 0000000000000000000000000000000000000000..88a8d683fc060de19c36f0438de8eb6abf7f1224
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/fast/scroll-behavior/scroll-boundary-behavior.html
@@ -0,0 +1,129 @@
+<!DOCTYPE html>
+<script src="../../resources/testharness.js"></script>
+<script src="../../resources/testharnessreport.js"></script>
+<div id='space1' style='height: 300px; width: 1000px;'></div>
+<div id='container' style='height: 400px; width: 500px; overflow: scroll; will-change: transform'>
bokan 2017/06/30 15:44:12 Please remove will-change: transform. This forces
sunyunjia 2017/06/30 18:26:58 Done.
+ <div id='red' style='height: 300px; width: 1000px; background-color: red; will-change: transform'></div>
+ <div id='blue' style='height: 300px; background-color: blue; will-change: transform'></div>
bokan 2017/06/30 15:44:11 Nit: These inner <div>s don't need `will-change:tr
sunyunjia 2017/06/30 18:26:58 Done.
+</div>
+<div id='space2' style='height: 1000px;'></div>
+
+<script>
+const TOUCH_SOURCE_TYPE = 1; // TOUCH_INPUT from synthetic_gesture_params.h
+const WHEEL_SOURCE_TYPE = 2; // MOUSE_INPUT from synthetic_gesture_params.h
+const TYPES = ["", "touch", "wheel"];
+const MAX_FRAME = 500;
+var container = document.getElementById('container');
+var begin_type = navigator.platform.indexOf('Mac') == 0 ? WHEEL_SOURCE_TYPE
+ : TOUCH_SOURCE_TYPE;
+test_y(begin_type);
+
+function waitForAnimationEnd(next_function) {
+ var last_changed_frame = 0;
+ var last_window_x = window.scrollX;
+ var last_window_y = window.scrollY;
+ var last_container_x = container.scrollLeft;
+ var last_container_y = container.scrollTop;
+ tick(0);
+ function tick(frames) {
+ // We requestAnimationFrame either for 500 frames or until 20 frames with
bokan 2017/06/30 15:44:12 If this is a callback that's called after the gest
sunyunjia 2017/06/30 18:26:58 We don't need to wait for touch, but need to wait
bokan 2017/06/30 18:55:36 We should turn off wheel animations, they're unrel
sunyunjia 2017/07/14 02:59:00 I think it can help test the ScrollAnimated() bran
majidvp 2017/07/14 14:29:43 Impl thread has its own internal flag that control
sunyunjia 2017/07/14 22:07:23 Seems like internals.settings.setScrollAnimatorEna
majidvp 2017/07/17 15:49:30 This is fine. Following our offline discussion I f
+ // no change have been observed.
+ if (frames >= MAX_FRAME || frames - last_changed_frame > 20) {
+ next_function();
+ } else {
+ if (window.scrollX != last_window_x ||
+ window.scrollY != last_window_y ||
+ container.scrollLeft != last_container_x ||
+ container.scrollTop != last_container_y) {
+ last_changed_frame = frames;
+ last_window_x = window.scrollX;
+ last_window_y = window.scrollY;
+ last_container_x = container.scrollLeft;
+ last_container_y = container.scrollTop;
+ }
+ requestAnimationFrame(tick.bind(null, frames + 1));
+ }
+ };
+}
+
+function test_y(source_type) {
+ var test = async_test('scroll-boundary-behavior-y: none should only prevent scroll propagation on y axis with: ' + TYPES[source_type]);
+ function checkNoChangeAndScroll() {
+ assert_equals(window.scrollY, 100);
+ chrome.gpuBenchmarking.smoothScrollBy(200, waitForAnimationEnd.bind(this, checkChangeAndFinish), 100, 400, source_type, "left", 4000);
+ }
+ function checkChangeAndFinish() {
+ assert_equals(window.scrollX, 0);
+ if (source_type == TOUCH_SOURCE_TYPE) {
bokan 2017/06/30 15:44:11 make begin_type always start with WHEEL and move t
sunyunjia 2017/06/30 18:26:58 Done.
+ test_y(WHEEL_SOURCE_TYPE);
+ test.done();
bokan 2017/06/30 15:44:12 test.done() should be called first, no? (below too
sunyunjia 2017/06/30 18:26:58 The later tests won't run if I call test.done() fi
+ } else {
+ test_x(begin_type);
+ test.done();
+ }
+ }
+
+ test.step(function() {
+ container.style.scrollBoundaryBehaviorX = 'auto';
+ container.style.scrollBoundaryBehaviorY = 'none';
+ window.scrollTo(100, 100);
+ container.scrollTo(0, 0);
+ assert_equals(window.scrollY, 100);
+ assert_equals(window.scrollX, 100);
+ chrome.gpuBenchmarking.smoothScrollBy(200, waitForAnimationEnd.bind(this, checkNoChangeAndScroll), 100, 400, source_type, "up", 4000);
+ });
+}
+
+function test_x(source_type) {
+ var test = async_test('scroll-boundary-behavior-x: none should only prevent scroll propagation on x axis with: ' + TYPES[source_type]);
+ function checkNoChangeAndScroll() {
+ assert_equals(window.scrollX, 100);
+ chrome.gpuBenchmarking.smoothScrollBy(200, waitForAnimationEnd.bind(this, checkChangeAndFinish), 100, 400, source_type, "up", 4000);
+ }
+ function checkChangeAndFinish() {
+ assert_equals(window.scrollY, 0);
+ if (source_type == TOUCH_SOURCE_TYPE) {
+ test_x(WHEEL_SOURCE_TYPE);
+ test.done();
+ } else {
+ test_scroll(begin_type);
+ test.done();
+ }
+ }
+
+ test.step(function() {
+ container.style.scrollBoundaryBehaviorX = 'none';
+ container.style.scrollBoundaryBehaviorY = 'auto';
+ window.scrollTo(100, 100);
+ container.scrollTo(0, 0);
+ assert_equals(window.scrollY, 100);
+ assert_equals(window.scrollX, 100);
+ chrome.gpuBenchmarking.smoothScrollBy(200, waitForAnimationEnd.bind(this, checkNoChangeAndScroll), 100, 400, source_type, "left", 4000);
+ });
+}
+
+function test_scroll(source_type) {
+ var test = async_test('scroll-boundary-behavior should not affect scrolling inside the applied container with: ' + TYPES[source_type]);
+ function checkChangeAndFinish() {
+ assert_equals(container.scrollTop, 0);
+ assert_equals(container.scrollLeft, 0);
+ if (source_type == TOUCH_SOURCE_TYPE) {
+ test_scroll(WHEEL_SOURCE_TYPE);
+ test.done();
+ } else {
+ test.done();
+ }
+ }
+
+ test.step(function() {
+ container.style.scrollBoundaryBehaviorX = 'none';
+ container.style.scrollBoundaryBehaviorY = 'none';
+ window.scrollTo(0, 0);
+ container.scrollTo(100, 100);
+ assert_equals(container.scrollTop, 100);
+ assert_equals(container.scrollLeft, 100);
+ chrome.gpuBenchmarking.smoothScrollBy(200, waitForAnimationEnd.bind(this, checkChangeAndFinish), 100, 400, source_type, "upleft", 4000);
bokan 2017/06/30 15:44:11 nit: extra spaces between `this, checkChangeAndF
sunyunjia 2017/06/30 18:26:58 Done.
+ });
+}
+
+</script>
« cc/trees/layer_tree_host_impl.cc ('K') | « cc/trees/scroll_node.cc ('k') | third_party/WebKit/LayoutTests/webexposed/css-properties-as-js-properties-expected.txt » ('j') | third_party/WebKit/Source/core/input/ScrollManager.cpp » ('J')

Powered by Google App Engine
This is Rietveld 408576698