third_party/WebKit/LayoutTests/shadow-dom/css-style-inherit.html - Issue 2266353004: Make Document::styleForElementIgnoringPendingStyleSheets() be aware of a flat tree structure

Unified Diff: third_party/WebKit/LayoutTests/shadow-dom/css-style-inherit.html

Issue 2266353004: Make Document::styleForElementIgnoringPendingStyleSheets() be aware of a flat tree structure (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master

Patch Set: update the tests Created 4 years, 4 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

View side-by-side diff with in-line comments

Download patch

« third_party/WebKit/LayoutTests/fast/alignment/parse-alignment-of-root-elements.html ('K') | « third_party/WebKit/LayoutTests/shadow-dom/crashes/slots-get-computed-style.html ('k') | third_party/WebKit/LayoutTests/shadow-dom/css-style-inherit-expected.txt » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

Index: third_party/WebKit/LayoutTests/shadow-dom/css-style-inherit.html

diff --git a/third_party/WebKit/LayoutTests/shadow-dom/css-style-inherit.html b/third_party/WebKit/LayoutTests/shadow-dom/css-style-inherit.html

index ec3fc1c4ee57e242d9cd8e8ef54916561af0b4a3..62f7721d3db62a9288e3b848ca7c455690a79095 100644

--- a/third_party/WebKit/LayoutTests/shadow-dom/css-style-inherit.html

+++ b/third_party/WebKit/LayoutTests/shadow-dom/css-style-inherit.html

@@ -1,16 +1,43 @@

<!DOCTYPE html>

-<script src="../resources/js-test.js"></script>

+<!DOCTYPE html>

+<script src='../resources/testharness.js'></script>

+<script src='../resources/testharnessreport.js'></script>

+<script src='resources/shadow-dom.js'></script>

+<style>

+ #host {

+ color: red;

+ }

+ </style>

- <div slot="s1">This text should be green</div>

+ <template data-mode="open">

+ <style>

+ div {

+ color: green;

+ }

+ div.p1 {

+ color: blue;

+ }

+ </style>

+ <div>

+ <slot name="s1"></slot>

+ </div>

+ </template>

+ <div slot="no-assign"><span id="span0"></span></div>

+ <div slot="s1"><span id="span1"></span></div>

</div>

- description("A changed inherited property on a slot parent should propagate down to slotted elements.");

+test(() => {

+ convertTemplatesToShadowRootsWithin(host);

+ assert_equals(getComputedStyle(span0).color, 'rgb(0, 0, 0)',

+ 'An element which is not assigned to any slot should not inherit a style from the parent.');

+ assert_equals(getComputedStyle(host.shadowRoot.querySelector('slot')).color, 'rgb(0, 0, 0)',

+ 'A slot should not inherit a style from the parent because Blink does not support "slots in the flat tree".');

- var root = host.attachShadow({mode:"open"});

- root.innerHTML = '<style>.p1 { color: green }</style><div id="p1"><slot name="s1"></slot></div>';

- var p1 = root.querySelector("#p1");

- var s1 = host.querySelector("[slot]");

- shouldBeEqualToString("getComputedStyle(s1).color", "rgb(0, 0, 0)");

- p1.className = "p1";

- shouldBeEqualToString("getComputedStyle(s1).color", "rgb(0, 128, 0)");

+ assert_equals(getComputedStyle(span1).color, 'rgb(0, 128, 0)',

+ 'An element which is assigned to a slot should inherit a style from the slot.');

+ host.shadowRoot.querySelector('div').className = 'p1';

+ assert_equals(getComputedStyle(span1).color, 'rgb(0, 0, 255)',

+ 'The style change should propagate down to a slotted element.');

+}, 'CSS inheritance tests for assigned nodes, not-assigned nodes, and slots');

</script>