chromium/src/third_party/blink/web_tests/fast/css/hover-active-quirks.html

<!-- quirks mode -->
<script src="../../resources/js-test.js"></script>
<style>
#sandbox div { width: 30px; height: 30px; }
#sandbox > div { outline: 1px solid black; display: inline-block }
#sandbox a { display: block; width: 30px; height: 30px; }

#t1 > div, #t2 > div, #t3 > div, #t4 > div, #t5 > div, #t6 > div { background-color: green }

#t1 :hover,
#t2 :active,
#t3 :hover:active,
#t4 *:hover,
#t5 *:active,
#t6 *:active:hover {
    background-color: red;
}

#t7 :not(:hover),
#t8 :not(:active),
#t9 :hover:not(:active),
#t10 :not(:active):hover,
#t11 :active:not(:hover),
#t12 :not(:hover):active,
:hover#t13,
:hover.t14,
:hover[t15],
#t16:hover,
.t17:hover,
[t18]:hover,
#t19 :hover,
:active#t20,
:active.t21,
:active[t22],
#t23:active,
.t24:active,
[t25]:active,
#t26 :active {
    background-color: green
}
</style>
<div id="sandbox">
    <span>Should stay green when hovered and/or active:</span>
    <div id="t1"><div></div></div>
    <div id="t2"><div></div></div>
    <div id="t3"><div></div></div>
    <div id="t4"><div></div></div>
    <div id="t5"><div onclick=""></div></div>
    <div id="t6"><div></div></div>
    <br><span>Should be green when not hovered:</span>
    <div id="t7"><div></div></div>
    <br><span>Should be green when not active:</span>
    <div id="t8"><div></div></div>
    <br><span>Should be green when hovered and not active:</span>
    <div id="t9"><div></div></div>
    <div id="t10"><div></div></div>
    <br><span>Should be green when active and not hovered:</span>
    <div id="t11"><div onclick=""></div></div>
    <div id="t12"><div onclick=""></div></div>
    <br><span>Should be green when hovered:</span>
    <div id="t13"></div>
    <div id="t14" class="t14"></div>
    <div id="t15" t15></div>
    <div id="t16"></div>
    <div id="t17" class="t17"></div>
    <div id="t18" t18></div>
    <div id="t19"><a href="#" onclick="event.preventDefault()"></a></div>
    <br><span>Should be green when active:</span>
    <div id="t20" onclick=""></div>
    <div id="t21" onclick="" class="t21"></div>
    <div id="t22" onclick="" t22></div>
    <div id="t23" onclick=""></div>
    <div id="t24" onclick="" class="t24"></div>
    <div id="t25" onclick="" t25></div>
    <div id="t26"><a href="#" onclick="event.preventDefault()"></a></div>
</div>
<script>
    description("Quirks mode - matching :hover and :active");

    setPrintTestResultsLazily();

    function testElement(element, whileHovering, whileActive) {
        if (whileActive || whileHovering) {
            hoverX = element.offsetLeft + 2;
            hoverY = element.offsetTop + 2;
            eventSender.mouseMoveTo(hoverX, hoverY);
            if (whileActive) {
                eventSender.mouseDown();
            }
            if (!whileHovering) {
                eventSender.mouseMoveTo(1, 1);
            }

            var result = getComputedStyle(element).backgroundColor;

            if (whileActive) {
                eventSender.mouseUp();
                if (!whileHovering) {
                    eventSender.mouseDown();
                    eventSender.mouseUp();
                }
            }

            return result;
        }
        return getComputedStyle(element).backgroundColor;
    }

    shouldBeDefined("window.eventSender");
    eventSender.dragMode = false;

    var green = "rgb(0, 128, 0)";

    shouldBe("testElement(t1.firstChild, true, false)", "green");
    shouldBe("testElement(t2.firstChild, true, true)", "green");
    shouldBe("testElement(t3.firstChild, true, true)", "green");
    shouldBe("testElement(t4.firstChild, true, false)", "green");
    shouldBe("testElement(t5.firstChild, true, true)", "green");
    shouldBe("testElement(t6.firstChild, true, true)", "green");
    shouldBe("testElement(t7.firstChild, false, false)", "green");
    shouldBe("testElement(t8.firstChild, false, false)", "green");
    shouldBe("testElement(t9.firstChild, true, false)", "green");
    shouldBe("testElement(t10.firstChild, true, false)", "green");
    shouldBe("testElement(t11.firstChild, false, true)", "green");
    shouldBe("testElement(t12.firstChild, false, true)", "green");
    shouldBe("testElement(t13, true, false)", "green");
    shouldBe("testElement(t14, true, false)", "green");
    shouldBe("testElement(t15, true, false)", "green");
    shouldBe("testElement(t16, true, false)", "green");
    shouldBe("testElement(t17, true, false)", "green");
    shouldBe("testElement(t18, true, false)", "green");
    shouldBe("testElement(t19.firstChild, true, false)", "green");
    shouldBe("testElement(t20, true, true)", "green");
    shouldBe("testElement(t21, true, true)", "green");
    shouldBe("testElement(t22, true, true)", "green");
    shouldBe("testElement(t23, true, true)", "green");
    shouldBe("testElement(t24, true, true)", "green");
    shouldBe("testElement(t25, true, true)", "green");
    shouldBe("testElement(t26.firstChild, true, true)", "green");

</script>