LayoutTests/fast/dom/shadow/css-focus-pseudo-match-shadow-host4.html - Issue 1177673005: Implement ShadowRoot.delegatesFocus 4/4 (match CSS :focus for shadow host)

Side by Side Diff: LayoutTests/fast/dom/shadow/css-focus-pseudo-match-shadow-host4.html

Issue 1177673005: Implement ShadowRoot.delegatesFocus 4/4 (match CSS :focus for shadow host) (Closed) Base URL: svn://svn.chromium.org/blink/trunk

Patch Set: fix for comments Created 5 years, 6 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 unified diff | Download patch | Annotate | Revision Log

« no previous file with comments | « LayoutTests/fast/dom/shadow/css-focus-pseudo-match-shadow-host3-expected.txt ('k') | LayoutTests/fast/dom/shadow/css-focus-pseudo-match-shadow-host4-expected.txt » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

OLD	NEW
(Empty)
	1 <!DOCTYPE html>

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

	3 <script src="resources/shadow-dom.js"></script>

	4 <style>

	5 div {

	6 background-color: white;

	7 }

	8

	9 div#shadow-host:focus {

	10 background-color: green;

	11 }

	12 </style>

	13 <body>

	14 <div id="sandbox"></div>

	15 </body>

	16 <script>

	17 function backgroundColorOf(selector) {

	18 return window.getComputedStyle(getNodeInTreeOfTrees(selector)).backgroundCol or;

	19 }

	20

	21 function backgroundColorShouldBe(selector, expected) {

	22 shouldBeEqualToString('backgroundColorOf(\'' + selector + '\')', expected);

	23 }

	24

	25 function testDistributedNodes() {

	26 debug('Testing shadow host :focus and distributed nodes');

	27

	28 // Setting up the DOM tree

	29 var sandbox = document.querySelector('#sandbox');

	30 sandbox.innerHTML = '';

	31 sandbox.appendChild(

	32 createDOM('div', {},

	33 createDOM('input', {'id': 'outer-input'}),

	34 createDOM('div', {'id': 'shadow-host', 'tabindex': '0'},

	35 createDOM('input', {'id': 'light-input'}),

	36 createShadowRoot(

	37 createDOM('content', {}),

	38 createDOM('div', {'id': 'inner-div'},

	39 document.createTextNode('Blink')),

	40 createDOM('input', {'id': 'older-input'})),

	41 createShadowRoot(

	42 {'delegatesFocus': true},

	43 createDOM('shadow', {}),

	44 createDOM('div', {'id': 'inner-div2'},

	45 document.createTextNode('Blink')),

	46 createDOM('input', {'id': 'younger-input'})))));

	47 sandbox.offsetTop;

	48

	49 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');

	50

	51 var host = getNodeInTreeOfTrees('shadow-host');

	52 var outerInput = getNodeInTreeOfTrees('outer-input');

	53 var lightInput = getNodeInTreeOfTrees('light-input');

	54 var olderInput = getNodeInTreeOfTrees('shadow-host/older-input');

	55 var youngerInput = getNodeInTreeOfTrees('shadow-host//younger-input');

	56

	57 debug('(1/3) shadow host without tabindex');

	58 outerInput.focus();

	59 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');

	60 lightInput.focus();

	61 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');

	62 olderInput.focus();

	63 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)');

	64 youngerInput.focus();

	65 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)');

	66 host.focus();

	67 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)');

	68

	69 debug('(2/3) shadow host with tabindex=-1');

	70 host.tabIndex = -1;

	71 outerInput.focus();

	72 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');

	73 lightInput.focus();

	74 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');

	75 olderInput.focus();

	76 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)');

	77 youngerInput.focus();

	78 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)');

	79 host.focus();

	80 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)');

	81

	82 debug('(3/3) shadow host with tabindex=0');

	83 host.tabIndex = 0;

	84 outerInput.focus();

	85 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');

	86 lightInput.focus();

	87 backgroundColorShouldBe('shadow-host', 'rgb(255, 255, 255)');

	88 olderInput.focus();

	89 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)');

	90 youngerInput.focus();

	91 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)');

	92 host.focus();

	93 backgroundColorShouldBe('shadow-host', 'rgb(0, 128, 0)');

	94 }

	95

	96 testDistributedNodes();

	97 </script>

OLD	NEW