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

Side by Side Diff: LayoutTests/scrollingcoordinator/non-fast-scrollable-visibility-change.html

Issue 850113003: iframe updates its parent scrollable area set when its visibility change (Closed) Base URL: https://chromium.googlesource.com/chromium/blink.git@master
Patch Set: minor spelling corrections Created 5 years, 11 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 unified diff | Download patch
« no previous file with comments | « no previous file | LayoutTests/scrollingcoordinator/non-fast-scrollable-visibility-change-expected.txt » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <style> 2 <style>
3 body { 3 body {
4 margin: 0; 4 margin: 0;
5 } 5 }
6 .non-fast { 6 .container {
7 height: 250px; 7 height: 250px;
8 width: 250px; 8 width: 250px;
9 margin-top: 50px;
9 display: block; 10 display: block;
10 background-color: red;
11 overflow: scroll;
12 } 11 }
13 .non-fast > div { 12 .container > div {
13 height: 200px;
14 width: 200px;
15 overflow: scroll;
16 }
17 .container > div > div {
14 height: 1000px; 18 height: 1000px;
15 width: 1000px; 19 width: 1000px;
20 background: linear-gradient(to bottom, red, white);
21 }
22 .container > iframe {
23 height: 222px;
24 width: 222px;
16 display: block; 25 display: block;
17 background: linear-gradient(to bottom, red, white); 26 border: none;
18 } 27 }
19 </style> 28 </style>
20 29
21 <div id="first" class="non-fast"> 30 <section id='div' style="display:none;">
22 This should be covered by the ONLY visible green overlay. 31 <div class="to-show container">
23 </div> 32 </div>
24 <div id="second" class="non-fast" style="margin-top:50px;"> 33 <div class="to-hide container">
25 This should not be visible. 34 <div>
26 <div></div> 35 <div>This should not be visible.</div>
27 </div> 36 </div>
37 </div>
38 </section>
39
40 <section id="iframe" style="display:none;">
41 <div class="to-show container">
42 </div>
43 <div class="to-hide container">
44 <iframe src="data:text/html;charset=utf-8,<div style='height:1000px; width:1 000px; background: linear-gradient(to bottom, red, white);'>">
45 This should not be visible.
46 </iframe>
47 </div>
48 </section>
49
50 <p>Two squares should be visible and fully covered by green overlays.</p>
28 51
29 <div id="console"></div> 52 <div id="console"></div>
30 53
31 <script src="../resources/js-test.js"></script> 54 <script src="../resources/js-test.js"></script>
32 <script src="resources/non-fast-scrollable-region-testing.js"></script> 55 <script src="resources/non-fast-scrollable-region-testing.js"></script>
33 <script> 56 <script>
34 window.jsTestIsAsync = true; 57 window.jsTestIsAsync = true;
35 description('This test ensures that changing visibility of a non-fast ' + 58 description('This test ensures that changing visibility of a non-fast ' +
36 'scrollable area correctly updates list of non-fast scrollable ' + 59 'scrollable area correctly updates list of non-fast scrollable ' +
37 'areas. (See http://crbug.com/434982)'); 60 'areas (See http://crbug.com/434982). Two types of non-fast ' +
61 'scrollable regions are covered: div, and iframe.');
38 62
39 onload = function() { 63 onload = next;
40 awaitCompsitingUpdate(runTest);
41 };
42 64
43 function runTest() { 65 var testCases = [
44 var first = document.getElementById('first'), 66 // type, bounding box of element to show, bounding box of element to hide
45 second = document.getElementById('second'); 67 ['div', '[0, 50, 200, 200]', '[0, 350, 200, 200]'],
68 ['iframe', '[0, 50, 222, 222]', '[0, 350, 222, 222]']];
46 69
47 nonFastScrollableRects = internals.nonFastScrollableRects(document); 70 var index = 0;
48 shouldBe('nonFastScrollableRects.length', '1'); 71 function next(){
49 shouldBeEqualToString('rectToString(nonFastScrollableRects[0])', 72 if (index < testCases.length) {
50 '[0, 300, 250, 250]'); // second div 73 var type = testCases[index][0];
74 debug('running tests for non-fast scrollable ' + type);
75 runTest.apply(this, testCases[index]);
76 } else {
77 // Next 3 statements have no functional impact just visual
78 showSectionIf(function(){return true;});
79 awaitCompsitingUpdate(function(){
80 runNonFastScrollableRegionTest();
51 81
52 // Hide container before making it non-fast scrollable to ensure any 82 finishJSTest();
53 // layout occurs while it is invisible. 83 });
54 first.style.visibility = 'hidden'; 84 }
55 makeNonFastScrollable(first);
56 85
57 // Change visibility (hidden -> visible), which should not cause any layout, 86 index++;
58 // and verify that non-fast scrollable areas are correctly updated. 87 }
88
89 // Execute tests for given non-fast scrollable type.
90 function runTest(type, elemToShowExpected, elemToHideExpected) {
91 // Hide all sections that are not relevant to this test to ensure
92 // |window.internals.nonFastScrollableRects| returns only the relevant non-
93 // fast scrollable regions.
94 showSectionIf(function(section){return section.id == type;});
95
59 awaitCompsitingUpdate(function() { 96 awaitCompsitingUpdate(function() {
60 first.style.visibility = 'visible'; 97 shouldBeEqualToString('document.getElementById("' + type + '").style.displ ay', 'block');
61 shouldBe('window.internals.needsLayoutCount()', '0');
62 98
99 var elemToShow = document.querySelector('section#' + type + '> .to-show'),
100 elemToHide = document.querySelector('section#' + type + '> .to-hide');
101
102 nonFastScrollableRects = internals.nonFastScrollableRects(document);
103 shouldBe('nonFastScrollableRects.length', '1');
104 shouldBeEqualToString('rectToString(nonFastScrollableRects[0])', elemToHid eExpected);
105
106 // Hide container before making it non-fast scrollable to ensure any
107 // layout occurs while it is invisible.
108 elemToShow.style.visibility = 'hidden';
109 appendScrollable(elemToShow, type);
110
111 // Change visibility (hidden -> visible), which should not cause any layou t,
112 // and verify that non-fast scrollable areas are correctly updated.
63 awaitCompsitingUpdate(function() { 113 awaitCompsitingUpdate(function() {
64 nonFastScrollableRects = internals.nonFastScrollableRects(document); 114 elemToShow.style.visibility = 'visible';
65 shouldBe('nonFastScrollableRects.length', '2');
66 shouldBeEqualToString('rectToString(nonFastScrollableRects[0])',
67 '[0, 0, 250, 250]'); // first div
68 shouldBeEqualToString('rectToString(nonFastScrollableRects[1])',
69 '[0, 300, 250, 250]'); // second div
70
71 // Change visibility (visible -> hidden)
72 second.style.visibility = 'hidden';
73 shouldBe('window.internals.needsLayoutCount()', '0'); 115 shouldBe('window.internals.needsLayoutCount()', '0');
74 116
75 awaitCompsitingUpdate(function() { 117 awaitCompsitingUpdate(function() {
76 // This has no functional impact just visual 118 nonFastScrollableRects = internals.nonFastScrollableRects(document);
77 runNonFastScrollableRegionTest(); 119 shouldBe('nonFastScrollableRects.length', '2');
120 shouldBeEqualToString('rectToString(nonFastScrollableRects[0])', elemT oShowExpected);
121 shouldBeEqualToString('rectToString(nonFastScrollableRects[1])', elemT oHideExpected);
78 122
79 nonFastScrollableRects = internals.nonFastScrollableRects(document); 123 // Change visibility (visible -> hidden)
80 shouldBe('nonFastScrollableRects.length', '1'); 124 elemToHide.style.visibility = 'hidden';
81 shouldBeEqualToString('rectToString(nonFastScrollableRects[0])', 125 shouldBe('window.internals.needsLayoutCount()', '0');
82 '[0, 0, 250, 250]'); // first div
83 126
84 finishJSTest(); 127 awaitCompsitingUpdate(function() {
128 nonFastScrollableRects = internals.nonFastScrollableRects(document);
129 shouldBe('nonFastScrollableRects.length', '1');
130 shouldBeEqualToString('rectToString(nonFastScrollableRects[0])', ele mToShowExpected);
131 next();
132 });
85 }); 133 });
86 }); 134 });
87 }); 135 });
88 } 136 }
89 137
90 // Makes the container non-fast scrollable area by appending a large element t o it. 138 // Appends to container an scrollable element of the given type.
91 function makeNonFastScrollable(container) { 139 // Note that because this layout test runs with --dump-render-tree flag
92 var inner = document.createElement('div'); 140 // the appended scrollable is always non-fast even on HDPI platforms.
93 container.appendChild(inner); 141 function appendScrollable(container, type) {
142 var inner;
143 switch (type) {
144 case 'div':
145 inner = '<div><div>This should be covered by a green overlay.</div></div>' ;
146 break;
147 case 'iframe':
148 inner = '<iframe id="iframe" src="data:text/html;charset=utf-8,<div style =\'height:1000px; width:1000px; background: linear-gradient(to bottom, red, whit e);\'>This should be covered by a green overlay.</div>"></iframe>';
149 break;
150 }
151 container.innerHTML = inner;
152 }
153
154 // Shows sections that pass condition but hides others
155 function showSectionIf(condition) {
156 var sections = document.querySelectorAll('section');
157 for (var i = 0; i < sections.length; i++)
158 sections[i].style.display = condition(sections[i]) ? 'block' : 'none';
94 } 159 }
95 160
96 // Waits for one RAF call to ensure compositing update has occurred and invoke s task. 161 // Waits for one RAF call to ensure compositing update has occurred and invoke s task.
97 function awaitCompsitingUpdate(task) { 162 function awaitCompsitingUpdate(task) {
98 window.requestAnimationFrame(task); 163 window.requestAnimationFrame(task);
99 } 164 }
100 165
101 function rectToString(rect) { 166 function rectToString(rect) {
102 return '[' + [rect.left, rect.top, rect.width, rect.height].join(', ') + ']' ; 167 return '[' + [rect.left, rect.top, rect.width, rect.height].join(', ') + ']' ;
103 } 168 }
104 </script> 169 </script>
OLDNEW
« no previous file with comments | « no previous file | LayoutTests/scrollingcoordinator/non-fast-scrollable-visibility-change-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698