| <!DOCTYPE HTML> |
| <html> |
| <head> |
| <title></title> |
| <style type="text/css"> |
| button.bef:before { content:'before'; } |
| button.aft:after { content:'after'; } |
| button.bef1:before { content:'BEFORE'; } |
| button.aft1:after { content:'AFTER'; } |
| </style> |
| <script type="text/javascript"> |
| function test() |
| { |
| // force layout |
| document.body.offsetTop; |
| // change style, forcing generated content to update |
| document.getElementById("a").style.color = "blue"; |
| document.getElementById("b").style.color = "blue"; |
| document.getElementById("c").style.color = "blue"; |
| document.getElementById("d").style.color = "blue"; |
| // remove generated content |
| document.getElementById("e").className = ""; |
| document.getElementById("f").className = ""; |
| document.getElementById("g").className = ""; |
| document.getElementById("h").className = ""; |
| // add generated content |
| document.getElementById("i").className = "bef"; |
| document.getElementById("j").className = "bef"; |
| document.getElementById("k").className = "aft"; |
| document.getElementById("l").className = "aft"; |
| // replace generated content |
| document.getElementById("m").className = "bef"; |
| document.getElementById("n").className = "bef"; |
| document.getElementById("o").className = "aft"; |
| document.getElementById("p").className = "aft"; |
| } |
| </script> |
| </head> |
| <body onload="test();"> |
| <p> |
| This is a test of generated content in <button> for |
| <i><a href="https://bugs.webkit.org/show_bug.cgi?id=9561">http://bugzilla.opendarwin.org/show_bug.cgi?id=9561</a> |
| REGRESSION: Content property on :before of button causes hang on click or hover</i>. |
| </p> |
| <hr> |
| <button id="a" class="bef"></button> |
| <button id="b" class="bef">button</button> |
| <br> |
| <button id="c" class="aft"></button> |
| <button id="d" class="aft">button</button> |
| <br> |
| <button id="e" class="bef"></button> |
| <button id="f" class="bef">button</button> |
| <br> |
| <button id="g" class="aft"></button> |
| <button id="h" class="aft">button</button> |
| <br> |
| <button id="i"></button> |
| <button id="j">button</button> |
| <br> |
| <button id="k"></button> |
| <button id="l">button</button> |
| <br> |
| <button id="m" class="bef1"></button> |
| <button id="n" class="bef1">button</button> |
| <br> |
| <button id="o" class="aft1"></button> |
| <button id="p" class="aft1">button</button> |
| <br> |
| </body> |
| </html> |
