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

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

Issue 210813003: Rename :ancestor to :host-context. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: Patch for landing Created 6 years, 9 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
Index: LayoutTests/fast/dom/shadow/ancestor-pseudo-class.html
diff --git a/LayoutTests/fast/dom/shadow/ancestor-pseudo-class.html b/LayoutTests/fast/dom/shadow/ancestor-pseudo-class.html
deleted file mode 100644
index 93d6e570c6b91123b8ad3f44f5caddfa8c7f25b2..0000000000000000000000000000000000000000
--- a/LayoutTests/fast/dom/shadow/ancestor-pseudo-class.html
+++ /dev/null
@@ -1,336 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-<script src="../../../resources/js-test.js"></script>
-<script src="resources/shadow-dom.js"></script>
-<style>
-:ancestor {
- background-color: red;
-}
-</style>
-</head>
-<body class='mytheme'>
- <div>
- <div id='sandbox'></div>
- </div>
- <pre id='console'></pre>
-<script>
-description('Test whether :ancestor matches a shadow host correctly.');
-
-var sandbox = document.getElementById('sandbox');
-
-function backgroundColorOf(selector) {
- return window.getComputedStyle(getNodeInTreeOfTrees(selector)).backgroundColor;
-}
-
-function backgroundColorShouldBe(selector, expected) {
- shouldBeEqualToString('backgroundColorOf(\'' + selector + '\')', expected);
-}
-
-function cleanUp() {
- sandbox.innerHTML = '';
-}
-
-debug(':ancestor out of shadow tree should not match any shadow hosts.');
-
-sandbox.appendChild(
- createDOM('div', {'id': 'host'},
- createShadowRoot(
- createDOM('div', {},
- document.createTextNode('Hello')))));
-
-backgroundColorShouldBe('host', 'rgba(0, 0, 0, 0)');
-
-cleanUp();
-
-debug(':ancestor with * should not match any shadow hosts.');
-
-sandbox.appendChild(
- createDOM('div', {'id': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode('*:ancestor { background-color: green; }')),
- createDOM('div', {},
- document.createTextNode('Hello')))));
-
-backgroundColorShouldBe('host', 'rgba(0, 0, 0, 0)');
-
-cleanUp();
-
-debug(':ancestor with tag selector should not match any shadow hosts.');
-
-sandbox.appendChild(
- createDOM('div', {'id': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode('div:ancestor { background-color: green; }')),
- createDOM('div', {},
- document.createTextNode('Hello')))));
-
-backgroundColorShouldBe('host', 'rgba(0, 0, 0, 0)');
-
-cleanUp();
-
-debug(':ancestor with class selector should not match any shadow hosts.');
-
-sandbox.appendChild(
- createDOM('div', {'id': 'host', 'class': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode('.host:ancestor { background-color: green; }')),
- createDOM('div', {},
- document.createTextNode('Hello')))));
-
-backgroundColorShouldBe('host', 'rgba(0, 0, 0, 0)');
-
-cleanUp();
-
-debug(':ancestor with id selector should not match any shadow hosts.');
-
-sandbox.appendChild(
- createDOM('div', {'id': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode('#host:ancestor { background-color: green; }')),
- createDOM('div', {},
- document.createTextNode('Hello')))));
-
-backgroundColorShouldBe('host', 'rgba(0, 0, 0, 0)');
-
-cleanUp();
-
-debug(':ancestor with attribute selector should not match any shadow hosts.');
-
-sandbox.appendChild(
- createDOM('div', {'id': 'host', 'foo': 'bar'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode('[foo=bar]:ancestor { background-color: green; }')),
- createDOM('div', {},
- document.createTextNode('Hello')))));
-
-backgroundColorShouldBe('host', 'rgba(0, 0, 0, 0)');
-
-cleanUp();
-
-debug(':ancestor in a shadow tree should match its shadow host.');
-
-sandbox.appendChild(
- createDOM('div', {'id': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode(':ancestor(body.mytheme) { background-color: green; }')),
- createDOM('div', {},
- document.createTextNode('Hello')))));
-
-backgroundColorShouldBe('host', 'rgb(0, 128, 0)');
-
-cleanUp();
-
-debug(':ancestor with :host in a shadow tree should match its shadow host.');
-
-sandbox.appendChild(
- createDOM('div', {'id': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode(':ancestor(div:host) { background-color: green; }')),
- createDOM('div', {},
- document.createTextNode('Hello')))));
-
-backgroundColorShouldBe('host', 'rgb(0, 128, 0)');
-
-cleanUp();
-
-debug(':ancestor 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(':ancestor(body:not(.mytheme), span, div#parentOfHost) { background-color: green; }')),
- createDOM('div', {},
- document.createTextNode('Hello'))))));
-
-backgroundColorShouldBe('host', 'rgb(0, 128, 0)');
-
-cleanUp();
-
-debug(':ancestor matches a shadow host in just a nested shadow tree, not all enclosing shadow trees.');
-
-sandbox.appendChild(
- createDOM('div', {'id': 'host1'},
- createShadowRoot(
- createDOM('div', {'id': 'host2'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode(':ancestor { background-color: green; }')),
- createDOM('div', {},
- document.createTextNode('Hello')))))));
-
-backgroundColorShouldBe('host1', 'rgba(0, 0, 0, 0)');
-backgroundColorShouldBe('host1/host2', 'rgb(0, 128, 0)');
-
-debug(':ancestor matches based on a composed tree.');
-
-sandbox.appendChild(
- createDOM('div', {'id': 'parentOfHost'},
- createShadowRoot(
- createDOM('span', {'id': 'spanA'},
- createDOM('content', {}))),
- createDOM('div', {'id': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode(':ancestor(span#spanA) > div { background-color: green; }')),
- createDOM('div', {'id': 'target'},
- document.createTextNode('Hello'))))));
-
-backgroundColorShouldBe('host/target', 'rgb(0, 128, 0)');
-
-cleanUp();
-
-debug(':ancestor 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(':ancestor(span#spanA) > #targetA { background-color: red; }')),
- createDOM('style', {},
- document.createTextNode(':ancestor(span#spanB) > #targetB { background-color: green; }')),
- createDOM('style', {},
- document.createTextNode(':ancestor(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(':ancestor 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(':ancestor(div#parentOfHost.sometheme) { background-color: green; }')),
- createDOM('div', {},
- document.createTextNode('Hello'))))));
-
-backgroundColorShouldBe('host', 'rgb(0, 128, 0)');
-document.getElementById('parentOfHost').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(':ancestor(div#parentOfHost.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)');
-
-cleanUp();
-
-debug('Compare :ancestor with :ancestor.');
-
-sandbox.appendChild(
- createDOM('div', {'id': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode(':ancestor(div:ancestor, div#sandbox) { background-color: green; }')),
- createDOM('style', {},
- document.createTextNode(':ancestor(body.mytheme) { background-color: red; }')),
- createDOM('div', {},
- document.createTextNode('Hello')))));
-
-// :ancestor(div:ancestor, div#sandbox) wins, because div#sandbox > body.mytheme.
-backgroundColorShouldBe('host', 'rgb(0, 128, 0)');
-
-cleanUp();
-
-sandbox.appendChild(
- createDOM('div', {'id': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode(':ancestor(div:ancestor, div#nomatch) { background-color: green; }')),
- createDOM('style', {},
- document.createTextNode(':ancestor(body.mytheme) { background-color: red; }')),
- createDOM('div', {},
- document.createTextNode('Hello')))));
-
-// :ancestor(body.mytheme) wins, because div:ancestor < body.mytheme.
-backgroundColorShouldBe('host', 'rgb(255, 0, 0)');
-
-cleanUp();
-
-// Test for specificiy of ":ancestor(...) > ...".
-sandbox.appendChild(
- createDOM('div', {'id': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode(':ancestor(div:ancestor, div#host:ancestor) > div { background-color: green; }')),
- createDOM('style', {},
- document.createTextNode(':ancestor(body.mytheme) > div { background-color: red; }')),
- createDOM('div', {'id': 'target'},
- document.createTextNode('Hello')))));
-
-backgroundColorShouldBe('host/target', 'rgb(0, 128, 0)');
-
-cleanUp();
-
-sandbox.appendChild(
- createDOM('div', {'id': 'host', 'class': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode(':ancestor(div:ancestor, div#host.host:ancestor) > div { background-color: green; }')),
- createDOM('style', {},
- document.createTextNode(':ancestor(body) > div#target { background-color: red; }')),
- createDOM('div', {'id': 'target'},
- document.createTextNode('Hello')))));
-
-backgroundColorShouldBe('host/target', 'rgb(0, 128, 0)');
-
-cleanUp();
-
-sandbox.appendChild(
- createDOM('div', {'id': 'host', 'class': 'host'},
- createShadowRoot(
- createDOM('style', {},
- document.createTextNode(':ancestor(div:ancestor(div:ancestor(div:ancestor(div:ancestor)))) > div { background-color: green; }')),
- createDOM('style', {},
- document.createTextNode(':ancestor(div) > div { background-color: red; }')),
- createDOM('div', {'id': 'target'},
- document.createTextNode('Hello')))));
-
-backgroundColorShouldBe('host/target', 'rgb(0, 128, 0)');
-
-cleanUp();
-
-</script>
-</body>

Powered by Google App Engine
This is Rietveld 408576698