blob: e5d8dc1c27aec03c487112dd3c38cc5919eba11c (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
|
<!DOCTYPE html>
<html>
<head>
<style>
p { height: 100px; width: 100px; margin: 0px; }
p.red { background-color: red; }
p.green { background-color: green; }
div { height: 100px; width: 100px; }
div.relative { position: relative }
div.rotated
{
transform: rotate(360deg);
}
div.translated
{
transform: translate(0);
}
</style>
<script>
if (window.testRunner)
testRunner.dumpAsTextWithPixelResults();
</script>
</head>
<body>
<!-- This test should be a ref-test but small scrollbars difference between platforms makes it fail. -->
<span>http://webkit.org/b/67100: REGRESSION (r93614): Safari Reader doesn't repaint correctly when scrolling</span><br/>
<span>All the boxes should only contain green content.</span>
<!-- Use a translation. -->
<div class="scrollMe translated" style="overflow: hidden;">
<div class="relative">
<p class="red"></p>
<p class="green"></p>
<p class="red"></p>
</div>
</div>
<br>
<div class="scrollMe translated" style="overflow: scroll;">
<div class="relative">
<p class="red"></p>
<p class="green"></p>
<p class="red"></p>
</div>
</div>
<br>
<!-- Use a rotation. -->
<div class="scrollMe rotated" style="overflow: hidden;">
<div class="relative">
<p class="red"></p>
<p class="green"></p>
<p class="red"></p>
</div>
</div>
<br>
<div class="scrollMe rotated" style="overflow: scroll;">
<div class="relative">
<p class="red"></p>
<p class="green"></p>
<p class="red"></p>
</div>
</div>
<br>
<script>
var scrollMes = document.getElementsByClassName("scrollMe");
for (var i = 0; i < scrollMes.length; ++i)
scrollMes[i].scrollTop = 100;
</script>
</body>
</html>
|
