LayoutTests/fast/dom/shadow/style-with-hat.html - Issue 210713002: Implement ::shadow pseudo element and replace /shadow/ with ::shadow.

Unified Diff: LayoutTests/fast/dom/shadow/style-with-hat.html

Issue 210713002: Implement ::shadow pseudo element and replace /shadow/ with ::shadow. (Closed) Base URL: svn://svn.chromium.org/blink/trunk

Patch Set: Fixed patch conflict 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

« no previous file with comments | « LayoutTests/fast/dom/shadow/style-and-shadow-element.html ('k') | LayoutTests/fast/dom/shadow/style-with-hat-expected.txt » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

Index: LayoutTests/fast/dom/shadow/style-with-hat.html

diff --git a/LayoutTests/fast/dom/shadow/style-with-hat.html b/LayoutTests/fast/dom/shadow/style-with-hat.html

index 2071cbdca7894be08f9db2859bdd9412b2bad436..929dd5c1a8c5d8551c94a355c90089c62e55a146 100644

--- a/LayoutTests/fast/dom/shadow/style-with-hat.html

+++ b/LayoutTests/fast/dom/shadow/style-with-hat.html

@@ -35,14 +35,56 @@ function cleanUp()

document.getElementById('sandbox').innerHTML = '';

}

-description('Test for /shadow/ combinator, http://crbug.com/309504.');

+description('Test for ::shadow, http://crbug.com/309504.');

var sandbox = document.getElementById('sandbox');

sandbox.appendChild(

createDOM('div', {},

createDOM('style', {},

- document.createTextNode('div /shadow/ span { border: 1px solid green; }')),

+ document.createTextNode('div::shadow > div { border: 1px solid green; }')),

+ createDOM('div', {'id': 'host'},

+ createShadowRoot(

+ createDOM('div', {'id': 'top-div'},

+ createDOM('div', {'id': 'not-top-div'}),

+ createDOM('span', {'id': 'not-top-span'})),

+ createDOM('span', {'id': 'top-span'})))));

+borderColorShouldBe('host/top-div', 'rgb(0, 128, 0)');

+borderColorShouldNotBe('host/top-span', 'rgb(0, 128, 0)');

+borderColorShouldNotBe('host/not-top-div', 'rgb(0, 128, 0)');

+borderColorShouldNotBe('host/not-top-span', 'rgb(0, 128, 0)');

+cleanUp();

+sandbox.appendChild(

+ createDOM('div', {},

+ createDOM('style', {},

+ document.createTextNode('::shadow ::shadow ::shadow span { border: 1px solid green; }')),

+ createDOM('div', {'id': 'host'},

+ createShadowRoot(

+ createDOM('span', {'id': 'span1'}),

+ createDOM('div', {'id': 'host1'},

+ createShadowRoot(

+ createDOM('span', {'id': 'span2'}),

+ createDOM('div', {'id': 'host2'},

+ createShadowRoot(

+ createDOM('span', {'id': 'span3'}),

+ createDOM('div', {'id': 'host3'},

+ createShadowRoot(

+ createDOM('span', {'id': 'span4'})))))))))));

+borderColorShouldNotBe('host/span1', 'rgb(0, 128, 0)');

+borderColorShouldNotBe('host/host1/span2', 'rgb(0, 128, 0)');

+borderColorShouldBe('host/host1/host2/span3', 'rgb(0, 128, 0)');

+borderColorShouldNotBe('host/host1/host2/host3/span4', 'rgb(0, 128, 0)');

+cleanUp();

+sandbox.appendChild(

+ createDOM('div', {},

+ createDOM('style', {},

+ document.createTextNode('div::shadow span { border: 1px solid green; }')),

createDOM('div', {'id': 'host'},

createShadowRoot(

createDOM('span', {'id': 'target'},

@@ -56,7 +98,7 @@ cleanUp();

sandbox.appendChild(

createDOM('div', {},

createDOM('style', {},

- document.createTextNode('div /shadow/ span { border: 1px solid green; }')),

+ document.createTextNode('div::shadow span { border: 1px solid green; }')),

createDOM('div', {'id': 'host'},

createShadowRoot(

createDOM('style', {},

@@ -71,7 +113,7 @@ cleanUp();

sandbox.appendChild(

createDOM('div', {},

createDOM('style', {},

- document.createTextNode('div /shadow/ span { border: 1px solid green; }')),

+ document.createTextNode('div::shadow span { border: 1px solid green; }')),

createDOM('div', {'id': 'host'},

createShadowRoot(

createDOM('style', {},

@@ -87,7 +129,7 @@ cleanUp();

sandbox.appendChild(

createDOM('div', {},

createDOM('style', {},

- document.createTextNode('div#sandbox > div > div /shadow/ span { border: 1px solid green; }')),

+ document.createTextNode('div#sandbox > div > div::shadow span { border: 1px solid green; }')),

createDOM('div', {'id': 'host'},

createShadowRoot(

createDOM('span', {'id': 'target'},

@@ -100,7 +142,7 @@ cleanUp();

sandbox.appendChild(

createDOM('div', {},

createDOM('style', {},

- document.createTextNode('div /shadow/ span { border: 1px solid green; }')),

+ document.createTextNode('div::shadow span { border: 1px solid green; }')),

createDOM('div', {'id': 'host'},

createShadowRoot(

createDOM('style', {},

@@ -116,7 +158,7 @@ cleanUp();

sandbox.appendChild(

createDOM('div', {},

createDOM('style', {},

- document.createTextNode('div /shadow/ span { border: 1px solid green; }')),

+ document.createTextNode('div::shadow span { border: 1px solid green; }')),

createDOM('div', {'id': 'host'},

createShadowRoot(

createDOM('style', {},

@@ -124,7 +166,7 @@ sandbox.appendChild(

createDOM('span', {'id': 'target'},

document.createTextNode('red border because of specificity.'))))));

-// Since :host's specificity is the same as *, div /shadow/ span wins.

+// Since :host's specificity is the same as *, div::shadow span wins.

borderColorShouldBe('host/target', 'rgb(0, 128, 0)');

cleanUp();

@@ -133,7 +175,7 @@ sandbox.appendChild(

createDOM('div', {'id': 'host'},

createShadowRoot(

createDOM('style', {},

- document.createTextNode(':host /shadow/ span { border: 1px solid green; }')),

+ document.createTextNode(':host::shadow span { border: 1px solid green; }')),

createDOM('span', {},

document.createTextNode('some text'))),

createShadowRoot(

@@ -145,12 +187,12 @@ borderColorShouldBe('host//target', 'rgb(0, 128, 0)');

cleanUp();

-// div /shadow/ span's div cannot match a shadow host whose shadow tree contains the style.

+// div::shadow span's div cannot match a shadow host whose shadow tree contains the style.

sandbox.appendChild(

createDOM('div', {'id': 'host'},

createShadowRoot(

createDOM('style', {},

- document.createTextNode('div /shadow/ span { border: 1px solid green; }')),

+ document.createTextNode('div::shadow span { border: 1px solid green; }')),

createDOM('span', {},

document.createTextNode('some text'))),

createShadowRoot(

@@ -163,12 +205,12 @@ borderColorShouldBe('host//target', 'rgb(0, 0, 0)');

cleanUp();

-// div /shadow/ span can match [div -- sr -- span] in its sibling shadow tree.

+// div::shadow span can match [div -- sr -- span] in its sibling shadow tree.

sandbox.appendChild(

createDOM('div', {'id': 'host'},

createShadowRoot(

createDOM('style', {},

- document.createTextNode('div /shadow/ span { border: 1px solid green; }')),

+ document.createTextNode('div::shadow span { border: 1px solid green; }')),

createDOM('span', {},

document.createTextNode('some text'))),

createShadowRoot(

@@ -182,12 +224,12 @@ borderColorShouldBe('host//host2/target', 'rgb(0, 128, 0)');

cleanUp();

-// :host div /shadow/ div should match.

+// :host div::shadow div should match.

sandbox.appendChild(

createDOM('div', {'id': 'host'},

createShadowRoot(

createDOM('style', {},

- document.createTextNode(':host div /shadow/ div { border: 1px solid green; }')),

+ document.createTextNode(':host div::shadow div { border: 1px solid green; }')),

createDOM('div', {'id': 'host2'},

createShadowRoot(

createDOM('div', {'id': 'target'},

@@ -202,7 +244,7 @@ sandbox.appendChild(

createDOM('div', {'id': 'host'},

createShadowRoot(

createDOM('style', {},

- document.createTextNode('div:host /shadow/ span { border: 1px solid green; }')),

+ document.createTextNode('div:host::shadow span { border: 1px solid green; }')),

createDOM('span', {'id': 'target'},

document.createTextNode('no border, because div:host matches nothing.')))));

@@ -210,13 +252,13 @@ borderColorShouldBe('host/target', 'rgb(0, 0, 0)');

cleanUp();

-// div (=shadow host) div /shadow/ div should not match.

+// div (=shadow host) div::shadow div should not match.

sandbox.appendChild(

createDOM('div', {'id': 'host'},

createShadowRoot(

createDOM('style', {},

- document.createTextNode('div > div /shadow/ div { border: 1px solid green; }')),

+ document.createTextNode('div > div::shadow div { border: 1px solid green; }')),

createDOM('div', {'id': 'host2'},

createShadowRoot(

createDOM('div', {'id': 'target'},

@@ -226,13 +268,13 @@ borderColorShouldBe('host/host2/target', 'rgb(0, 0, 0)');

cleanUp();

-// div + div /shadow/ div should match.

+// div + div::shadow div should match.

sandbox.appendChild(

createDOM('div', {'id': 'host'},

createShadowRoot(

createDOM('style', {},

- document.createTextNode('div + div /shadow/ div { border: 1px solid green; }')),

+ document.createTextNode('div + div::shadow div { border: 1px solid green; }')),

createDOM('div', {},

document.createTextNode('sibling')),

createDOM('div', {'id': 'host2'},

@@ -244,13 +286,13 @@ borderColorShouldBe('host/host2/target', 'rgb(0, 128, 0)');

cleanUp();

-// :host + div /shadow/ div should not match.

+// :host + div::shadow div should not match.

sandbox.appendChild(

createDOM('div', {'id': 'host'},

createShadowRoot(

createDOM('style', {},

- document.createTextNode(':host + div /shadow/ div { border: 1px solid green; }')),

+ document.createTextNode(':host + div::shadow div { border: 1px solid green; }')),

createDOM('div', {'id': 'siblingShadow'},

createShadowRoot(

createDOM('div', {},

@@ -264,12 +306,12 @@ borderColorShouldBe('host/host2/target', 'rgb(0, 0, 0)');

cleanUp();

-// div /shadow/ span in an older shadow tree cannot match any element in active shadow tree.

+// div::shadow span in an insert shadow tree cannot match any element in active shadow tree.

sandbox.appendChild(

createDOM('div', {'id': 'host'},

createShadowRoot(

createDOM('style', {},

- document.createTextNode('div /shadow/ span { border: 1px solid green; }')),

+ document.createTextNode('div::shadow span { border: 1px solid green; }')),

createDOM('span', {},

document.createTextNode('some text'))),

createShadowRoot(