Reviewed by Darin, landed by ap.
[WebKit-https.git] / WebCore / manual-tests / border-repaint-glitch.html
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
2         "http://www.w3.org/TR/html4/strict.dtd">
3 <html lang="en">
4 <head>
5 <style type="text/css">
6     div.test { width: 200px; height: 120px; border: 1px solid blue; padding: 10px; }
7 </style>
8 </head>
9 <body>
10 <p><b>BUG ID:</b> <a href="http://bugzilla.opendarwin.org/show_bug.cgi?id=6301">Bugzilla bug 6301</a> REGRESSION: Border repaint glitch</p>
11
12 <p id="test" style="background-color:skyblue; padding:3px;"><b>STEPS TO TEST:</b> 
13 Click each Test button once.
14 </p>
15
16 <p id="success" style="background-color:palegreen; padding:3px;"><b>TEST PASS:</b> 
17 The boxes will resize, maintaining their solid red rectangular borders.
18 </p>
19
20 <p id="failure" style="background-color:#FF3300; padding:3px;"><b>TEST FAIL:</b>  
21 The boxes will resize, but the borders will break. The first box will be missing
22 small segments from either side of its bottom border. The second box will have
23 small red horizontal segments protruding inwards from both sides of the border,
24 where the bottom border was before.
25 </p>
26
27 <div class="test">
28     <button onclick="document.getElementById('a').style.height = '40px'">Test</button>
29     <div style="background: teal; padding: 0; border: solid red 4px;">
30         <div id="a" style="height: 60px; margin: 10px; background:silver;"></div>
31     </div>
32 </div>
33 <br>
34 <div class="test">
35     <button onclick="document.getElementById('b').style.height = '60px'">Test</button>
36     <div style="background: teal; padding: 0; border: solid red 4px;">
37         <div id="b" style="height: 40px; margin: 10px; background:silver;"></div>
38     </div>
39 </div>
40
41 </body>
42 </html>