-
Notifications
You must be signed in to change notification settings - Fork 2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Adds support for activeElement
to Polymer.dom
.
#2717
Conversation
5775b7d
to
209243f
Compare
209243f
to
8e6b7db
Compare
@sorvell ping |
@@ -593,6 +593,55 @@ | |||
|
|||
}; | |||
|
|||
Object.defineProperties(DomApi.prototype, { | |||
activeElement: { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Let's separate the implementations of Shadow/Shady. Should make this more understandable.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think this might be a little better now.
7dfc4d1
to
90e062d
Compare
@sorvell This is ready for review again. |
var ownerDocument = this.node.ownerDocument; | ||
|
||
// Shadow DOM | ||
if (Polymer.Settings.useShadow) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This section should be its own getter in the useShadow
section of this module.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Moved.
@sorvell ping again |
90e062d
to
dbdf066
Compare
So, since Polymer runs the tests on Chrome's native version of Shadow DOM, it looks like I didn't correctly interpret the retargeting algorithm for |
if (ownerDocument || !window.ShadowDOMPolyfill) { | ||
return this.node.activeElement; | ||
} else { | ||
return window.ShadowDOMPolyfill.wrapIfNeeded(this.node).activeElement; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This file has a wrap implementation so I think this can just be:
return DomApi.wrap(this.node).activeElement;
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fixed.
Updated with the expectation that the web components polyfill PR will make it in, tests will fail until then. |
activeElement: { | ||
configurable: true, | ||
get: function() { | ||
return wrap(this.node).activeElement; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Should be DomApi.wrap
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Do you mean Polymer.DomApi.wrap
? The DomApi
constructor defined in this file doesn't have a wrap
property - the object returned / assigned to Polymer.DomApi
does though. However, the other function calling wrap
calls it directly since it's defined in this scope. Thoughts?
Only 1 little nit left, otherwise LGTM after we get the webcomponents change merge. Thanks! |
b9e80a1
to
3518621
Compare
I had to add additional tests and make an update to the host-finding loop for this new case - might want to double check that. |
// active element is a descendant of its host; iterate upwards to | ||
// find the active element's most shallow host. | ||
var activeRoot = Polymer.dom(active).getOwnerRoot(); | ||
while (activeRoot && activeRoot !== this.node && !(this.node._isShadyRoot && this._contains(this.node.host, active))) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Here's the new change; is there a preferred way to format really long conditionals like this?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yeah, 80 character line limit + indenting.
31f55f6
to
cec7b5b
Compare
@sorvell ping for this one, needed by PolymerElements/iron-overlay-behavior#68 |
cec7b5b
to
e848af8
Compare
Depends on webcomponents/webcomponentsjs#475. |
get: function() { | ||
var node = Polymer.DomApi.wrap(this.node); | ||
var activeElement = node.activeElement; | ||
return node.contains(activeElement) ? activeElement : null; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Let's add a comment here that explains the contains
check. I believe this is so that we ignore distributed nodes. We should also link to the spec bug where the native behavior is changing.
…ative shadow tests; reorder test elements.
44d604c
to
47ee2ca
Compare
@sorvell: fixed stuff from your comments |
LGTM |
Adds support for `activeElement` to `Polymer.dom`.
For document and shadow root nodes, if the active element is a (possibly deep) descendant of the given node,
Polymer.dom(node).activeElement
will return the deepest element within the light tree of the node which is or deeply contains the active element. For all other nodes, the getter and setter will forward to theactiveElement
property on the node.