<!DOCYTPE html>
<html>
<style>
input { background: red; }
input:focus { background: green; }
</style>
<body>
<p>The following text box should have focus and should be green.</p>
<input type="text" id="test" autofocus>
<div id="result">FAIL</div>
<script>
if (window.testRunner) {
    testRunner.dumpAsText();
    testRunner.waitUntilDone();
}

requestAnimationFrame(()=>{
    const actualValue = getComputedStyle(test, null).getPropertyValue('background-color');
    if (actualValue == "rgb(0, 128, 0)")
        result.innerHTML = "PASS";
    else
        result.innerHTML = 'FAIL - ' + actualValue;
    if (window.testRunner)
        testRunner.notifyDone();
});

</script>
</body>
</html>