Chromium Code Reviews Chromium Code Reviews
Issue 2647533002:
Force compositing inputs to be clean for getBoundingClientRect (Closed)
| Index: third_party/WebKit/LayoutTests/fast/css/sticky/sticky-position-works-with-scroll-apis.html |
| diff --git a/third_party/WebKit/LayoutTests/fast/css/sticky/sticky-position-works-with-scroll-apis.html b/third_party/WebKit/LayoutTests/fast/css/sticky/sticky-position-works-with-scroll-apis.html |
| new file mode 100644 |
| index 0000000000000000000000000000000000000000..1684ee02dadb9e5be4165a42a5af1ccfc7352c0e |
| --- /dev/null |
| +++ b/third_party/WebKit/LayoutTests/fast/css/sticky/sticky-position-works-with-scroll-apis.html |
| @@ -0,0 +1,107 @@ |
| +<!DOCTYPE html> |
| +<script src="../../../resources/testharness.js"></script> |
| +<script src="../../../resources/testharnessreport.js"></script> |
| +<style> |
| +body { |
| + margin: 0; |
| +} |
| + |
| +.paddingBefore { |
| + height: 150px; |
| +} |
| + |
| +#scroller { |
| + height: 100px; |
| + width: 200px; |
| + overflow-y: scroll; |
| +} |
| + |
| +.paddingAfter { |
| + height: 500px; |
| +} |
| + |
| +#sticky { |
| + height: 50px; |
| + position: sticky; |
| + top: 20px; |
| +} |
| +</style> |
| + |
| +<div id="scroller"> |
| + <div class="paddingBefore"></div> |
| + <div id="sticky"></div> |
| + <div class="paddingAfter"></div> |
| +</div> |
| + |
| +<script> |
| +if (window.internals) { |
| + internals.settings.setCSSStickyPositionEnabled(true); |
| +} |
| + |
| +// These tests currently mimic the behavior of Firefox for the interaction |
| +// between scrollIntoView() and position:sticky, where the offset location of |
| +// the sticky element is used to determine how far to scroll. This means that |
| +// scrollIntoView() may scroll even when the sticky is already 'in view', and |
| +// attempts to scroll so that the offset position of the sticky is at the top |
| +// of the screen. |
| +// |
| +// TODO(smcgruer): Update tests once http://crbug.com/664246 is resolved. |
| + |
| +test(function() { |
| + var scroller = document.getElementById('scroller'); |
| + var sticky = document.getElementById('sticky'); |
| + scroller.scrollTop = 0; |
| + |
| + // Deliberately dirty layout to make sure that scrollIntoView() still works. |
| + var newDiv = document.createElement('div'); |
| + newDiv.style.height = '50px'; |
| + scroller.append(newDiv); |
|
flackr
2017/01/24 22:47:15
nit: insert it before the sticky element here and
smcgruer
2017/01/25 20:51:57
Done. As usual, your offhand comments cause me to
|
| + |
| + sticky.scrollIntoView(); |
| + assert_equals(scroller.scrollTop, 150); |
| +}, "scrollIntoView should scroll when sticky is not visible"); |
| + |
| +test(function() { |
| + var scroller = document.getElementById('scroller'); |
| + var sticky = document.getElementById('sticky'); |
| + scroller.scrollTop = 150; |
| + |
| + // Deliberately dirty layout to make sure that scrollIntoView() still works. |
| + var newDiv = document.createElement('div'); |
| + newDiv.style.height = '50px'; |
| + scroller.append(newDiv); |
| + |
| + sticky.scrollIntoView(); |
| + assert_equals(scroller.scrollTop, 170); |
| +}, "scrollIntoView should scroll when sticky is already in view"); |
| + |
| +test(function() { |
| + var scroller = document.getElementById('scroller'); |
| + var sticky = document.getElementById('sticky'); |
| + scroller.scrollTop = 0; |
| + |
| + // Deliberately dirty layout to make sure that scrollIntoViewIfNeeded() |
| + // still works. |
| + var newDiv = document.createElement('div'); |
| + newDiv.style.height = '50px'; |
| + scroller.append(newDiv); |
| + |
| + sticky.scrollIntoViewIfNeeded(); |
| + assert_equals(scroller.scrollTop, 125); |
| +}, "scrollIntoViewIfNeeded should scroll when sticky is not visible"); |
| + |
| +test(function() { |
| + var scroller = document.getElementById('scroller'); |
| + var sticky = document.getElementById('sticky'); |
| + scroller.scrollTop = 150; |
| + |
| + // Deliberately dirty layout to make sure that scrollIntoViewIfNeeded() |
| + // still works. |
| + var newDiv = document.createElement('div'); |
| + newDiv.style.height = '50px'; |
| + scroller.append(newDiv); |
| + |
| + sticky.scrollIntoViewIfNeeded(); |
| + assert_equals(scroller.scrollTop, 150); |
| +}, "scrollIntoViewIfNeeded should not scroll when sticky is already in view"); |
| +</script> |
