<!DOCTYPE html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<style>#t1 { color: red }</style>
<div id="t1">Should be green.</div>
<script>
test(() => {
// Triggers synch active stylesheet update.
var sheet = document.styleSheets[0];
// Clears the previous RuleSet for rebuild.
sheet.insertRule("#dummy {}", 0);
// No Ruleset recreated since media does not match.
sheet.media.mediaText = "nomatch";
var newStyle = document.createElement("style");
newStyle.appendChild(document.createTextNode("div { color: green }"));
// New sheet triggers active stylesheet update and style recalc for #t1.
document.head.appendChild(newStyle);
}, "Check that appending a stylesheet while clearing the RuleSet of an existing sheet does not crash");
test(() => assert_equals(getComputedStyle(t1).color, "rgb(0, 128, 0)"),
"Check that the #t1 rule no longer applies.");
</script>