<style>
    #target[foo] { color: green; }
</style>
<div id="container">
    <div>
        <img src="x-invalid:" alt="Some wide text">
        <div id="target">
            This should be green, with a wide broken image above.
        </div>
    </div>
</div>
<div id="result"></div>
<script>
    onload = function() {
        if (window.testRunner)
            testRunner.dumpAsText();

        document.body.offsetTop;
        var container = document.getElementById("container");
        container.style.display = "none";
        document.body.offsetTop;
        container.style.removeProperty("display");
        document.body.offsetTop;
        var target = document.getElementById("target");
        target.setAttribute("foo", "");
        document.body.offsetTop;
        var result = document.getElementById("result");
        result.innerText = getComputedStyle(target).color === "rgb(0, 128, 0)" ? "PASS" : "FAIL";
    }
</script>