jlengrand/webcomponentsjs
1
0
Fork 0
mirror of https://github.com/jlengrand/webcomponentsjs.git synced 2026-05-09 15:55:59 +00:00
Code Issues Packages Projects Releases Wiki Activity
Files
opera-presto-support
webcomponentsjs/tests/ShadowDOM/html/activeElement.html

430 lines
14 KiB
HTML
Raw Permalink Blame History

<!doctype html>
<!--
@license
Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<title>document.activeElement</title>
<meta charset="utf-8">
<script src="../../../src/ShadowDOM/ShadowDOM.js"></script>
<script src="../../../../web-component-tester/browser.js"></script>
<script>
suite('activeElement', function() {
var wrap = ShadowDOMPolyfill.wrap;
function inflateChildren(node) {
var nodesForInflation = node.querySelectorAll('[shadow-template-id]');
Array.prototype.slice.apply(nodesForInflation).forEach(inflate);
}
function inflate(node) {
node.tabIndex = -1;
var shadowTemplateId = node.getAttribute('shadow-template-id');
if (shadowTemplateId) {
var template = document.getElementById(shadowTemplateId);
var templateClone = document.importNode(template.content, true);
inflateChildren(templateClone);
node.createShadowRoot().appendChild(templateClone);
}
inflateChildren(node);
}
var doc;
var r;
// light
var r_l;
// shadow
var r_0;
// light
var r_0_l;
// shadow
var r_0_0;
// light
var r_0_0_l;
var r_0_1;
// light
var r_0_1_l;
var r_1;
// light
var r_1_l;
// shadow
var r_1_l_0;
var r_1_l_1;
// shadow
var r_1_0;
// light
var r_1_0_l;
var r_1_1;
// light
var r_1_1_l;
setup(function() {
doc = wrap(document);
r = document.createElement('div');
r.setAttribute('shadow-template-id', 'x-shadow-host-root');
r_l = document.createElement('div');
r_l.setAttribute('shadow-template-id', 'x-shadow-host-root-light');
r.appendChild(r_l);
inflate(r);
r_0 = r.shadowRoot.querySelector('[shadow-template-id=x-shadow-host-root-0]');
r_0_l = r_0.querySelector('[shadow-template-id=x-shadow-host-root-0-light]');
r_0_0 = r_0.shadowRoot.querySelector('[shadow-template-id=x-shadow-host-root-0-0]');
r_0_0_l = r_0_0.querySelector('[shadow-template-id=x-shadow-host-root-0-0-light]');
r_0_1 = r_0.shadowRoot.querySelector('[shadow-template-id=x-shadow-host-root-0-1]');
r_0_1_l = r_0_1.querySelector('[shadow-template-id=x-shadow-host-root-0-1-light]');
r_1 = r.shadowRoot.querySelector('[shadow-template-id=x-shadow-host-root-1]');
r_1_l = r_1.querySelector('[shadow-template-id=x-shadow-host-root-1-light]');
r_1_l_0 = r_1_l.shadowRoot.querySelector('[shadow-template-id=x-shadow-host-root-1-light-0]');
r_1_l_1 = r_1_l.shadowRoot.querySelector('[shadow-template-id=x-shadow-host-root-1-light-1]');
r_1_0 = r_1.shadowRoot.querySelector('[shadow-template-id=x-shadow-host-root-1-0]');
r_1_0_l = r_1_0.querySelector('[shadow-template-id=x-shadow-host-root-1-0-light]');
r_1_1 = r_1.shadowRoot.querySelector('[shadow-template-id=x-shadow-host-root-1-1]');
r_1_1_l = r_1_1.querySelector('[shadow-template-id=x-shadow-host-root-1-1-light]');
document.body.appendChild(r);
});
teardown(function() {
document.body.removeChild(r);
});
test('basic', function() {
var elt = document.createElement('div');
elt.tabIndex = -1;
document.body.appendChild(elt);
elt.focus();
assert.equal(doc.activeElement, elt);
document.body.removeChild(elt);
});
test('r.focus()', function() {
r.focus();
assert.equal(doc.activeElement, r);
assert.equal(r.shadowRoot.activeElement, null);
assert.equal(r_0.shadowRoot.activeElement, null);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, null);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
test('r_l.focus()', function() {
r_l.focus();
assert.equal(doc.activeElement, r_l);
assert.equal(r.shadowRoot.activeElement, null);
assert.equal(r_0.shadowRoot.activeElement, null);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, null);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
test('r_0.focus()', function() {
r_0.focus();
assert.equal(doc.activeElement, r);
assert.equal(r.shadowRoot.activeElement, r_0);
assert.equal(r_0.shadowRoot.activeElement, null);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, null);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
test('r_0_l.focus()', function() {
r_0_l.focus();
assert.equal(doc.activeElement, r);
assert.equal(r.shadowRoot.activeElement, r_0_l);
assert.equal(r_0.shadowRoot.activeElement, null);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, null);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
test('r_0_0.focus()', function() {
r_0_0.focus();
assert.equal(doc.activeElement, r);
assert.equal(r.shadowRoot.activeElement, r_0);
assert.equal(r_0.shadowRoot.activeElement, r_0_0);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, null);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
test('r_0_0_l.focus()', function() {
r_0_0_l.focus();
assert.equal(doc.activeElement, r);
assert.equal(r.shadowRoot.activeElement, r_0);
assert.equal(r_0.shadowRoot.activeElement, r_0_0_l);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, null);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
test('r_0_1.focus()', function() {
r_0_1.focus();
assert.equal(doc.activeElement, r);
assert.equal(r.shadowRoot.activeElement, r_0);
assert.equal(r_0.shadowRoot.activeElement, r_0_1);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, null);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
test('r_0_1_l.focus()', function() {
r_0_1_l.focus();
assert.equal(doc.activeElement, r);
assert.equal(r.shadowRoot.activeElement, r_0);
assert.equal(r_0.shadowRoot.activeElement, r_0_1_l);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, null);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
test('r_1.focus()', function() {
r_1.focus();
assert.equal(doc.activeElement, r);
assert.equal(r.shadowRoot.activeElement, r_1);
assert.equal(r_0.shadowRoot.activeElement, null);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, null);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
test('r_1_l.focus()', function() {
r_1_l.focus();
assert.equal(doc.activeElement, r);
assert.equal(r.shadowRoot.activeElement, r_1_l);
assert.equal(r_0.shadowRoot.activeElement, null);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, null);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
test('r_1_l_0.focus()', function() {
r_1_l_0.focus();
assert.equal(doc.activeElement, r);
assert.equal(r.shadowRoot.activeElement, r_1_l);
assert.equal(r_0.shadowRoot.activeElement, null);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, null);
assert.equal(r_1_l.shadowRoot.activeElement, r_1_l_0);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
test('r_1_l_1.focus()', function() {
r_1_l_1.focus();
assert.equal(doc.activeElement, r);
assert.equal(r.shadowRoot.activeElement, r_1_l);
assert.equal(r_0.shadowRoot.activeElement, null);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, null);
assert.equal(r_1_l.shadowRoot.activeElement, r_1_l_1);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
test('r_1_0.focus()', function() {
r_1_0.focus();
assert.equal(doc.activeElement, r);
assert.equal(r.shadowRoot.activeElement, r_1);
assert.equal(r_0.shadowRoot.activeElement, null);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, r_1_0);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
test('r_1_0_l.focus()', function() {
r_1_0_l.focus();
assert.equal(doc.activeElement, r);
assert.equal(r.shadowRoot.activeElement, r_1);
assert.equal(r_0.shadowRoot.activeElement, null);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, r_1_0_l);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
test('r_1_1.focus()', function() {
r_1_1.focus();
assert.equal(doc.activeElement, r);
assert.equal(r.shadowRoot.activeElement, r_1);
assert.equal(r_0.shadowRoot.activeElement, null);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, r_1_1);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
test('r_1_1_l.focus()', function() {
r_1_1_l.focus();
assert.equal(doc.activeElement, r);
assert.equal(r.shadowRoot.activeElement, r_1);
assert.equal(r_0.shadowRoot.activeElement, null);
assert.equal(r_0_0.shadowRoot.activeElement, null);
assert.equal(r_0_1.shadowRoot.activeElement, null);
assert.equal(r_1.shadowRoot.activeElement, r_1_1_l);
assert.equal(r_1_0.shadowRoot.activeElement, null);
assert.equal(r_1_1.shadowRoot.activeElement, null);
});
});
</script>
<template id="x-shadow-host-root">
<content></content>
<div>
<div>
<div shadow-template-id="x-shadow-host-root-0">
<div>
<div shadow-template-id="x-shadow-host-root-0-light"></div>
</div>
</div>
</div>
</div>
<div>
<div shadow-template-id="x-shadow-host-root-1">
<div>
<div shadow-template-id="x-shadow-host-root-1-light"></div>
</div>
</div>
</div>
</template>
<template id="x-shadow-host-root-light"></template>
<template id="x-shadow-host-root-0">
<content></content>
<div>
<div shadow-template-id="x-shadow-host-root-0-0">
<div>
<div>
<div shadow-template-id="x-shadow-host-root-0-0-light"></div>
</div>
</div>
</div>
</div>
<div shadow-template-id="x-shadow-host-root-0-1">
<div shadow-template-id="x-shadow-host-root-0-1-light"></div>
</div>
</template>
<template id="x-shadow-host-root-0-light"></template>
<template id="x-shadow-host-root-0-0">
<content></content>
</template>
<template id="x-shadow-host-root-0-0-light"></template>
<template id="x-shadow-host-root-0-1">
<content></content>
</template>
<template id="x-shadow-host-root-0-1-light"></template>
<template id="x-shadow-host-root-1">
<content></content>
<div>
<div shadow-template-id="x-shadow-host-root-1-0">
<div>
<div>
<div shadow-template-id="x-shadow-host-root-1-0-light"></div>
</div>
</div>
</div>
</div>
<div>
<div>
<div>
<div shadow-template-id="x-shadow-host-root-1-1">
<div>
<div shadow-template-id="x-shadow-host-root-1-1-light"></div>
</div>
</div>
</div>
</div>
</div>
</template>
<template id="x-shadow-host-root-1-light">
<content></content>
<div shadow-template-id="x-shadow-host-root-1-light-0"></div>
<div>
<div shadow-template-id="x-shadow-host-root-1-light-1"></div>
</div>
</template>
<template id="x-shadow-host-root-1-light-0"></template>
<template id="x-shadow-host-root-1-light-1"></template>
<template id="x-shadow-host-root-1-0">
<content></content>
</template>
<template id="x-shadow-host-root-1-0-light"></template>
<template id="x-shadow-host-root-1-1">
<content></content>
</template>
<template id="x-shadow-host-root-1-1-light"></template>
Reference in New Issue View Git Blame Copy Permalink