diff options
| author | ajuma@chromium.org <ajuma@chromium.org> | 2014-12-08 20:02:01 +0000 |
|---|---|---|
| committer | ajuma@chromium.org <ajuma@chromium.org> | 2014-12-08 20:02:01 +0000 |
| commit | d74d18675c698866dbe158ac2093412323a7e3f3 (patch) | |
| tree | 11ea955fc6117dc91dabc1adecae4fb07f5524ec /third_party/WebKit/LayoutTests/fast/scroll-behavior/overflow-scroll-scrollBy.html | |
| parent | c5de1fb4827143bbf473f176029ad64aee65e49f (diff) | |
| download | chromium_src-d74d18675c698866dbe158ac2093412323a7e3f3.zip chromium_src-d74d18675c698866dbe158ac2093412323a7e3f3.tar.gz chromium_src-d74d18675c698866dbe158ac2093412323a7e3f3.tar.bz2 | |
Update Element API for CSSOM smooth scrolling to match the spec
This updates the Element API for smooth scrolling to match changes to
the CSSOM View spec. Previously, the spec overloaded the setters for
scrollTop and scrollLeft, allowing these to take a ScrollOptions
dictionary. Now, the spec instead adds scroll, scrollTo, and scrollBy
methods that each take either a pair of doubles or a single
ScrollToOptions dictionary (just like the corresponding methods on
Window).
Smooth scrolling is behing a runtime flag.
Spec: http://dev.w3.org/csswg/cssom-view/#extensions-to-the-element-interface
BUG=243871
Review URL: https://codereview.chromium.org/782793002
git-svn-id: svn://svn.chromium.org/blink/trunk@186725 bbb929c8-8fbe-4397-9dbb-9b2b20218538
Diffstat (limited to 'third_party/WebKit/LayoutTests/fast/scroll-behavior/overflow-scroll-scrollBy.html')
| -rw-r--r-- | third_party/WebKit/LayoutTests/fast/scroll-behavior/overflow-scroll-scrollBy.html | 94 |
1 files changed, 94 insertions, 0 deletions
diff --git a/third_party/WebKit/LayoutTests/fast/scroll-behavior/overflow-scroll-scrollBy.html b/third_party/WebKit/LayoutTests/fast/scroll-behavior/overflow-scroll-scrollBy.html new file mode 100644 index 0000000..291eb2a --- /dev/null +++ b/third_party/WebKit/LayoutTests/fast/scroll-behavior/overflow-scroll-scrollBy.html @@ -0,0 +1,94 @@ +<!DOCTYPE html> +<html> +<head> + <style> + #container { + width: 200px; + height: 200px; + overflow: scroll; + } + + #content { + width: 7500px; + height: 7500px; + background-color: blue; + } + </style> + <script src="../../resources/testharness.js"></script> + <script src="../../resources/testharnessreport.js"></script> + <script src="resources/scroll-behavior-test.js"></script> + <script type="text/javascript"> + function getEndPosition(testCase, startPosition) { + var endPosition = {}; + if (testCase.x) + endPosition.x = startPosition.x + testCase.x; + else + endPosition.x = startPosition.x; + + if (testCase.y) + endPosition.y = startPosition.y + testCase.y; + else + endPosition.y = startPosition.y; + return endPosition; + } + + function jsScroll(testCase) { + if (testCase.js) { + var scrollToOptions = {behavior: testCase.js}; + if (testCase.x) + scrollToOptions.left = testCase.x; + if (testCase.y) + scrollToOptions.top = testCase.y; + document.getElementById("container").scrollBy(scrollToOptions); + } else { + document.getElementById("container").scrollBy(testCase.x, testCase.y); + } + } + + const testScrolls = [ + {js: "instant", css: "auto", x: 1, y: 2}, + {js: "instant", css: "smooth", x: 2, y: 3}, + {js: "auto", css: "auto", x: 3, y: 4}, + {js: "", css: "auto", x: 4, y: 5}, + {js: "auto", css: "auto", x: 3}, + {js: "auto", css: "auto", y: 4}, + {js: "auto", css: "auto"}, + {js: "smooth", css: "auto", waitForEnd: true, x: 10, y: 15}, + {js: "smooth", css: "smooth", waitForEnd: true, x: 20, y: 25}, + {js: "auto", css: "smooth", waitForEnd: true, x: 30, y: 35}, + {js: "", css: "smooth", waitForEnd: true, x: 40, y: 45}, + {js: "auto", css: "smooth", waitForEnd: true, x: -30}, + {js: "auto", css: "smooth", waitForEnd: true, y: -35}, + {js: "smooth", css: "auto", waitForEnd: false, x: 4000, y: 4100}, + {js: "smooth", css: "smooth", waitForEnd: false, x: -3900, y: -3850}, + {js: "auto", css: "smooth", waitForEnd: false, x: 4050, y: 4000}, + {js: "", css: "smooth", waitForEnd: false, x: -4000, y: -4100}, + ]; + + function doTest() + { + var testCases = []; + for (var i = 0; i < testScrolls.length; i++) { + testCases.push(new ScrollBehaviorTestCase(testScrolls[i])); + } + + var element = document.getElementById("container"); + var scrollBehaviorTest = new ScrollBehaviorTest(element, + element, + testCases, + getEndPosition, + jsScroll); + scrollBehaviorTest.run(); + } + + window.addEventListener('load', doTest, false); + </script> +</head> + +<body> + <p>Test that calling scrollBy on an overflow:scroll element works with both scroll behaviors</p> + <div id="container"> + <div id="content"></div> + </div> +</body> +</html> |