pseudo-active-display-none.html | Explore in Territory

<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<style>
label {
	background-color: black;
}
input:active + label {
	background-color: red;
}
#nodisplay {
	display: none;
}
</style>
<input id="nodisplay" type="checkbox"/>
<label id="label1" for="nodisplay">The target input has its display set to none.</label>
<script>
test(function() {
    assert_true(window.eventSender !== null);
}, "window.eventSender is required for the test to run");

test(function() {
    var l1 = document.getElementById("label1");
    var x = l1.offsetLeft + l1.offsetWidth/2;
    var y = l1.offsetTop + l1.offsetHeight/2;
    eventSender.mouseMoveTo(x, y);
    eventSender.mouseDown();
    assert_equals(getComputedStyle(l1).backgroundColor, 'rgb(255, 0, 0)');
    eventSender.mouseUp();
    assert_equals(getComputedStyle(l1).backgroundColor, 'rgb(0, 0, 0)');
}, "This test performs a check for active pseudo class to be applied for element when its display is set to none.");
</script>

chromium/third_party/blink/web_tests/fast/css/pseudo-active-display-none.html