<!DOCTYPE html>
<script src="../../resources/js-test.js"></script>
<style id="sheet">#removed { background-color: red; }</style>
<style>
@font-face {
font-family: dummy;
src: local(dummy);
}
.green {
font-family: sans-serif;
background-color: green;
}
</style>
<div id="removed" class="green">
This text should have a green background.
</div>
<div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
<script>
description("Remove a stylesheet not affecting layout.");
var red = "rgb(255, 0, 0)";
var green = "rgb(0, 128, 0)";
shouldBe("getComputedStyle(removed).backgroundColor", "red");
document.body.offsetTop; // force layout
sheet.parentNode.removeChild(sheet);
if (window.internals) {
var recalcCount = internals.updateStyleAndReturnAffectedElementCount();
var layoutCount = internals.needsLayoutCount();
shouldBe("recalcCount", "1");
shouldBe("layoutCount", "0");
}
shouldBe("getComputedStyle(removed).backgroundColor", "green");
</script>