Skip to content

Commit 372b667

Browse files
committed
Make sure event.composedPath is consistent
Fixes #29
1 parent 426944c commit 372b667

File tree

3 files changed

+75
-86
lines changed

3 files changed

+75
-86
lines changed

src/compat/base.html

+12-23
Original file line numberDiff line numberDiff line change
@@ -178,10 +178,18 @@
178178
}
179179

180180
initialize() {
181-
var self = this;
182-
Polymer.AsyncRender.afterRender(function() {
183-
self.initializeSelf();
184-
});
181+
if (this.__meta.listeners) {
182+
var l$ = this.__meta.listeners;
183+
for (var i=0, l; (i<l$.length) && (l=l$[i]); i++) {
184+
events.addMethodListener(this, l.event, l.method);
185+
}
186+
}
187+
if (this.__meta.hostAttributes) {
188+
var a$ = this.__meta.hostAttributes;
189+
for (var a in a$) {
190+
attributes.ensureAttribute(this, a, a$[a]);
191+
}
192+
}
185193
if (!this.root) {
186194
if (this._template) {
187195
// BREAKME(sorvell): remove v0 support when we can...
@@ -201,25 +209,6 @@
201209
behaviors.callMethod(this, 'ready');
202210
}
203211

204-
initializeSelf() {
205-
if (this.__initializedSelf) {
206-
return;
207-
}
208-
this.__initializedSelf = true;
209-
if (this.__meta.listeners) {
210-
var l$ = this.__meta.listeners;
211-
for (var i=0, l; (i<l$.length) && (l=l$[i]); i++) {
212-
events.addMethodListener(this, l.event, l.method);
213-
}
214-
}
215-
if (this.__meta.hostAttributes) {
216-
var a$ = this.__meta.hostAttributes;
217-
for (var a in a$) {
218-
attributes.ensureAttribute(this, a, a$[a]);
219-
}
220-
}
221-
}
222-
223212
// reserved for canonical behavior
224213
disconnectedCallback() {
225214
this.detachedCallback();

src/shady/element-mixin.html

+45-47
Original file line numberDiff line numberDiff line change
@@ -159,7 +159,7 @@
159159
// and forces distribution.
160160
var insertionPointTag = ownerRoot && ownerRoot.getInsertionPointTag() || '';
161161
var fragContent = (node.nodeType === Node.DOCUMENT_FRAGMENT_NODE) &&
162-
!node.__noContent &&
162+
!node.__noContent &&
163163
insertionPointTag && node.querySelector(insertionPointTag);
164164
var wrappedContent = fragContent &&
165165
(Tree.Logical.getParentNode(fragContent).nodeType !==
@@ -278,7 +278,7 @@
278278
firstComposedNode: function(insertionPoint) {
279279
var n$ = insertionPoint.getDistributedNodes();
280280
var root = this.ownerRootForNode(insertionPoint);
281-
for (var i=0, l=n$.length, n, p$; (i<l) && (n=n$[i]); i++) {
281+
for (var i=0, l=n$.length, n; (i<l) && (n=n$[i]); i++) {
282282
// means that we're composed to this spot.
283283
if (root.isFinalDestination(insertionPoint, n)) {
284284
return n;
@@ -317,17 +317,17 @@
317317

318318
// NOTE: `query` is used primarily for ShadyDOM's querySelector impl,
319319
// but it's also generally useful to recurse through the element tree
320-
// and is used by Polymer's styling system.
320+
// and is used by Polymer's styling system.
321321
query: function(node, matcher, halter) {
322322
var list = [];
323-
this._queryElements(Tree.Logical.getChildNodes(node), matcher,
323+
this._queryElements(Tree.Logical.getChildNodes(node), matcher,
324324
halter, list);
325325
return list;
326326
},
327327

328328
_queryElements: function(elements, matcher, halter, list) {
329329
for (var i=0, l=elements.length, c; (i<l) && (c=elements[i]); i++) {
330-
if (c.nodeType === Node.ELEMENT_NODE &&
330+
if (c.nodeType === Node.ELEMENT_NODE &&
331331
this._queryElement(c, matcher, halter, list)) {
332332
return true;
333333
}
@@ -342,7 +342,7 @@
342342
if (halter && halter(result)) {
343343
return result;
344344
}
345-
this._queryElements(Tree.Logical.getChildNodes(node), matcher,
345+
this._queryElements(Tree.Logical.getChildNodes(node), matcher,
346346
halter, list);
347347
},
348348

@@ -394,7 +394,7 @@
394394
};
395395

396396
Object.defineProperties(NodeMixin, {
397-
397+
398398
isConnected: {
399399
get() {
400400
return document.contains(this);
@@ -485,7 +485,7 @@
485485
}
486486
}
487487
// if adding to a shadyRoot, add to host instead
488-
var container = ShadyDom.isShadyRoot(this) ?
488+
var container = ShadyDom.isShadyRoot(this) ?
489489
this.host : this;
490490
if (ref_node) {
491491
Tree.Composed.insertBefore(container, node, ref_node);
@@ -510,7 +510,7 @@
510510
if (!mixinImpl.removeNode(node)) {
511511
// if removing from a shadyRoot, remove form host instead
512512
var container = ShadyDom.isShadyRoot(this) ?
513-
this.host :
513+
this.host :
514514
this;
515515
// not guaranteed to physically be in container; e.g.
516516
// undistributed nodes.
@@ -573,37 +573,7 @@
573573
}
574574
}
575575
return n;
576-
},
577-
578-
// TODO(sorvell): removeEventListener + weakmap...
579-
addEventListener: function(type, fn, capture) {
580-
if (!this.__eventListenerCount) {
581-
this.__eventListenerCount = 0;
582-
}
583-
this.__eventListenerCount++;
584-
var wrappedFn = function(e) {
585-
if (!e.__target) {
586-
e.__target = e.target;
587-
var proto = ShadyDom.patchImpl.prototypeForObject(e);
588-
if (proto) {
589-
e.__proto__ = proto;
590-
}
591-
}
592-
return fn(e);
593-
}
594-
fn.__eventWrapper = wrappedFn;
595-
return origAddEventListener.call(this, type, wrappedFn, capture);
596-
},
597-
598-
removeEventListener: function(type, fn, capture) {
599-
var wrapper = fn.__eventWrapper;
600-
origRemoveEventListener.call(this, type, wrapper || fn, capture);
601-
if (wrapper) {
602-
fn.__eventWrapper = null;
603-
this.__eventListenerCount--;
604-
}
605576
}
606-
607577
};
608578

609579
Object.defineProperties(FragmentMixin, {
@@ -731,15 +701,15 @@
731701
nativeRemoveAttribute.call(this, name);
732702
if (!mixinImpl.maybeDistributeParent(this)) {
733703
mixinImpl.maybeDistributeAttributeChange(this, name);
734-
};
704+
}
735705
}
736706

737707
};
738708

739709
Object.defineProperties(ElementMixin, {
740710

741711
shadowRoot: {
742-
get() {
712+
get() {
743713
return this.shadyRoot;
744714
}
745715
},
@@ -772,7 +742,7 @@
772742
});
773743

774744
var EventMixin = {
775-
745+
776746
__patched: 'Event',
777747

778748
composedPath() {
@@ -802,7 +772,7 @@
802772
},
803773

804774
get target() {
805-
// If ANCESTOR's root is not a shadow root or ANCESTOR's root is BASE's
775+
// If ANCESTOR's root is not a shadow root or ANCESTOR's root is BASE's
806776
// shadow-including inclusive ancestor, return ANCESTOR.
807777
var base = this.currentTarget;
808778
var baseRoot = base && ShadyDom.ownerRootForNode(base);
@@ -818,18 +788,46 @@
818788

819789
};
820790

791+
ShadyDom.addEventListener = function(type, fn, capture) {
792+
if (!this.__eventListenerCount) {
793+
this.__eventListenerCount = 0;
794+
}
795+
this.__eventListenerCount++;
796+
var wrappedFn = function(e) {
797+
if (!e.__target) {
798+
e.__target = e.target;
799+
var proto = ShadyDom.patchImpl.prototypeForObject(e);
800+
if (proto) {
801+
e.__proto__ = proto;
802+
}
803+
}
804+
return fn(e);
805+
}
806+
fn.__eventWrapper = wrappedFn;
807+
return origAddEventListener.call(this, type, wrappedFn, capture);
808+
};
809+
810+
ShadyDom.removeEventListener = function(type, fn, capture) {
811+
var wrapper = fn.__eventWrapper;
812+
origRemoveEventListener.call(this, type, wrapper || fn, capture);
813+
if (wrapper) {
814+
fn.__eventWrapper = null;
815+
this.__eventListenerCount--;
816+
}
817+
};
818+
821819
ShadyDom.Mixins = {
822-
820+
823821
Node: ShadyDom.extendAll({__patched: 'Node'}, NodeMixin),
824822

825-
Fragment: ShadyDom.extendAll({__patched: 'Fragment'},
823+
Fragment: ShadyDom.extendAll({__patched: 'Fragment'},
826824
NodeMixin, FragmentMixin, ActiveElementMixin),
827825

828-
Element: ShadyDom.extendAll({__patched: 'Element'},
826+
Element: ShadyDom.extendAll({__patched: 'Element'},
829827
NodeMixin, FragmentMixin, ElementMixin, ActiveElementMixin),
830828

831829
// Note: activeElement cannot be patched on document!
832-
Document: ShadyDom.extendAll({__patched: 'Document'},
830+
Document: ShadyDom.extendAll({__patched: 'Document'},
833831
NodeMixin, FragmentMixin, ElementMixin, UnderActiveElementMixin),
834832

835833
Event: EventMixin

src/shady/patch.html

+18-16
Original file line numberDiff line numberDiff line change
@@ -12,11 +12,11 @@
1212
<script>
1313

1414
/**
15-
* Patches elements that interacts with ShadyDOM
15+
* Patches elements that interacts with ShadyDOM
1616
* such that tree traversal and mutation apis act like they would under
1717
* ShadowDOM.
1818
*
19-
* This import enables seemless interaction with ShadyDOM powered
19+
* This import enables seemless interaction with ShadyDOM powered
2020
* custom elements, enabling better interoperation with 3rd party code,
2121
* libraries, and frameworks that use DOM tree manipulation apis.
2222
*/
@@ -28,12 +28,8 @@
2828
var Tree = ShadyDom.Tree;
2929
var Mixins = ShadyDom.Mixins;
3030

31-
var nativeInsertBefore = Element.prototype.insertBefore;
32-
var nativeAppendChild = Element.prototype.appendChild;
33-
var nativeRemoveChild = Element.prototype.removeChild;
34-
3531
ShadyDom.patchedCount = 0;
36-
32+
3733
ShadyDom.patch = function(node) {
3834
if (!ShadyDom.inUse) {
3935
return;
@@ -61,17 +57,16 @@
6157
case document.head:
6258
case document.documentElement:
6359
return false;
64-
default:
60+
default:
6561
return true;
6662
}
67-
return true;
6863
},
69-
64+
7065
hasPrototypeDescriptors: Boolean(Object.getOwnPropertyDescriptor(
7166
Node.prototype, 'textContent')),
72-
67+
7368
protoCache: {},
74-
69+
7570
patch: function(node) {
7671
ShadyDom.patchedCount++;
7772
log && console.warn('patch node', node);
@@ -129,7 +124,7 @@
129124
obj.__proto__ = obj.__sourceProto;
130125
}
131126
}
132-
127+
133128
};
134129

135130
ShadyDom.patchImpl = patchImpl;
@@ -141,21 +136,28 @@
141136
return root;
142137
}
143138

139+
function patchEvents() {
140+
Node.prototype.addEventListener = ShadyDom.addEventListener;
141+
Node.prototype.removeEventListener = ShadyDom.removeEventListener;
142+
}
143+
144144
if (ShadyDom.force || !Element.prototype.createShadowRoot) {
145145

146146
// NOTE: transparent at the cost of intrusiveness.
147147
Element.prototype.createShadowRoot = function() {
148148
return createRootAndEnsurePatched(this, true);
149149
}
150-
150+
151+
patchEvents();
151152
}
152153

153154
if (ShadyDom.force || !Element.prototype.attachShadow) {
154155

155-
Element.prototype.attachShadow = function(dictionary) {
156+
Element.prototype.attachShadow = function() {
156157
return createRootAndEnsurePatched(this);
157158
}
158-
159+
160+
patchEvents();
159161
}
160162

161163
// TODO(sorvell): super experimental auto patching of document fragment

0 commit comments

Comments
 (0)