blob: c9f7520f3e53b4ef6cc21cd1b8ab7ac071f48659 [file] [log] [blame]
rniwa@webkit.orgdf927522013-12-09 18:51:02 +00001<!DOCTYPE html>
2<html>
3<head>
4<style>
5.outerx .mid .inner {
6 background-color: red;
7}
8.outery .mid .inner {
9 background-color: green;
10}
11.inner {
12 width: 50px;
13 height: 50px;
14}
15</style>
16<script>
17function test() {
18 if (window.testRunner)
19 testRunner.dumpAsText();
20
21 var x = document.getElementById("x");
22 x.classList.add("outerx");
23
24 var y = document.getElementById("y");
25 y.classList.add("outery");
26
27 var colorX = getComputedStyle(x.children[0].children[0]).backgroundColor;
28 var colorY = getComputedStyle(y.children[0].children[0]).backgroundColor;
29
30 var result = document.getElementById("result")
31 if (colorX == colorY)
32 result.innerHTML = "FAIL";
33 else
34 result.innerHTML = "SUCCESS";
35}
36</script>
37</head>
38<body onload="test()">
39This test succeeds if the two blocks show red and green repectively: <span id="result"></span>
40<div id="x">
41 <div class="mid">
42 <div class="inner">
43 </div>
44 </div>
45</div>
46<div id="y">
47 <div class="mid">
48 <div class="inner">
49 </div>
50 </div>
51</div>
52</body>
53</html>