Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(70)

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: LayoutTests/fast/dom/shadow/host-pseudo-class.html

Issue 138023007: Renamed :host to :ancestor and made :host to match only shadow host. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Created 6 years, 11 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
« LayoutTests/fast/dom/shadow/ancestor-pseudo-class-expected.txt ('K') | « LayoutTests/fast/dom/shadow/ancestor-pseudo-class-expected.txt ('k') | LayoutTests/fast/dom/shadow/host-pseudo-class-expected.txt » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: LayoutTests/fast/dom/shadow/host-pseudo-class.html
diff --git a/LayoutTests/fast/dom/shadow/host-pseudo-class.html b/LayoutTests/fast/dom/shadow/host-pseudo-class.html
index 9e85306b28d49531dcf98e2666bfcf2e21aa9def..7d87996c273e473648c40b59e66f65616a611346 100644
--- a/LayoutTests/fast/dom/shadow/host-pseudo-class.html
+++ b/LayoutTests/fast/dom/shadow/host-pseudo-class.html
@@ -116,10 +116,24 @@ cleanUp();
debug(':host in a shadow tree should match its shadow host.');
sandbox.appendChild(
- createDOM('div', {'id': 'host'},
+ createDOM('div', {'id': 'host', 'class': 'foobar'},
+ createShadowRoot(
+ createDOM('style', {},
+ document.createTextNode(':host(div.foobar) { background-color: green; }')),
+ createDOM('div', {},
+ document.createTextNode('Hello')))));
+
+backgroundColorShouldBe('host', 'rgb(0, 128, 0)');
+
+cleanUp();
+
+debug(':host with :ancestor in a shadow tree should match its shadow host.');
+
+sandbox.appendChild(
+ createDOM('div', {'id': 'host', 'class': 'foobar'},
createShadowRoot(
createDOM('style', {},
- document.createTextNode(':host(body.mytheme) { background-color: green; }')),
+ document.createTextNode(':host(:ancestor(body.mytheme)) { background-color: green; }')),
createDOM('div', {},
document.createTextNode('Hello')))));
@@ -130,13 +144,12 @@ cleanUp();
debug(':host takes simple selectors and matches when one of the simple selectors matches.');
sandbox.appendChild(
- createDOM('div', {'id': 'parentOfHost'},
- createDOM('div', {'id': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode(':host(body:not(.mytheme), span, div#parentOfHost) { background-color: green; }')),
- createDOM('div', {},
- document.createTextNode('Hello'))))));
+ createDOM('div', {'id': 'host'},
+ createShadowRoot(
+ createDOM('style', {},
+ document.createTextNode(':host(body:not(.mytheme), span, div#host) { background-color: green; }')),
+ createDOM('div', {},
+ document.createTextNode('Hello')))));
backgroundColorShouldBe('host', 'rgb(0, 128, 0)');
@@ -157,89 +170,34 @@ sandbox.appendChild(
backgroundColorShouldBe('host1', 'rgba(0, 0, 0, 0)');
backgroundColorShouldBe('host1/host2', 'rgb(0, 128, 0)');
-debug(':host matches based on a composed tree.');
+debug(':host is updated when its matched host changes className or id.');
sandbox.appendChild(
- createDOM('div', {'id': 'parentOfHost'},
+ createDOM('div', {'id': 'host', 'class': 'sometheme' },
createShadowRoot(
- createDOM('span', {'id': 'spanA'},
- createDOM('content', {}))),
- createDOM('div', {'id': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode(':host(span#spanA) > div { background-color: green; }')),
- createDOM('div', {'id': 'target'},
- document.createTextNode('Hello'))))));
-
-backgroundColorShouldBe('host/target', 'rgb(0, 128, 0)');
-
-cleanUp();
-
-debug(':host matches based on a composed tree when having multiple shadow roots.');
-
-sandbox.appendChild(
- createDOM('div', {'id': 'parentOfHost'},
- createShadowRoot(
- createDOM('span', {'id': 'spanA'},
- document.createTextNode('no content, no shadow'))),
- createShadowRoot(
- createDOM('span', {'id': 'spanB'},
- createDOM('content', {}))),
- createShadowRoot(
- createDOM('span', {'id': 'spanC'},
- createDOM('shadow', {},
- createDOM('content')))),
- createDOM('div', {'id': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode(':host(span#spanA) > #targetA { background-color: red; }')),
- createDOM('style', {},
- document.createTextNode(':host(span#spanB) > #targetB { background-color: green; }')),
- createDOM('style', {},
- document.createTextNode(':host(span#spanC) > #targetC { background-color: green; }')),
- createDOM('div', {'id': 'targetA'},
- document.createTextNode('Hello')),
- createDOM('div', {'id': 'targetB'},
- document.createTextNode('Hello')),
- createDOM('div', {'id': 'targetC'},
- document.createTextNode('Hello'))))));
-
-backgroundColorShouldBe('host/targetA', 'rgba(0, 0, 0, 0)');
-backgroundColorShouldBe('host/targetB', 'rgb(0, 128, 0)');
-backgroundColorShouldBe('host/targetC', 'rgb(0, 128, 0)');
-
-cleanUp();
-
-debug(':host is updated when its matched ancestor changes className or id.');
-
-sandbox.appendChild(
- createDOM('div', {'id': 'parentOfHost', 'class': 'sometheme' },
- createDOM('div', {'id': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode(':host(div#parentOfHost.sometheme) { background-color: green; }')),
- createDOM('div', {},
- document.createTextNode('Hello'))))));
+ createDOM('style', {},
+ document.createTextNode(':host(.sometheme) { background-color: green; }')),
+ createDOM('div', {},
+ document.createTextNode('Hello')))));
backgroundColorShouldBe('host', 'rgb(0, 128, 0)');
-document.getElementById('parentOfHost').className = 'mytheme';
+document.getElementById('host').className = 'mytheme';
backgroundColorShouldBe('host', 'rgba(0, 0, 0, 0)');
cleanUp();
sandbox.appendChild(
- createDOM('div', {'id': 'parentOfHost', 'class': 'sometheme' },
- createDOM('div', {'id': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode(':host(div#parentOfHost.sometheme) { background-color: green; }')),
- createDOM('div', {},
- document.createTextNode('Hello'))))));
+ createDOM('div', {'id': 'host', 'class': 'sometheme'},
+ createShadowRoot(
+ createDOM('style', {},
+ document.createTextNode(':host(div#host.sometheme) { background-color: green; }')),
+ createDOM('div', {},
+ document.createTextNode('Hello')))));
backgroundColorShouldBe('host', 'rgb(0, 128, 0)');
-var parentOfHost = document.getElementById('parentOfHost');
-parentOfHost.id = 'differntIdValue';
-backgroundColorShouldBe('host', 'rgba(0, 0, 0, 0)');
+var host = document.getElementById('host');
+host.id = 'host2';
+backgroundColorShouldBe('host2', 'rgba(0, 0, 0, 0)');
cleanUp();
@@ -261,28 +219,28 @@ backgroundColorShouldBe('host', 'rgb(0, 128, 0)');
cleanUp();
sandbox.appendChild(
- createDOM('div', {'id': 'host'},
+ createDOM('div', {'id': 'host', 'class': 'foobar' },
createShadowRoot(
createDOM('style', {},
document.createTextNode(':host(div:host, div#nomatch) { background-color: green; }')),
createDOM('style', {},
- document.createTextNode(':host(body.mytheme) { background-color: red; }')),
+ document.createTextNode(':host(div.foobar) { background-color: red; }')),
createDOM('div', {},
document.createTextNode('Hello')))));
-// :host(body.mytheme) wins, because div:host < body.mytheme.
+// :host(div.foobar) wins, because div:host < div.foobar.
backgroundColorShouldBe('host', 'rgb(255, 0, 0)');
cleanUp();
// Test for specificiy of ":host(...) > ...".
sandbox.appendChild(
- createDOM('div', {'id': 'host'},
+ createDOM('div', {'id': 'host', 'class': 'foobar' },
createShadowRoot(
createDOM('style', {},
document.createTextNode(':host(div:host, div#host:host) > div { background-color: green; }')),
createDOM('style', {},
- document.createTextNode(':host(body.mytheme) > div { background-color: red; }')),
+ document.createTextNode(':host(div.foobar) > div { background-color: red; }')),
createDOM('div', {'id': 'target'},
document.createTextNode('Hello')))));
@@ -296,7 +254,7 @@ sandbox.appendChild(
createDOM('style', {},
document.createTextNode(':host(div:host, div#host.host:host) > div { background-color: green; }')),
createDOM('style', {},
- document.createTextNode(':host(body) > div#target { background-color: red; }')),
+ document.createTextNode(':host(div) > div#target { background-color: red; }')),
createDOM('div', {'id': 'target'},
document.createTextNode('Hello')))));
« LayoutTests/fast/dom/shadow/ancestor-pseudo-class-expected.txt ('K') | « LayoutTests/fast/dom/shadow/ancestor-pseudo-class-expected.txt ('k') | LayoutTests/fast/dom/shadow/host-pseudo-class-expected.txt » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698