blob: 9e9656f05717a7ac2a6125f89645ca7311487006 (
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
69
70
71
72
73
|
<!DOCTYPE HTML>
<html>
<script src="../../resources/ahem.js"></script>
<head>
<title></title>
<style type="text/css">
button { font-family: Ahem; }
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>
|
