diff options
Diffstat (limited to 'testing/web-platform/tests/css/css-shadow-parts/part-mutation-pseudo.html')
-rw-r--r-- | testing/web-platform/tests/css/css-shadow-parts/part-mutation-pseudo.html | 27 |
1 files changed, 27 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-shadow-parts/part-mutation-pseudo.html b/testing/web-platform/tests/css/css-shadow-parts/part-mutation-pseudo.html new file mode 100644 index 0000000000..d0e0072d51 --- /dev/null +++ b/testing/web-platform/tests/css/css-shadow-parts/part-mutation-pseudo.html @@ -0,0 +1,27 @@ +<!doctype html> +<meta charset="utf-8"> +<title>CSS Shadow Parts - Invalidation Change Part Name on pseudo</title> +<link rel="help" href="https://drafts.csswg.org/css-shadow-parts/"> +<link rel="author" href="mailto:emilio@crisal.io" title="Emilio Cobos Álvarez"> +<link rel="author" href="https://mozilla.org" title="Mozilla"> +<script src="/resources/testharness.js"></script> +<script src="/resources/testharnessreport.js"></script> +<script src="support/shadow-helper.js"></script> +<style>#c-e::part(partp)::before { color: red; }</style> +<script>installCustomElement("custom-element", "custom-element-template");</script> +<template id="custom-element-template"> + <style>span::before { content: ""; color: green; }</style> + <span id="part" part="partp">This text</span> +</template> +The following text should be green: +<div><custom-element id="c-e"></custom-element></div> +<script> + "use strict"; + test(function() { + const part = getElementByShadowIds(document, ["c-e", "part"]); + const before = getComputedStyle(part, "::before").color; + part.setAttribute("part", "somethingelse"); + const after = getComputedStyle(part, "::before").color; + assert_not_equals(before, after); + }, "Part in selected host changed color"); +</script> |