Rename "stop bubbling" to "stop propagation" for consistency with JS

This commit is contained in:
Steve Sanderson 2019-09-26 15:26:27 +01:00 committed by Artak
parent 896feb49e9
commit 580184d7de
4 changed files with 23 additions and 23 deletions

View File

@ -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));

View File

@ -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<UIEventArgs> | 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;
}
}

View File

@ -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) {

View File

@ -11,10 +11,10 @@ namespace Microsoft.AspNetCore.Components.Web
/// </summary>
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
/// <summary>
/// Appends a frame representing an instruction to stop the specified event from
/// bubbling up beyond the current element.
/// propagating beyond the current element.
/// </summary>
/// <param name="builder">The <see cref="RenderTreeBuilder"/>.</param>
/// <param name="sequence">An integer that represents the position of the instruction in the source code.</param>
/// <param name="eventName">The name of the event to be affected.</param>
/// <param name="value">True if bubbling should stop bubbling here, otherwise false.</param>
public static void AddEventStopBubblingAttribute(this RenderTreeBuilder builder, int sequence, string eventName, bool value)
/// <param name="value">True if propagation should be stopped here, otherwise false.</param>
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);
}
}
}