From 580184d7de0fe8bb5df9fff4f13bea182786a30f Mon Sep 17 00:00:00 2001 From: Steve Sanderson Date: Thu, 26 Sep 2019 15:26:27 +0100 Subject: [PATCH] Rename "stop bubbling" to "stop propagation" for consistency with JS --- .../Web.JS/src/Rendering/BrowserRenderer.ts | 10 ++++----- .../Web.JS/src/Rendering/EventDelegator.ts | 22 +++++++++---------- .../Web.JS/src/Services/NavigationManager.ts | 2 +- .../src/Web/RenderTreeBuilderExtensions.cs | 12 +++++----- 4 files changed, 23 insertions(+), 23 deletions(-) diff --git a/src/Components/Web.JS/src/Rendering/BrowserRenderer.ts b/src/Components/Web.JS/src/Rendering/BrowserRenderer.ts index a2d0bf05c4..15175a5583 100644 --- a/src/Components/Web.JS/src/Rendering/BrowserRenderer.ts +++ b/src/Components/Web.JS/src/Rendering/BrowserRenderer.ts @@ -13,7 +13,7 @@ const preventDefaultEvents: { [eventType: string]: boolean } = { submit: true }; const rootComponentsPendingFirstRender: { [componentId: number]: LogicalElement } = {}; const internalAttributeNamePrefix = '__internal_'; const eventPreventDefaultAttributeNamePrefix = 'preventDefault_'; -const eventStopBubblingAttributeNamePrefix = 'stopBubbling_'; +const eventStopPropagationAttributeNamePrefix = 'stopPropagation_'; export class BrowserRenderer { private eventDelegator: EventDelegator; @@ -327,10 +327,10 @@ export class BrowserRenderer { private applyInternalAttribute(batch: RenderBatch, element: Element, internalAttributeName: string, attributeFrame: RenderTreeFrame | null) { const attributeValue = attributeFrame ? batch.frameReader.attributeValue(attributeFrame) : null; - if (internalAttributeName.startsWith(eventStopBubblingAttributeNamePrefix)) { - // Stop bubbling - const eventName = stripOnPrefix(internalAttributeName.substring(eventStopBubblingAttributeNamePrefix.length)); - this.eventDelegator.setStopBubbling(element, eventName, attributeValue !== null); + if (internalAttributeName.startsWith(eventStopPropagationAttributeNamePrefix)) { + // Stop propagation + const eventName = stripOnPrefix(internalAttributeName.substring(eventStopPropagationAttributeNamePrefix.length)); + this.eventDelegator.setStopPropagation(element, eventName, attributeValue !== null); } else if (internalAttributeName.startsWith(eventPreventDefaultAttributeNamePrefix)) { // Prevent default const eventName = stripOnPrefix(internalAttributeName.substring(eventPreventDefaultAttributeNamePrefix.length)); diff --git a/src/Components/Web.JS/src/Rendering/EventDelegator.ts b/src/Components/Web.JS/src/Rendering/EventDelegator.ts index d413376ac4..bf4f03c58e 100644 --- a/src/Components/Web.JS/src/Rendering/EventDelegator.ts +++ b/src/Components/Web.JS/src/Rendering/EventDelegator.ts @@ -89,9 +89,9 @@ export class EventDelegator { this.eventInfoStore.addGlobalListener('click'); } - public setStopBubbling(element: Element, eventName: string, value: boolean) { + public setStopPropagation(element: Element, eventName: string, value: boolean) { const infoForElement = this.getEventHandlerInfosForElement(element, true)!; - infoForElement.stopBubbling(eventName, value); + infoForElement.stopPropagation(eventName, value); } public setPreventDefault(element: Element, eventName: string, value: boolean) { @@ -108,7 +108,7 @@ export class EventDelegator { let candidateElement = evt.target as Element | null; let eventArgs: EventForDotNet | null = null; // Populate lazily const eventIsNonBubbling = nonBubblingEvents.hasOwnProperty(evt.type); - let stopBubblingWasRequested = false; + let stopPropagationWasRequested = false; while (candidateElement) { const handlerInfos = this.getEventHandlerInfosForElement(candidateElement, false); if (handlerInfos) { @@ -123,8 +123,8 @@ export class EventDelegator { this.onEvent(evt, handlerInfo.eventHandlerId, eventArgs, eventFieldInfo); } - if (handlerInfos.stopBubbling(evt.type)) { - stopBubblingWasRequested = true; + if (handlerInfos.stopPropagation(evt.type)) { + stopPropagationWasRequested = true; } if (handlerInfos.preventDefault(evt.type)) { @@ -139,7 +139,7 @@ export class EventDelegator { } } - candidateElement = (eventIsNonBubbling || stopBubblingWasRequested) ? null : candidateElement.parentElement; + candidateElement = (eventIsNonBubbling || stopPropagationWasRequested) ? null : candidateElement.parentElement; } } @@ -226,7 +226,7 @@ class EventHandlerInfosForElement { // So to keep things simple, only track one EventHandlerInfo per (element, eventName) private handlers: { [eventName: string]: EventHandlerInfo } = {}; private preventDefaultFlags: { [eventName: string]: boolean } | null = null; - private stopBubblingFlags: { [eventName: string]: boolean } | null = null; + private stopPropagationFlags: { [eventName: string]: boolean } | null = null; public getHandler(eventName: string): EventHandlerInfo | null { return this.handlers.hasOwnProperty(eventName) ? this.handlers[eventName] : null; @@ -249,13 +249,13 @@ class EventHandlerInfosForElement { return this.preventDefaultFlags ? this.preventDefaultFlags[eventName] : false; } - public stopBubbling(eventName: string, setValue?: boolean): boolean { + public stopPropagation(eventName: string, setValue?: boolean): boolean { if (setValue !== undefined) { - this.stopBubblingFlags = this.stopBubblingFlags || {}; - this.stopBubblingFlags[eventName] = setValue; + this.stopPropagationFlags = this.stopPropagationFlags || {}; + this.stopPropagationFlags[eventName] = setValue; } - return this.stopBubblingFlags ? this.stopBubblingFlags[eventName] : false; + return this.stopPropagationFlags ? this.stopPropagationFlags[eventName] : false; } } diff --git a/src/Components/Web.JS/src/Services/NavigationManager.ts b/src/Components/Web.JS/src/Services/NavigationManager.ts index a31c7deca6..547df1a6bb 100644 --- a/src/Components/Web.JS/src/Services/NavigationManager.ts +++ b/src/Components/Web.JS/src/Services/NavigationManager.ts @@ -34,7 +34,7 @@ function enableNavigationInterception() { export function attachToEventDelegator(eventDelegator: EventDelegator) { // We need to participate in EventDelegator's synthetic event bubbling process - // (so we can respect stopBubbling/preventDefault), so register with that instead + // (so we can respect stopPropagation/preventDefault), so register with that instead // of using a native JS event eventDelegator.addLinkClickListener((clickEvent, anchorElement) => { if (!hasEnabledNavigationInterception) { diff --git a/src/Components/Web/src/Web/RenderTreeBuilderExtensions.cs b/src/Components/Web/src/Web/RenderTreeBuilderExtensions.cs index 89dbc5684b..82dcfef715 100644 --- a/src/Components/Web/src/Web/RenderTreeBuilderExtensions.cs +++ b/src/Components/Web/src/Web/RenderTreeBuilderExtensions.cs @@ -11,10 +11,10 @@ namespace Microsoft.AspNetCore.Components.Web /// public static class RenderTreeBuilderExtensions { - // The "prevent default" and "stop bubbling" flags behave like attributes, in that: + // The "prevent default" and "stop propagation" flags behave like attributes, in that: // - you can have multiple of them on a given element (for separate events) // - you can add and remove them dynamically - // - they are independent of other attributes (e.g., you can "stop bubbling" of a given + // - they are independent of other attributes (e.g., you can "stop propagation" of a given // event type on an element that doesn't itself have a handler for that event) // As such, they are represented as attributes to give the right diffing behavior. // @@ -39,15 +39,15 @@ namespace Microsoft.AspNetCore.Components.Web /// /// Appends a frame representing an instruction to stop the specified event from - /// bubbling up beyond the current element. + /// propagating beyond the current element. /// /// The . /// An integer that represents the position of the instruction in the source code. /// The name of the event to be affected. - /// True if bubbling should stop bubbling here, otherwise false. - public static void AddEventStopBubblingAttribute(this RenderTreeBuilder builder, int sequence, string eventName, bool value) + /// True if propagation should be stopped here, otherwise false. + public static void AddEventStopPropagationAttribute(this RenderTreeBuilder builder, int sequence, string eventName, bool value) { - builder.AddAttribute(sequence, $"__internal_stopBubbling_{eventName}", value); + builder.AddAttribute(sequence, $"__internal_stopPropagation_{eventName}", value); } } }