OLD | NEW |
---|---|
(Empty) | |
1 <!DOCTYPE HTML> | |
2 <script src="../../resources/js-test.js"></script> | |
3 <style> | |
4 .grid { | |
5 width: 115px; | |
6 height: 115px; | |
7 border: solid 5px purple; | |
8 overflow-x: scroll; | |
9 overflow-y: scroll; | |
10 } | |
11 .row { | |
12 width: 100px; | |
13 height: 50px; | |
14 } | |
15 .column { | |
16 width: 48px; | |
17 height: 48px; | |
18 outline: solid 1px green; | |
19 } | |
20 table, tr, td { | |
21 border-collapse: collapse; | |
22 } | |
23 </style> | |
24 <body> | |
25 <div id="parent" class="grid"> | |
26 <table id="Grid"> | |
27 <tr class="row"> | |
28 <td><div class="column"></div></td> | |
29 <td><div class="column"></div></td> | |
30 <td><div class="column"></div></td> | |
31 <td><div class="column"></div></td> | |
32 <td><div class="column"></div></td> | |
33 </tr> | |
34 <tr class="row"> | |
35 <td><div class="column"></div></td> | |
36 <td><div class="column"></div></td> | |
37 <td><div class="column"></div></td> | |
38 <td><div class="column"></div></td> | |
39 <td><div class="column"></div></td> | |
40 </tr> | |
41 <tr class="row"> | |
42 <td><div class="column"></div></td> | |
43 <td><div class="column"></div></td> | |
44 <td><div class="column"></div></td> | |
45 <td><div class="column"></div></td> | |
46 <td><div class="column"></div></td> | |
47 </tr> | |
48 <tr class="row"> | |
49 <td><div class="column"></div></td> | |
50 <td><div class="column"></div></td> | |
51 <td><div class="column"></div></td> | |
52 <td><div class="column"></div></td> | |
53 <td><div class="column"></div></td> | |
54 </tr> | |
55 <tr class="row"> | |
56 <td><div class="column"></div></td> | |
57 <td><div class="column"></div></td> | |
58 <td><div class="column"></div></td> | |
59 <td><div class="column"></div></td> | |
60 <td><div class="column"></div></td> | |
leviw_travelin_and_unemployed
2014/10/11 01:49:16
Can't this be done with a small fraction of the co
Ambarish
2014/10/12 11:59:55
Hi Leviw,
I tried to reduce the number of rows and
| |
61 </tr> | |
62 </table> | |
63 </div> | |
64 <script> | |
65 description('Issue crbug.com/295848: element.scrollIntoViewIfNeeded() do es not scroll the entire element render box into view.'); | |
66 // This html comprieses testing if parent border is not affecting scroll Left and scrollTop value, when a child element is auto scrolled. | |
67 // When child at row index 8 and column 5 is scrolled into view from bot tom left, the scrollTop & scrollLeft should be 75 & 150 respectively. | |
68 // When child at row index 1 and column 2 is scrolled into view from top right, the scrollTop & scrollLeft should be 25 & 100 respectively. | |
69 | |
70 if (window.testRunner) | |
71 testRunner.dumpAsText(true); | |
72 | |
73 var scrollTop; | |
74 var scrollLeft; | |
75 var column; | |
76 var columnDiv; | |
77 var row; | |
78 var parent = document.getElementById("parent"); | |
79 var table = document.getElementById("Grid"); | |
80 | |
81 row = table.rows[3] | |
82 row.cells[3].scrollIntoViewIfNeeded(false); | |
83 scrollTop = parent.scrollTop; | |
84 shouldBeEqualToNumber('scrollTop', 100); | |
85 scrollLeft = parent.scrollLeft; | |
86 shouldBeEqualToNumber('scrollLeft', 100); | |
87 | |
88 row = table.rows[1]; | |
89 row.cells[1].scrollIntoViewIfNeeded(false); | |
90 scrollTop = parent.scrollTop; | |
91 shouldBeEqualToNumber('scrollTop', 50); | |
92 scrollLeft = parent.scrollLeft; | |
93 shouldBeEqualToNumber('scrollLeft', 50); | |
94 </script> | |
95 </body> | |
OLD | NEW |