Index: third_party/WebKit/LayoutTests/fast/dom/shadow/css-focus-pseudo-match-shadow-host5.html |
diff --git a/third_party/WebKit/LayoutTests/fast/dom/shadow/css-focus-pseudo-match-shadow-host5.html b/third_party/WebKit/LayoutTests/fast/dom/shadow/css-focus-pseudo-match-shadow-host5.html |
deleted file mode 100644 |
index 9eda0c00e13d00c91d76104b18ab6c6e7f8846a0..0000000000000000000000000000000000000000 |
--- a/third_party/WebKit/LayoutTests/fast/dom/shadow/css-focus-pseudo-match-shadow-host5.html |
+++ /dev/null |
@@ -1,145 +0,0 @@ |
-<!DOCTYPE html> |
-<script src="../../../resources/js-test.js"></script> |
-<script src="resources/shadow-dom.js"></script> |
-<style> |
-div { |
- background-color: white; |
-} |
- |
-div#shadow-host:focus { |
- background-color: green; |
-} |
-</style> |
-<body> |
-<div id="sandbox"></div> |
-</body> |
-<script> |
-function buildNestedDistributionTree(delegatesFocus1, delegatesFocus2) { |
- var sandbox = document.querySelector('#sandbox'); |
- sandbox.innerHTML = ''; |
- sandbox.appendChild( |
- createDOM('div', {}, |
- createDOM('input', {'id': 'outer-input'}), |
- createDOM('div', {'id': 'shadow-host'}, |
- createDOM('input', {'id': 'input1'}), |
- attachShadow( |
- {'mode': 'open', 'delegatesFocus': delegatesFocus1}, |
- createDOM('style', {}, |
- document.createTextNode('div { background-color: yellow; } div#inner-shadow-host:focus { background-color: blue; }')), |
- createDOM('input', {'id': 'input2'}), |
- createDOM('div', {'id': 'inner-shadow-host'}, |
- createDOM('slot', {}), // #input1 goes here |
- attachShadow( |
- {'mode': 'open', 'delegatesFocus': delegatesFocus2}, |
- createDOM('slot', {}), // #input1 redistributed here, #input2 goes here. |
- createDOM('input', {'id': 'input3'}))))))); |
- |
- sandbox.offsetTop; |
-} |
- |
-function testNestedDistribution() { |
- debug('testing nested distribution'); |
- |
- buildNestedDistributionTree(false, false); |
- |
- backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); |
- |
- var outerInput = getNodeInComposedTree('outer-input'); |
- var input1 = getNodeInComposedTree('input1'); |
- var input2 = getNodeInComposedTree('shadow-host/input2'); |
- var input3 = getNodeInComposedTree('shadow-host/inner-shadow-host/input3'); |
- |
- debug('#input1, #input2 are (re)distributed in the same treescope as #input3, but :focus on shadow host only matches when a focused element is under its shadow tree.'); |
- |
- debug('(1/4) top and inner shadow do not delegate focus.'); |
- outerInput.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)'); |
- |
- input1.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)'); |
- |
- input2.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)'); |
- |
- input3.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)'); |
- |
- debug('(2/4) top shadow delegates, but inner shadow does not.'); |
- buildNestedDistributionTree(true, false); |
- |
- var outerInput = getNodeInComposedTree('outer-input'); |
- var input1 = getNodeInComposedTree('input1'); |
- var input2 = getNodeInComposedTree('shadow-host/input2'); |
- var input3 = getNodeInComposedTree('shadow-host/inner-shadow-host/input3'); |
- |
- outerInput.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)'); |
- |
- input1.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)'); |
- |
- input2.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)'); |
- |
- input3.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)'); |
- |
- debug('(3/4) top shadow does not delegate, but inner shadow does.'); |
- buildNestedDistributionTree(false, true); |
- |
- var outerInput = getNodeInComposedTree('outer-input'); |
- var input1 = getNodeInComposedTree('input1'); |
- var input2 = getNodeInComposedTree('shadow-host/input2'); |
- var input3 = getNodeInComposedTree('shadow-host/inner-shadow-host/input3'); |
- |
- outerInput.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)'); |
- |
- input1.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)'); |
- |
- input2.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)'); |
- |
- input3.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(0, 0, 255)'); |
- |
- debug('(4/4) both shadow hosts delagate focus.'); |
- buildNestedDistributionTree(true, true); |
- |
- var outerInput = getNodeInComposedTree('outer-input'); |
- var input1 = getNodeInComposedTree('input1'); |
- var input2 = getNodeInComposedTree('shadow-host/input2'); |
- var input3 = getNodeInComposedTree('shadow-host/inner-shadow-host/input3'); |
- |
- outerInput.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)'); |
- |
- input1.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)'); |
- |
- input2.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(255, 255, 0)'); |
- |
- input3.focus(); |
- backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)'); |
- backgroundColorShouldBe('shadow-host/inner-shadow-host', 'rgb(0, 0, 255)'); |
-} |
- |
-testNestedDistribution(); |
-</script> |