Index: LayoutTests/scrollingcoordinator/non-fast-scrollable-visibility-change.html |
diff --git a/LayoutTests/scrollingcoordinator/non-fast-scrollable-visibility-change.html b/LayoutTests/scrollingcoordinator/non-fast-scrollable-visibility-change.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..ddbbc426687ccdb7ad7c2cba733bea4364fd9365 |
--- /dev/null |
+++ b/LayoutTests/scrollingcoordinator/non-fast-scrollable-visibility-change.html |
@@ -0,0 +1,105 @@ |
+<!DOCTYPE html> |
+<style> |
+ .non-fast { |
+ height: 250px; |
+ width: 250px; |
+ display: block; |
+ background-color: red; |
+ overflow: scroll; |
+ } |
+ .non-fast > div { |
+ height: 1000px; |
+ width: 1000px; |
+ display: block; |
+ background: linear-gradient(to bottom, red, white); |
+ } |
+</style> |
+ |
+<div id="first" class="non-fast"> |
+ This should be covered by the ONLY visible green overlay. |
+</div> |
+<div id="second" class="non-fast" style="margin-top:50px;"> |
+ This should not be visible. |
+ <div></div> |
+</div> |
+ |
+<div id="console"></div> |
+ |
+<script src="../resources/js-test.js"></script> |
+<script src="resources/non-fast-scrollable-region-testing.js"></script> |
+<script> |
+ window.jsTestIsAsync = true; |
+ description('This test ensures that changing visibility of a non-fast ' + |
+ 'scrollable area correctly updates list of non-fast scrollable ' + |
+ 'areas. (See http://crbug.com/434982)'); |
+ |
+ onload = function() { |
+ awaitCompsitingUpdate(runTest); |
+ }; |
+ |
+ function runTest() { |
+ var first = document.getElementById('first'), |
+ second = document.getElementById('second'); |
+ |
+ nonFastScrollableRects = internals.nonFastScrollableRects(document); |
+ shouldBe('nonFastScrollableRects.length', '1'); |
+ shouldBeEqualToString('rectToString(nonFastScrollableRects[0])', |
+ '[8, 308, 250, 250]'); // second div |
Rick Byers
2015/01/12 22:36:27
where is the 308 coming from? You don't want your
majidvp
2015/01/13 16:01:56
These values are not dependent on text metrics. Th
|
+ |
+ // Hide container before making it non-fast scrollable to ensure any |
+ // layout occurs while it is invisible. |
+ first.style.visibility = 'hidden'; |
+ makeNonFastScrollable(first); |
+ |
+ // Change visibility (hidden -> visible), which should not cause any layout, |
Rick Byers
2015/01/12 22:36:27
you should probably verify that no layout is neces
majidvp
2015/01/13 16:01:56
Done.
|
+ // and verify that non-fast scrollable areas are correctly updated. |
+ awaitCompsitingUpdate(function() { |
+ first.style.visibility = 'visible'; |
+ |
+ awaitCompsitingUpdate(function() { |
+ nonFastScrollableRects = internals.nonFastScrollableRects(document); |
+ shouldBe('nonFastScrollableRects.length', '2'); |
+ shouldBeEqualToString('rectToString(nonFastScrollableRects[0])', |
+ '[8, 8, 250, 250]'); // first div |
+ shouldBeEqualToString('rectToString(nonFastScrollableRects[1])', |
+ '[8, 308, 250, 250]'); // second div |
+ |
+ // Change visibility (visible -> hidden) |
+ second.style.visibility = 'hidden'; |
+ |
+ awaitCompsitingUpdate(function() { |
+ // This has no functional impact just visual |
+ runNonFastScrollableRegionTest(); |
+ |
+ nonFastScrollableRects = internals.nonFastScrollableRects(document); |
+ shouldBe('nonFastScrollableRects.length', '1'); |
+ shouldBeEqualToString('rectToString(nonFastScrollableRects[0])', |
+ '[8, 8, 250, 250]'); // first div |
+ |
+ finishJSTest(); |
+ }); |
+ }); |
+ }); |
+ } |
+ |
+ // Makes the container non-fast scrollable area by appending a large element to it. |
+ function makeNonFastScrollable(container) { |
+ var inner = document.createElement('div'); |
+ container.appendChild(inner); |
+ } |
+ |
+ // Waits for one RAF call to ensure compsiting update is occured and invokes task. |
+ function awaitCompsitingUpdate(task) { |
+ var loop = window.requestAnimationFrame(function() { |
+ try { |
+ task(); |
+ } finally { |
+ window.cancelAnimationFrame(loop); |
Rick Byers
2015/01/12 22:36:27
I don't think you need this. RAF fires exactly on
majidvp
2015/01/13 16:01:56
Done.
|
+ } |
+ }); |
+ } |
+ |
+ function rectToString(rect) { |
+ return '[' + [rect.left, rect.top, rect.width, rect.height].join(', ') + ']'; |
+ } |
+</script> |