| Index: third_party/WebKit/LayoutTests/shadow-dom/slotted-pseudo-element-fallback-content-in-document.html
|
| diff --git a/third_party/WebKit/LayoutTests/shadow-dom/slotted-pseudo-element-fallback-content-in-document.html b/third_party/WebKit/LayoutTests/shadow-dom/slotted-pseudo-element-fallback-content-in-document.html
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..284bcd2c810bf07e9d8f3201baf54f16f4063074
|
| --- /dev/null
|
| +++ b/third_party/WebKit/LayoutTests/shadow-dom/slotted-pseudo-element-fallback-content-in-document.html
|
| @@ -0,0 +1,28 @@
|
| +<!DOCTYPE html>
|
| +<script src="../resources/testharness.js"></script>
|
| +<script src="../resources/testharnessreport.js"></script>
|
| +<script src="resources/shadow-dom.js"></script>
|
| +
|
| +<style>
|
| +::slotted(.red) { color: red; }
|
| +div { color: green; }
|
| +</style>
|
| +
|
| +<slot>
|
| + <div id="red" class="red">Red Fallback Content</div>
|
| + <div id="green">Other Fallback Content</div>
|
| +</slot>
|
| +
|
| +<script>
|
| +'use strict';
|
| +
|
| +test(() => {
|
| + const redDiv = document.querySelector('#red');
|
| + const otherDiv = document.querySelector('#green');
|
| +
|
| + assert_equals(window.getComputedStyle(redDiv).color, 'rgb(255, 0, 0)',
|
| + '::slotted() applies to fallback content.');
|
| + assert_equals(window.getComputedStyle(otherDiv).color, 'rgb(0, 128, 0)',
|
| + 'non-::slotted() selector should match fallback content.');
|
| +}, '::slotted() should apply to fallback content in document tree.');
|
| +</script>
|
|
|
Chromium Code Reviews
Issue 2789363002:
Styling slot fallback content with ::slotted()
