Skip to content

Commit cec7b5b

Browse files
bicknellrbicknellr
committed
DOM API implementation of activeElement.
1 parent 273ab0f commit cec7b5b

7 files changed

+589
-3
lines changed

‎bower.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
"url": "https://github.com/Polymer/polymer.git"
2121
},
2222
"dependencies": {
23-
"webcomponentsjs": "^0.7.18"
23+
"webcomponentsjs": "^0.7.20"
2424
},
2525
"devDependencies": {
2626
"web-component-tester": "*"

‎src/lib/dom-api-shadow.html

+8-1
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,13 @@
5757
});
5858

5959
Object.defineProperties(DomApi.prototype, {
60+
61+
activeElement: {
62+
get: function() {
63+
return Polymer.DomApi.wrap(this.node).activeElement;
64+
},
65+
configurable: true
66+
},
6067

6168
childNodes: {
6269
get: function() {
@@ -131,4 +138,4 @@
131138
'lastElementChild', 'nextElementSibling', 'previousElementSibling']);
132139

133140
})();
134-
</script>
141+
</script>

‎src/lib/dom-api-shady.html

+42-1
Original file line numberDiff line numberDiff line change
@@ -444,6 +444,47 @@
444444

445445
Object.defineProperties(DomApi.prototype, {
446446

447+
activeElement: {
448+
get: function() {
449+
var active = document.activeElement;
450+
if (!active) {
451+
return null;
452+
}
453+
var isShadyRoot = !!this.node._isShadyRoot;
454+
if (this.node !== document) {
455+
// If this node isn't a document or shady root, then it doesn't
456+
// have an active element.
457+
if (!isShadyRoot) {
458+
return null;
459+
}
460+
// If this shady root's host is the active element or the active
461+
// element is not a descendant of the host, then it doesn't have
462+
// an active element.
463+
if (this.node.host === active ||
464+
!this.node.host.contains(active)) {
465+
return null;
466+
}
467+
// If the active element is a light descendant of the shady root's
468+
// host, return the active element.
469+
if (this.node.host !== active &&
470+
this._contains(this.node.host, active)) {
471+
return active;
472+
}
473+
}
474+
// This node is either the document or a shady root of which the
475+
// active element is a descendant of its host; iterate upwards to
476+
// find the active element's most shallow host.
477+
var activeRoot = Polymer.dom(active).getOwnerRoot();
478+
while (activeRoot && activeRoot !== this.node &&
479+
!(isShadyRoot && this._contains(this.node.host, active))) {
480+
active = activeRoot.host;
481+
activeRoot = Polymer.dom(active).getOwnerRoot();
482+
}
483+
return active;
484+
},
485+
configurable: true
486+
},
487+
447488
childNodes: {
448489
get: function() {
449490
var c$ = TreeApi.Logical.getChildNodes(this.node);
@@ -591,4 +632,4 @@
591632
};
592633

593634
})();
594-
</script>
635+
</script>

‎test/unit/polymer-dom-elements.html

+242
Original file line numberDiff line numberDiff line change
@@ -357,3 +357,245 @@
357357
});
358358
</script>
359359
</dom-module>
360+
361+
362+
<dom-module id="x-shadow-host-root">
363+
<template>
364+
<content></content>
365+
<div>
366+
<div>
367+
<x-shadow-host-root-0>
368+
<x-shadow-host-root-0-light></x-shadow-host-root-0-light>
369+
</x-shadow-host-root-0>
370+
</div>
371+
</div>
372+
<div>
373+
<x-shadow-host-root-1>
374+
<x-shadow-host-root-1-light></x-shadow-host-root-1-light>
375+
</x-shadow-host-root-1>
376+
</div>
377+
</template>
378+
<script>
379+
Polymer({
380+
is: 'x-shadow-host-root',
381+
hostAttributes: {
382+
tabindex: '-1'
383+
}
384+
});
385+
</script>
386+
</dom-module>
387+
388+
<dom-module id="x-shadow-host-root-light">
389+
<script>
390+
Polymer({
391+
is: 'x-shadow-host-root-light',
392+
hostAttributes: {
393+
tabindex: '-1'
394+
}
395+
});
396+
</script>
397+
</dom-module>
398+
399+
<dom-module id="x-shadow-host-root-0">
400+
<template>
401+
<content></content>
402+
<div>
403+
<x-shadow-host-root-0-0>
404+
<x-shadow-host-root-0-0-light></x-shadow-host-root-0-0-light>
405+
</x-shadow-host-root-0-0>
406+
</div>
407+
<x-shadow-host-root-0-1>
408+
<x-shadow-host-root-0-1-light></x-shadow-host-root-0-1-light>
409+
</x-shadow-host-root-0-1>
410+
</template>
411+
<script>
412+
Polymer({
413+
is: 'x-shadow-host-root-0',
414+
hostAttributes: {
415+
tabindex: '-1'
416+
}
417+
});
418+
</script>
419+
</dom-module>
420+
421+
<dom-module id="x-shadow-host-root-0-light">
422+
<script>
423+
Polymer({
424+
is: 'x-shadow-host-root-0-light',
425+
hostAttributes: {
426+
tabindex: '-1'
427+
}
428+
});
429+
</script>
430+
</dom-module>
431+
432+
<dom-module id="x-shadow-host-root-0-0">
433+
<template>
434+
<content></content>
435+
</template>
436+
<script>
437+
Polymer({
438+
is: 'x-shadow-host-root-0-0',
439+
hostAttributes: {
440+
tabindex: '-1'
441+
}
442+
});
443+
</script>
444+
</dom-module>
445+
446+
<dom-module id="x-shadow-host-root-0-0-light">
447+
<template>
448+
<div>
449+
<div>
450+
<x-shadow-host-root-0-0-light-0></x-shadow-host-root-0-0-light-0>
451+
</div>
452+
</div>
453+
</template>
454+
<script>
455+
Polymer({
456+
is: 'x-shadow-host-root-0-0-light',
457+
hostAttributes: {
458+
tabindex: '-1'
459+
}
460+
});
461+
</script>
462+
</dom-module>
463+
464+
<dom-module id="x-shadow-host-root-0-0-light-0">
465+
<script>
466+
Polymer({
467+
is: 'x-shadow-host-root-0-0-light-0',
468+
hostAttributes: {
469+
tabindex: '-1'
470+
}
471+
});
472+
</script>
473+
</dom-module>
474+
475+
<dom-module id="x-shadow-host-root-0-1">
476+
<template>
477+
<content></content>
478+
</template>
479+
<script>
480+
Polymer({
481+
is: 'x-shadow-host-root-0-1',
482+
hostAttributes: {
483+
tabindex: '-1'
484+
}
485+
});
486+
</script>
487+
</dom-module>
488+
489+
<dom-module id="x-shadow-host-root-0-1-light">
490+
<script>
491+
Polymer({
492+
is: 'x-shadow-host-root-0-1-light',
493+
hostAttributes: {
494+
tabindex: '-1'
495+
}
496+
});
497+
</script>
498+
</dom-module>
499+
500+
<dom-module id="x-shadow-host-root-1">
501+
<template>
502+
<content></content>
503+
<div>
504+
<x-shadow-host-root-1-0>
505+
<x-shadow-host-root-1-0-light></x-shadow-host-root-1-0-light>
506+
</x-shadow-host-root-1-0>
507+
</div>
508+
<div>
509+
<div>
510+
<div>
511+
<x-shadow-host-root-1-1>
512+
<x-shadow-host-root-1-1-light></x-shadow-host-root-1-1-light>
513+
</x-shadow-host-root-1-1>
514+
</div>
515+
</div>
516+
</div>
517+
</template>
518+
<script>
519+
Polymer({
520+
is: 'x-shadow-host-root-1',
521+
hostAttributes: {
522+
tabindex: '-1'
523+
}
524+
});
525+
</script>
526+
</dom-module>
527+
528+
<dom-module id="x-shadow-host-root-1-light">
529+
<template>
530+
<x-shadow-host-root-1-light-0></x-shadow-host-root-1-light-0>
531+
</template>
532+
<script>
533+
Polymer({
534+
is: 'x-shadow-host-root-1-light',
535+
hostAttributes: {
536+
tabindex: '-1'
537+
}
538+
});
539+
</script>
540+
</dom-module>
541+
542+
<dom-module id="x-shadow-host-root-1-light-0">
543+
<script>
544+
Polymer({
545+
is: 'x-shadow-host-root-1-light-0',
546+
hostAttributes: {
547+
tabindex: '-1'
548+
}
549+
});
550+
</script>
551+
</dom-module>
552+
553+
<dom-module id="x-shadow-host-root-1-0">
554+
<template>
555+
<content></content>
556+
</template>
557+
<script>
558+
Polymer({
559+
is: 'x-shadow-host-root-1-0',
560+
hostAttributes: {
561+
tabindex: '-1'
562+
}
563+
});
564+
</script>
565+
</dom-module>
566+
567+
<dom-module id="x-shadow-host-root-1-0-light">
568+
<script>
569+
Polymer({
570+
is: 'x-shadow-host-root-1-0-light',
571+
hostAttributes: {
572+
tabindex: '-1'
573+
}
574+
});
575+
</script>
576+
</dom-module>
577+
578+
<dom-module id="x-shadow-host-root-1-1">
579+
<template>
580+
<content></content>
581+
</template>
582+
<script>
583+
Polymer({
584+
is: 'x-shadow-host-root-1-1',
585+
hostAttributes: {
586+
tabindex: '-1'
587+
}
588+
});
589+
</script>
590+
</dom-module>
591+
592+
<dom-module id="x-shadow-host-root-1-1-light">
593+
<script>
594+
Polymer({
595+
is: 'x-shadow-host-root-1-1-light',
596+
hostAttributes: {
597+
tabindex: '-1'
598+
}
599+
});
600+
</script>
601+
</dom-module>

‎test/unit/polymer-dom-shadow.html

+4
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,10 @@
5757

5858
<x-wrapped></x-wrapped>
5959

60+
<x-shadow-host-root>
61+
<x-shadow-host-root-light></x-shadow-host-root-light>
62+
</x-shadow-host-root>
63+
6064
<script src="polymer-dom.js"></script>
6165

6266
</body>

‎test/unit/polymer-dom.html

+4
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,10 @@
5757

5858
<x-wrapped></x-wrapped>
5959

60+
<x-shadow-host-root>
61+
<x-shadow-host-root-light></x-shadow-host-root-light>
62+
</x-shadow-host-root>
63+
6064
<script src="polymer-dom.js"></script>
6165

6266
</body>

0 commit comments

Comments
 (0)