diff --git a/src/app-data/index.ts b/src/app-data/index.ts index bf3898d0857..69fc88cd980 100644 --- a/src/app-data/index.ts +++ b/src/app-data/index.ts @@ -19,7 +19,6 @@ export const BUILD: BuildConditionals = { hostListenerTargetWindow: true, hostListenerTargetDocument: true, hostListenerTargetBody: true, - hostListenerTargetParent: true, hostListenerTarget: true, member: true, method: true, diff --git a/src/client/client-host-ref.ts b/src/client/client-host-ref.ts index 33c6f092d7d..b7efd4ab125 100644 --- a/src/client/client-host-ref.ts +++ b/src/client/client-host-ref.ts @@ -26,7 +26,7 @@ export const registerHost = (elm: d.HostElement, cmpMeta: d.ComponentRuntimeMeta elm['s-p'] = []; elm['s-rc'] = []; } - addHostEventListeners(elm, hostRef, cmpMeta.$listeners$, false); + addHostEventListeners(elm, hostRef, cmpMeta.$listeners$); return hostRefs.set(elm, hostRef); }; diff --git a/src/compiler/app-core/app-data.ts b/src/compiler/app-core/app-data.ts index 062156b2944..a5aa149148d 100644 --- a/src/compiler/app-core/app-data.ts +++ b/src/compiler/app-core/app-data.ts @@ -29,7 +29,6 @@ export const getBuildFeatures = (cmps: ComponentCompilerMeta[]) => { hostListenerTargetWindow: cmps.some(c => c.hasListenerTargetWindow), hostListenerTargetDocument: cmps.some(c => c.hasListenerTargetDocument), hostListenerTargetBody: cmps.some(c => c.hasListenerTargetBody), - hostListenerTargetParent: cmps.some(c => c.hasListenerTargetParent), hostListenerTarget: cmps.some(c => c.hasListenerTarget), member: cmps.some(c => c.hasMember), method: cmps.some(c => c.hasMethod), diff --git a/src/compiler/transformers/collections/parse-collection-deprecated.ts b/src/compiler/transformers/collections/parse-collection-deprecated.ts index 3d1a84be8ea..958169b2d41 100644 --- a/src/compiler/transformers/collections/parse-collection-deprecated.ts +++ b/src/compiler/transformers/collections/parse-collection-deprecated.ts @@ -78,7 +78,6 @@ function parseComponentDeprecated(config: d.Config, compilerCtx: d.CompilerCtx, hasListenerTargetWindow: false, hasListenerTargetDocument: false, hasListenerTargetBody: false, - hasListenerTargetParent: false, hasMember: false, hasMethod: false, hasMode: false, diff --git a/src/compiler/transformers/component-build-conditionals.ts b/src/compiler/transformers/component-build-conditionals.ts index a042b49f1c5..10e82656318 100644 --- a/src/compiler/transformers/component-build-conditionals.ts +++ b/src/compiler/transformers/component-build-conditionals.ts @@ -33,7 +33,6 @@ export const setComponentBuildConditionals = (cmpMeta: d.ComponentCompilerMeta) cmpMeta.hasListenerTargetWindow = cmpMeta.listeners.some(l => l.target === 'window'); cmpMeta.hasListenerTargetDocument = cmpMeta.listeners.some(l => l.target === 'document'); cmpMeta.hasListenerTargetBody = cmpMeta.listeners.some(l => l.target === 'body'); - cmpMeta.hasListenerTargetParent = cmpMeta.listeners.some(l => l.target === 'parent'); cmpMeta.hasListenerTarget = cmpMeta.listeners.some(l => !!l.target); } diff --git a/src/compiler/transformers/static-to-meta/component.ts b/src/compiler/transformers/static-to-meta/component.ts index 6e414f18de1..155975b5c94 100644 --- a/src/compiler/transformers/static-to-meta/component.ts +++ b/src/compiler/transformers/static-to-meta/component.ts @@ -85,7 +85,6 @@ export const parseStaticComponentMeta = ( hasListenerTargetWindow: false, hasListenerTargetDocument: false, hasListenerTargetBody: false, - hasListenerTargetParent: false, hasMember: false, hasMethod: false, hasMode: false, diff --git a/src/declarations/stencil-private.ts b/src/declarations/stencil-private.ts index bf8d5fba11b..80dcd905df7 100644 --- a/src/declarations/stencil-private.ts +++ b/src/declarations/stencil-private.ts @@ -104,7 +104,6 @@ export interface BuildFeatures { hostListenerTargetWindow: boolean; hostListenerTargetDocument: boolean; hostListenerTargetBody: boolean; - hostListenerTargetParent: boolean; hostListenerTarget: boolean; method: boolean; prop: boolean; @@ -737,7 +736,6 @@ export interface ComponentCompilerFeatures { hasListenerTargetWindow: boolean; hasListenerTargetDocument: boolean; hasListenerTargetBody: boolean; - hasListenerTargetParent: boolean; hasMember: boolean; hasMethod: boolean; hasMode: boolean; diff --git a/src/declarations/stencil-public-runtime.ts b/src/declarations/stencil-public-runtime.ts index 51cca073fa6..2b31713e837 100644 --- a/src/declarations/stencil-public-runtime.ts +++ b/src/declarations/stencil-public-runtime.ts @@ -151,7 +151,7 @@ export interface ListenOptions { passive?: boolean; } -export type ListenTargetOptions = 'parent' | 'body' | 'document' | 'window'; +export type ListenTargetOptions = 'body' | 'document' | 'window'; export interface StateDecorator { (): PropertyDecorator; diff --git a/src/hydrate/platform/index.ts b/src/hydrate/platform/index.ts index afaca1d25bc..70bf8ef4983 100644 --- a/src/hydrate/platform/index.ts +++ b/src/hydrate/platform/index.ts @@ -125,7 +125,7 @@ export const registerHost = (elm: d.HostElement, cmpMeta: d.ComponentRuntimeMeta hostRef.$onReadyPromise$ = new Promise(r => (hostRef.$onReadyResolve$ = r)); elm['s-p'] = []; elm['s-rc'] = []; - addHostEventListeners(elm, hostRef, cmpMeta.$listeners$, false); + addHostEventListeners(elm, hostRef, cmpMeta.$listeners$); return hostRefs.set(elm, hostRef); }; diff --git a/src/runtime/connected-callback.ts b/src/runtime/connected-callback.ts index 4becb84f0f2..0217e43e55e 100644 --- a/src/runtime/connected-callback.ts +++ b/src/runtime/connected-callback.ts @@ -15,11 +15,6 @@ export const connectedCallback = (elm: d.HostElement) => { const cmpMeta = hostRef.$cmpMeta$; const endConnected = createTime('connectedCallback', cmpMeta.$tagName$); - if (BUILD.hostListenerTargetParent) { - // only run if we have listeners being attached to a parent - addHostEventListeners(elm, hostRef, cmpMeta.$listeners$, true); - } - if (!(hostRef.$flags$ & HOST_FLAGS.hasConnected)) { // first time this component has connected hostRef.$flags$ |= HOST_FLAGS.hasConnected; @@ -92,7 +87,7 @@ export const connectedCallback = (elm: d.HostElement) => { // reattach any event listeners to the host // since they would have been removed when disconnected - addHostEventListeners(elm, hostRef, cmpMeta.$listeners$, false); + addHostEventListeners(elm, hostRef, cmpMeta.$listeners$); // fire off connectedCallback() on component instance fireConnectedCallback(hostRef.$lazyInstance$); diff --git a/src/runtime/host-listener.ts b/src/runtime/host-listener.ts index 33888df3db2..2fa9395a0b7 100644 --- a/src/runtime/host-listener.ts +++ b/src/runtime/host-listener.ts @@ -3,28 +3,13 @@ import { BUILD } from '@app-data'; import { doc, plt, supportsListenerOptions, win } from '@platform'; import { HOST_FLAGS, LISTENER_FLAGS } from '@utils'; -export const addHostEventListeners = (elm: d.HostElement, hostRef: d.HostRef, listeners: d.ComponentRuntimeHostListener[], attachParentListeners: boolean) => { +export const addHostEventListeners = (elm: d.HostElement, hostRef: d.HostRef, listeners: d.ComponentRuntimeHostListener[]) => { if (BUILD.hostListener && listeners) { // this is called immediately within the element's constructor // initialize our event listeners on the host element // we do this now so that we can listen to events that may // have fired even before the instance is ready - if (BUILD.hostListenerTargetParent) { - // this component may have event listeners that should be attached to the parent - if (attachParentListeners) { - // this is being ran from within the connectedCallback - // which is important so that we know the host element actually has a parent element - // filter out the listeners to only have the ones that ARE being attached to the parent - listeners = listeners.filter(([flags]) => flags & LISTENER_FLAGS.TargetParent); - } else { - // this is being ran from within the component constructor - // everything BUT the parent element listeners should be attached at this time - // filter out the listeners that are NOT being attached to the parent - listeners = listeners.filter(([flags]) => !(flags & LISTENER_FLAGS.TargetParent)); - } - } - listeners.map(([flags, name, method]) => { const target = BUILD.hostListenerTarget ? getHostListenerTarget(elm, flags) : elm; const handler = hostListenerProxy(hostRef, method); @@ -52,7 +37,6 @@ const getHostListenerTarget = (elm: Element, flags: number): EventTarget => { if (BUILD.hostListenerTargetDocument && flags & LISTENER_FLAGS.TargetDocument) return doc; if (BUILD.hostListenerTargetWindow && flags & LISTENER_FLAGS.TargetWindow) return win; if (BUILD.hostListenerTargetBody && flags & LISTENER_FLAGS.TargetBody) return doc.body; - if (BUILD.hostListenerTargetParent && flags & LISTENER_FLAGS.TargetParent) return elm.parentElement; return elm; }; diff --git a/src/runtime/test/listen.spec.tsx b/src/runtime/test/listen.spec.tsx index a2cb2f8a31f..61e59b94144 100644 --- a/src/runtime/test/listen.spec.tsx +++ b/src/runtime/test/listen.spec.tsx @@ -1,4 +1,4 @@ -import { Component, Event, EventEmitter, Listen, State, h } from '@stencil/core'; +import { Component, Event, EventEmitter, Listen, State } from '@stencil/core'; import { newSpecPage } from '@stencil/core/testing'; describe('listen', () => { @@ -45,7 +45,6 @@ describe('listen', () => { @Component({ tag: 'cmp-a' }) class CmpA { @State() selfClicks = 0; - @State() parentClicks = 0; @State() bodyClicks = 0; @State() documentClicks = 0; @State() windowClicks = 0; @@ -55,11 +54,6 @@ describe('listen', () => { this.selfClicks++; } - @Listen('click', { target: 'parent' }) - onParentClick() { - this.parentClicks++; - } - @Listen('click', { target: 'body' }) onBodyClick() { this.bodyClicks++; @@ -76,7 +70,7 @@ describe('listen', () => { } render() { - return `${this.selfClicks},${this.parentClicks},${this.bodyClicks},${this.documentClicks},${this.windowClicks}`; + return `${this.selfClicks},${this.bodyClicks},${this.documentClicks},${this.windowClicks}`; } } @@ -89,43 +83,43 @@ describe('listen', () => { const other = doc.querySelector('other') as any; expect(root).toEqualHtml(` - 0,0,0,0,0 + 0,0,0,0 `); root.click(); await waitForChanges(); expect(root).toEqualHtml(` - 1,1,1,1,1 + 1,1,1,1 `); parent.click(); await waitForChanges(); expect(root).toEqualHtml(` - 1,2,2,2,2 + 1,2,2,2 `); other.click(); await waitForChanges(); expect(root).toEqualHtml(` - 1,2,3,3,3 + 1,3,3,3 `); body.click(); await waitForChanges(); expect(root).toEqualHtml(` - 1,2,4,4,4 + 1,4,4,4 `); doc.dispatchEvent(new CustomEvent('click', { bubbles: true })); await waitForChanges(); expect(root).toEqualHtml(` - 1,2,4,5,5 + 1,4,5,5 `); win.dispatchEvent(new CustomEvent('click', { bubbles: true })); await waitForChanges(); expect(root).toEqualHtml(` - 1,2,4,5,6 + 1,4,5,6 `); }); diff --git a/src/testing/platform/testing-host-ref.ts b/src/testing/platform/testing-host-ref.ts index 0b485c03383..b4c92b0c364 100644 --- a/src/testing/platform/testing-host-ref.ts +++ b/src/testing/platform/testing-host-ref.ts @@ -37,6 +37,6 @@ export const registerHost = (elm: d.HostElement, cmpMeta: d.ComponentRuntimeMeta hostRef.$onReadyPromise$ = new Promise(r => (hostRef.$onReadyResolve$ = r)); elm['s-p'] = []; elm['s-rc'] = []; - addHostEventListeners(elm, hostRef, cmpMeta.$listeners$, false); + addHostEventListeners(elm, hostRef, cmpMeta.$listeners$); hostRefs.set(elm, hostRef); }; diff --git a/src/utils/constants.ts b/src/utils/constants.ts index 9053ebf5f12..de42b512e11 100644 --- a/src/utils/constants.ts +++ b/src/utils/constants.ts @@ -30,8 +30,7 @@ export const enum LISTENER_FLAGS { TargetDocument = 1 << 2, TargetWindow = 1 << 3, - TargetParent = 1 << 4, - TargetBody = 1 << 5, + TargetBody = 1 << 4, } export const enum HOST_FLAGS { diff --git a/src/utils/format-component-runtime-meta.ts b/src/utils/format-component-runtime-meta.ts index ee3a4ba479b..e89dbbbec1d 100644 --- a/src/utils/format-component-runtime-meta.ts +++ b/src/utils/format-component-runtime-meta.ts @@ -156,9 +156,6 @@ const computeListenerFlags = (listener: d.ComponentCompilerListener) => { case 'window': flags |= LISTENER_FLAGS.TargetWindow; break; - case 'parent': - flags |= LISTENER_FLAGS.TargetParent; - break; case 'body': flags |= LISTENER_FLAGS.TargetBody; break;