| Index: LayoutTests/fast/css/style-scoped/style-scoped-with-dom-operation.html
|
| diff --git a/LayoutTests/fast/css/style-scoped/style-scoped-with-dom-operation.html b/LayoutTests/fast/css/style-scoped/style-scoped-with-dom-operation.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..e053332971b38e0620bb38ae21b9950e7d711e52
|
| --- /dev/null
|
| +++ b/LayoutTests/fast/css/style-scoped/style-scoped-with-dom-operation.html
|
| @@ -0,0 +1,52 @@
|
| +<!doctype html>
|
| +<html>
|
| +<head>
|
| +<style>
|
| +span {
|
| + background-color: green;
|
| +}
|
| +</style>
|
| +<script src="../../../resources/js-test.js"></script>
|
| +</head>
|
| +<body>
|
| + <div>
|
| + <div>
|
| + <style id="existingStyle" scoped>
|
| + .target { background-color: red; }
|
| + </style>
|
| + <span id="target" class="target">Hello, World!</span>
|
| + </div>
|
| + </div>
|
| +</body>
|
| +<script>
|
| +description("Tests that <style scoped> is correctly applied after DOM operations, i.e. insertBefore, appendChild, and removeChild.");
|
| +
|
| +var target = document.getElementById('target');
|
| +
|
| +var existingStyle = document.getElementById('existingStyle');
|
| +var newStyle = document.createElement('style');
|
| +
|
| +newStyle.setAttribute('scoped', 'scoped');
|
| +newStyle.innerHTML = ".target { background-color: blue; }";
|
| +
|
| +debug("Insert a new scoped style before an existing scoped style.");
|
| +existingStyle.parentNode.insertBefore(newStyle, existingStyle);
|
| +shouldBe("window.getComputedStyle(target).backgroundColor", '"rgb(255, 0, 0)"');
|
| +
|
| +debug("Move an inserted scoped style after an existing scoped style.");
|
| +existingStyle.parentNode.appendChild(newStyle);
|
| +shouldBe("window.getComputedStyle(target).backgroundColor", '"rgb(0, 0, 255)"');
|
| +
|
| +debug("Move an inserted scoped style into grandparent of an existing scoped style.");
|
| +document.body.children[0].appendChild(newStyle);
|
| +shouldBe("window.getComputedStyle(target).backgroundColor", '"rgb(255, 0, 0)"');
|
| +
|
| +debug("Remove an inserted scoped style.");
|
| +newStyle.parentNode.removeChild(newStyle);
|
| +shouldBe("window.getComputedStyle(target).backgroundColor", '"rgb(255, 0, 0)"');
|
| +
|
| +debug("Remove an existing scoped style.");
|
| +existingStyle.parentNode.removeChild(existingStyle);
|
| +shouldBe("window.getComputedStyle(target).backgroundColor", '"rgb(0, 128, 0)"');
|
| +</script>
|
| +</html>
|
|
|