summaryrefslogtreecommitdiffstats
path: root/third_party/WebKit/LayoutTests/printing/pseudo-class-outside-page.html
blob: a2275067f3c1afdff56089fcf8041873400826f2 (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
74
75
76
77
78
79
80
81
82
83
<!DOCTYPE html>
<html>
<head>

<style type="text/css" media="screen">
    #green {
        background-color: green;
    }
    #test1 {
        width: 100px;
        height: 100px;
        background-color: green;
    }
    .exception_test {
        color: red;
    }
    /* These selectors should be ignored */
    #test1:first {
        background-color: red;
    }
    #test1:left {
        background-color: red;
    }
    #test1:right {
        background-color: red;
    }
</style>
<script>
    if (window.testRunner)
        testRunner.dumpAsText();

    function test()
    {
        var expected = getComputedStyle(document.getElementById("green"), null).backgroundColor;
        var actual = getComputedStyle(document.getElementById("test1"), null).backgroundColor;
        var result = "PASS";
        if (actual != expected)
            result = "Expected " + expected + ", but comes " + actual;
        document.getElementById("result").innerHTML = result;

        var invalidSelectors = [":first", ":left", ":right", "::first", "::left", "::right",
                                ".login-popup:first", ".login-popup:left", ".login-popup:right", ".login-popup::first", ".login-popup::left", ".login-popup::right"];
        for (var testId = 2; testId <= 13; testId++) {
            var element = document.getElementById("test" + testId);
            var invalidSelector = invalidSelectors[testId - 2];
            try {
                document.querySelectorAll(invalidSelector);
                element.innerHTML = "Test " + testId + ": FAIL";
            } catch (e) {
                element.innerHTML = "Test " + testId + ": PASS";
                element.style.color = "green";
            }
        }
    }
</script>
</head>
<body onload="test()">

<p>
Test case for <a href="https://bugs.webkit.org/show_bug.cgi?id=38272">SHOULD NEVER BE REACHED assertion loading forbes.com</a>.
Paged media related pseudo-classes should be ignored outside of @page.

<p>
You should see a green box for Test 1, "Test n: PASS" for the rest.

<div id="green"></div>
<div id="test1"></div>
<div id="test2" class="exception_test">Test 2: Didn't run</div>
<div id="test3" class="exception_test">Test 3: Didn't run</div>
<div id="test4" class="exception_test">Test 4: Didn't run</div>
<div id="test5" class="exception_test">Test 5: Didn't run</div>
<div id="test6" class="exception_test">Test 6: Didn't run</div>
<div id="test7" class="exception_test">Test 7: Didn't run</div>
<div id="test8" class="exception_test">Test 8: Didn't run</div>
<div id="test9" class="exception_test">Test 9: Didn't run</div>
<div id="test10" class="exception_test">Test 10: Didn't run</div>
<div id="test11" class="exception_test">Test 11: Didn't run</div>
<div id="test12" class="exception_test">Test 12: Didn't run</div>
<div id="test13" class="exception_test">Test 13: Didn't run</div>
<div id="result"></div>

</body>
</html>