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

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

Issue 2769793002: Implement CSS: scroll-boundary-behavior (Closed)
Patch Set: Update WebScrollBoundaryBehavior. Created 3 years, 7 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/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..02e434af5a9f804c9dd69c5494c205271372f20c
--- /dev/null
+++ b/third_party/WebKit/LayoutTests/fast/scroll-behavior/scroll-boundary-behavior.html
@@ -0,0 +1,73 @@
+<!DOCTYPE html>
bokan 2017/05/19 19:35:57 Please add a copy of this test that uses event sen
sunyunjia 2017/05/25 20:07:10 Done.
+<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;'>
+ <div id='red' style='height: 300px; width: 1000px; background-color: red'></div>
+ <div id='blue' style='height: 300px; background-color: blue'></div>
+</div>
+<div id='space2' style='height: 1000px'></div>
+
+<script>
+var container = document.getElementById('container');
+var test = async_test('scroll-boundary-behavior-y: none should only prevent overscroll propagation on y axis');
bokan 2017/05/19 19:35:57 overscroll typically refers to scrolling a fully s
sunyunjia 2017/05/25 20:07:10 Done.
+container.style.scrollBoundaryBehaviorX = 'auto';
+container.style.scrollBoundaryBehaviorY = 'none';
+test.step(function () {
+ window.scrollBy(100, 100);
+ assert_equals(window.scrollY, 100);
+ assert_equals(window.scrollX, 100);
+ chrome.gpuBenchmarking.smoothDrag(100, 400, 100, 500,
+ function() {
+ assert_equals(window.scrollY, 100);
+ chrome.gpuBenchmarking.smoothDrag(100, 400, 200, 400,
+ function() {
+ assert_less_than(window.scrollX, 100);
bokan 2017/05/19 19:35:57 Make this assert_equals - if you're using less_tha
sunyunjia 2017/05/25 20:07:10 Done.
+ test_func1();
+ test.done();
+ });
+ });
+});
+
+function test_func1() {
+ var test1 = async_test('scroll-boundary-behavior-x: none should only prevent overscroll propagation on x axis');
+ container.style.scrollBoundaryBehaviorX = 'none';
+ container.style.scrollBoundaryBehaviorY = 'auto';
+ window.scrollTo(0, 0);
+ container.scrollTo(0, 0);
+ test1.step(function () {
+ window.scrollBy(100, 100);
+ assert_equals(window.scrollY, 100);
+ assert_equals(window.scrollX, 100);
+ chrome.gpuBenchmarking.smoothDrag(100, 400, 200, 400,
+ function() {
+ assert_equals(window.scrollX, 100);
+ chrome.gpuBenchmarking.smoothDrag(100, 400, 100, 500,
+ function() {
+ assert_less_than(window.scrollY, 100);
+ test_func2();
+ test1.done();
+ });
+ });
+ });
+}
+
+function test_func2() {
+ var test2 = async_test('scroll-boundary-behavior should not affect scrolling inside the applied container');
+ container.style.scrollBoundaryBehaviorX = 'none';
+ container.style.scrollBoundaryBehaviorY = 'none';
+ window.scrollTo(0, 0);
+ container.scrollTo(0, 0);
+ test2.step(function () {
+ assert_equals(container.scrollTop, 0);
+ assert_equals(container.scrollLeft, 0);
+ chrome.gpuBenchmarking.smoothDrag(100, 400, 0, 300,
+ function() {
+ assert_greater_than(container.scrollTop, 0);
+ assert_greater_than(container.scrollLeft, 0);
+ test2.done();
+ });
+ });
+}
+
+</script>

Powered by Google App Engine
This is Rietveld 408576698