Chromium Code Reviews Chromium Code Reviews
Issue 568453002:
Removing container's Left & Top border from computed scroll offset bounds. (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master| Index: LayoutTests/fast/scroll-behavior/bordered-container-child-scroll.html |
| diff --git a/LayoutTests/fast/scroll-behavior/bordered-container-child-scroll.html b/LayoutTests/fast/scroll-behavior/bordered-container-child-scroll.html |
| new file mode 100644 |
| index 0000000000000000000000000000000000000000..8ee5993311c6ccc3ffb2e2dc95f944f020cf27b6 |
| --- /dev/null |
| +++ b/LayoutTests/fast/scroll-behavior/bordered-container-child-scroll.html |
| @@ -0,0 +1,79 @@ |
| +<!DOCTYPE HTML> |
| +<html> |
| + <head> |
|
leviw_travelin_and_unemployed
2014/10/08 20:18:42
nit: you don't need the head or html tags
Ambarish
2014/10/10 11:28:45
Done.
Ambarish
2014/10/10 11:28:45
Done.
|
| + <script src="../../resources/js-test.js"></script> |
| + <style type="text/css"> |
|
leviw_travelin_and_unemployed
2014/10/08 20:18:42
nit: you don't need the "type=..."
Ambarish
2014/10/10 11:28:45
Done.
|
| + .grid { |
| + width: 165px; |
| + height: 165px; |
| + border: solid 5px purple; |
| + overflow-x: scroll; |
| + } |
| + .row { |
| + width: 150px; |
| + height: 25px; |
| + } |
| + .column { |
| + width: 50px; |
| + height: 25px; |
| + box-sizing: border-box; |
| + background: black; |
|
leviw_travelin_and_unemployed
2014/10/08 20:19:14
A lot of these styles are simply unnecessary. Take
Ambarish
2014/10/10 11:28:45
Done.
|
| + outline: solid 1px green; |
| + outline-offset: -1px; |
| + } |
| + </style> |
| + </head> |
| + <body> |
| + <script> |
| + description('Issue crbug.com/295848: element.scrollIntoViewIfNeeded() does not scroll the entire element render box into view.'); |
| + // This html comprieses testing if parent border is not affecting scrollLeft and scrollTop value, when a child element is auto scrolled. |
| + // When child at row index 8 and column 5 is scrolled into view from bottom left, the scrollTop & scrollLeft should be 75 & 150 respectively. |
| + // When child at row index 1 and column 2 is scrolled into view from top right, the scrollTop & scrollLeft should be 25 & 100 respectively. |
| + |
| + if (window.testRunner) |
| + testRunner.dumpAsText(true); |
| + |
| + var scrollTop; |
| + var scrollLeft; |
| + var row; |
| + var column; |
| + var columnDiv; |
| + var grid = document.createElement('div'); |
| + grid.id = "Grid"; |
| + grid.className = 'grid'; |
| + document.body.appendChild(grid); |
|
leviw_travelin_and_unemployed
2014/10/08 20:18:42
Why not just have the grid in the DOM to start?
I
Ambarish
2014/10/10 11:28:45
Done.
|
| + |
| + for (var i = 0; i < 10; i++) { |
| + row = document.createElement('tr'); |
| + row.className = 'row'; |
| + for (var j = 0; j < 7; j++) { |
| + column = document.createElement('td'); |
| + columnDiv = document.createElement('div'); |
| + columnDiv.className = 'column'; |
| + if ((i == 8 && j == 5) || (i == 1 && j == 2)) |
| + columnDiv.style.backgroundColor = "white"; |
|
leviw_travelin_and_unemployed
2014/10/08 20:18:42
Why?
Ambarish
2014/10/10 11:28:45
Done.
|
| + column.appendChild(columnDiv); |
| + row.appendChild(column); |
| + } |
| + grid.appendChild(row); |
| + } |
| + |
| + row = grid.getElementsByTagName('tr')[8]; |
| + column = row.getElementsByTagName('td')[5]; |
| + column.scrollIntoViewIfNeeded(false); |
| + scrollTop = grid.scrollTop; |
| + shouldBeEqualToNumber('scrollTop', 75); |
| + scrollLeft = grid.scrollLeft; |
| + shouldBeEqualToNumber('scrollLeft', 150); |
| + |
| + row = grid.getElementsByTagName('tr')[1]; |
| + column = row.getElementsByTagName('td')[2]; |
| + column.scrollIntoViewIfNeeded(false); |
| + scrollTop = grid.scrollTop; |
| + shouldBeEqualToNumber('scrollTop', 25); |
| + scrollLeft = grid.scrollLeft; |
| + shouldBeEqualToNumber('scrollLeft', 100); |
| + |
| + </script> |
| + </body> |
| +</html> |
