|
1 <!DOCTYPE html> |
|
2 <html class="reftest-wait"> |
|
3 <head> |
|
4 <title>glyph clipping (test)</title> |
|
5 <style> |
|
6 #clip { position: absolute; |
|
7 overflow: hidden; |
|
8 font-size: 16px; |
|
9 width: 500px; |
|
10 height: 300px;} |
|
11 /* Offsets keep the text far enough away from clip boundaries so that |
|
12 cairo knows the text is within the clip. Non-unit alpha color makes |
|
13 the bug show even without antialiasing. */ |
|
14 #text { position: absolute; |
|
15 left: 100px; |
|
16 top: 100px; |
|
17 color: rgba(0,0,0,0.4)} |
|
18 #cover { position: absolute; |
|
19 top: 90px; |
|
20 left: 120px; |
|
21 height: 50px; |
|
22 width: 60px; |
|
23 background: green; } |
|
24 #mod { position: absolute; |
|
25 top: 400px; |
|
26 left: 0px; |
|
27 height: 2000px; |
|
28 width: 600px; |
|
29 background: green; } |
|
30 </style> |
|
31 <script> |
|
32 |
|
33 function doPaint() |
|
34 { |
|
35 window.addEventListener("MozAfterPaint", doScroll, false); |
|
36 var cover = document.getElementById("cover"); |
|
37 cover.style.background = "transparent"; |
|
38 var mod = document.getElementById("mod"); |
|
39 mod.style.background = "transparent"; |
|
40 } |
|
41 |
|
42 function doScroll() |
|
43 { |
|
44 window.removeEventListener("MozAfterPaint", doScroll, false); |
|
45 window.addEventListener("MozAfterPaint", endTest, false); |
|
46 scrollTo(0,1); |
|
47 } |
|
48 |
|
49 function endTest() |
|
50 { |
|
51 document.documentElement.removeAttribute("class"); |
|
52 } |
|
53 |
|
54 document.addEventListener("MozReftestInvalidate", doPaint, false); |
|
55 </script> |
|
56 </head> |
|
57 <body> |
|
58 <div id="clip"> |
|
59 <div id="text"> |
|
60 Some text that was</br> |
|
61 initially partially covered.</br> |
|
62 </div> |
|
63 </div> |
|
64 <div id="cover"> |
|
65 </div> |
|
66 <div id="mod"> |
|
67 </div> |
|
68 </body> |
|
69 </html> |