67 lines
1.5 KiB
HTML
67 lines
1.5 KiB
HTML
<!DOCTYPE html>
|
|
<style>
|
|
.container {
|
|
border: 2px solid blue;
|
|
width: 100px;
|
|
height: 100px;
|
|
}
|
|
.contents {
|
|
display:contents;
|
|
}
|
|
#innercontainer {
|
|
display:content;
|
|
}
|
|
#test1:hover { color: green }
|
|
#test2:hover span { color: green }
|
|
#test3:active { color: green }
|
|
#test4:active span { color: green }
|
|
</style>
|
|
<div class=container>
|
|
<div id=test1 class=contents>
|
|
Text should turn green on hover.
|
|
</div>
|
|
</div>
|
|
<div class=container>
|
|
<div id=test2 class=contents>
|
|
<span>
|
|
Text should turn green on hover.
|
|
</spans>
|
|
</div>
|
|
</div>
|
|
<div class=container>
|
|
<div id=test3 class=contents>
|
|
Text should turn green on mouse down.
|
|
</div>
|
|
</div>
|
|
<div class=container>
|
|
<div id=test4 class=contents>
|
|
<span>
|
|
Text should turn green on mouse down.
|
|
</spans>
|
|
</div>
|
|
</div>
|
|
<div id=log></div>
|
|
|
|
<script>
|
|
function test(testId, activate) {
|
|
const testElement = document.getElementById(testId);
|
|
eventSender.mouseMoveTo(testElement.parentNode.offsetLeft + 5, testElement.parentNode.offsetTop + 5);
|
|
if (activate)
|
|
eventSender.mouseDown();
|
|
const verifyElement = testElement.firstElementChild ? testElement.firstElementChild : testElement;
|
|
const pass = getComputedStyle(verifyElement, null).color == 'rgb(0, 128, 0)';
|
|
log.innerHTML += `${testId} ${pass ? "PASS" : "FAIL"}<br>`;
|
|
if (activate)
|
|
eventSender.mouseUp();
|
|
}
|
|
|
|
if (window.testRunner) {
|
|
testRunner.dumpAsText();
|
|
test('test1');
|
|
test('test2');
|
|
test('test3', true);
|
|
test('test4', true);
|
|
}
|
|
</script>
|
|
|