Fixed bug with bubbling events and elements being removed during during event handling/rendering

Author: egil

CHANGELOG.md

@@ -24,6 +24,8 @@ List of any bug fixes.
 
 - When an `Add` call to the component parameter collection builder was used to select a parameter that was inherited from a base component, the builder incorrectly reported the selected property/parameter as missing on the type. Reported by [@nickmuller](https://github.com/nickmuller) in [#250](https://github.com/egil/bUnit/issues/250).
 
+- When an element, found in the DOM tree using the `Find()`, method was removed because of an event handler trigger on it, e.g. an `cut.Find("button").Click()` event trigger method, an `ElementNotFoundException` was thrown. Reported by [@nickmuller](https://github.com/nickmuller) in [#251](https://github.com/egil/bUnit/issues/251).
+
 ## [1.0.0-beta 10] - 2020-09-15
 
 The following section list all changes in beta-10.

src/bunit.core/ComponentParameterCollectionBuilder.cs

@@ -327,7 +327,7 @@ public bool TryAdd<TValue>(string name, [AllowNull] TValue value)
 					return true;
 				}
 
-				if(ccProp.GetCustomAttribute<CascadingParameterAttribute>(inherit: false) is CascadingParameterAttribute cpa)
+				if (ccProp.GetCustomAttribute<CascadingParameterAttribute>(inherit: false) is CascadingParameterAttribute cpa)
 				{
 					AddCascadingValueParameter(cpa.Name, value);
 					return true;
@@ -351,7 +351,7 @@ private static (string paramName, string? cascadingValueName, bool isCascading)
 			var propertyInfo = propInfoCandidate.DeclaringType != TComponentType
 				? TComponentType.GetProperty(propInfoCandidate.Name, propInfoCandidate.PropertyType)
 				: propInfoCandidate;
-			
+
 			var paramAttr = propertyInfo?.GetCustomAttribute<ParameterAttribute>(inherit: true);
 			var cascadingParamAttr = propertyInfo?.GetCustomAttribute<CascadingParameterAttribute>(inherit: true);
 

src/bunit.web/Diffing/BlazorDiffingHelpers.cs

@@ -19,6 +19,6 @@ public static FilterDecision BlazorAttributeFilter(in AttributeComparisonSource
 				return FilterDecision.Exclude;
 
 			return currentDecision;
-		}		
+		}
 	}
 }

src/bunit.web/EventDispatchExtensions/GeneralEventDispatchExtensions.cs

@@ -1,12 +1,6 @@
 using System;
-using System.Collections.Generic;
-using System.Globalization;
 using System.Threading.Tasks;
 using AngleSharp.Dom;
-using AngleSharp.Html.Dom;
-using AngleSharpWrappers;
-using Bunit.Rendering;
-using Microsoft.AspNetCore.Components.RenderTree;
 
 namespace Bunit
 {
@@ -15,73 +9,6 @@ namespace Bunit
 	/// </summary>
 	public static class GeneralEventDispatchExtensions
 	{
-		private static HashSet<string> NonBubblingEvents = new HashSet<string> { "onabort", "onblur", "onchange", "onerror", "onfocus", "onload", "onloadend", "onloadstart", "onmouseenter", "onmouseleave", "onprogress", "onreset", "onscroll", "onsubmit", "onunload", "ontoggle", "ondomnodeinsertedintodocument", "ondomnoderemovedfromdocument" };
-		private static HashSet<string> DisabledEventNames = new HashSet<string> { "onclick", "ondblclick", "onmousedown", "onmousemove", "onmouseup" };
-
-		/// <summary>
-		/// Raises the event <paramref name="eventName"/> on the element <paramref name="element"/>
-		/// passing the <paramref name="eventArgs"/> to the event handler.
-		/// </summary>
-		/// <param name="element">The element to raise the event on.</param>
-		/// <param name="eventName">The name of the event to raise (using on-form, e.g. <c>onclick</c>).</param>
-		/// <param name="eventArgs">The event arguments to pass to the event handler</param>
-		/// <returns></returns>
-		public static Task TriggerEventAsync(this IElement element, string eventName, EventArgs eventArgs)
-		{
-			if (element is null)
-				throw new ArgumentNullException(nameof(element));
-			if (eventName is null)
-				throw new ArgumentNullException(nameof(eventName));
-			var renderer = element.Owner.Context.GetService<ITestRenderer>();
-			if (renderer is null)
-				throw new InvalidOperationException($"Blazor events can only be raised on elements rendered with the Blazor test renderer '{nameof(ITestRenderer)}'.");
-
-			var eventAttrName = Htmlizer.ToBlazorAttribute(eventName);
-			var eventStopPropergationAttrName = $"{eventAttrName}:stoppropagation";
-			var result = new List<Task>();
-			var isNonBubblingEvent = NonBubblingEvents.Contains(eventName.ToLowerInvariant());
-
-			foreach (var candidate in element.GetParentsAndSelf())
-			{
-				if (candidate.TryGetEventId(eventAttrName, out var id))
-					result.Add(renderer.DispatchEventAsync(id, new EventFieldInfo() { FieldValue = eventName }, eventArgs));
-
-				if (isNonBubblingEvent || candidate.HasAttribute(eventStopPropergationAttrName) || candidate.EventIsDisabled(eventName))
-				{
-					break;
-				}
-			}
-
-			if (result.Count == 0)
-				throw new MissingEventHandlerException(element, eventName);
-
-			return Task.WhenAll(result);
-		}
-
-		private static bool EventIsDisabled(this IElement element, string eventName)
-		{
-			// We want to replicate the normal DOM event behavior that, for 'interactive' elements
-			// with a 'disabled' attribute, certain mouse events are suppressed
-
-			var elm = (element as ElementWrapper)?.WrappedElement ?? element;
-			switch (elm)
-			{
-				case IHtmlButtonElement:
-				case IHtmlInputElement:
-				case IHtmlTextAreaElement:
-				case IHtmlSelectElement:
-					return DisabledEventNames.Contains(eventName) && elm.IsDisabled();
-				default:
-					return false;
-			}
-		}
-
-		private static bool TryGetEventId(this IElement element, string blazorEventName, out ulong id)
-		{
-			var eventId = element.GetAttribute(blazorEventName);
-			return ulong.TryParse(eventId, NumberStyles.Integer, CultureInfo.InvariantCulture, out id);
-		}
-
 		/// <summary>
 		/// Raises the <c>@onactivate</c> event on <paramref name="element"/>, passing an empty (<see cref="EventArgs.Empty"/>) 
 		/// to the event handler.
@@ -95,7 +22,7 @@ private static bool TryGetEventId(this IElement element, string blazorEventName,
 		/// </summary>
 		/// <param name="element">The element to raise the event on.</param>
 		/// <returns>A task that completes when the event handler is done.</returns>
-		private static Task ActivateAsync(this IElement element) => TriggerEventAsync(element, "onactivate", EventArgs.Empty);
+		private static Task ActivateAsync(this IElement element) => element.TriggerEventAsync("onactivate", EventArgs.Empty);
 
 		/// <summary>
 		/// Raises the <c>@onbeforeactivate</c> event on <paramref name="element"/>, passing an empty (<see cref="EventArgs.Empty"/>) 
@@ -110,7 +37,7 @@ private static bool TryGetEventId(this IElement element, string blazorEventName,
 		/// </summary>
 		/// <param name="element">The element to raise the event on.</param>
 		/// <returns>A task that completes when the event handler is done.</returns>
-		private static Task BeforeActivateAsync(this IElement element) => TriggerEventAsync(element, "onbeforeactivate", EventArgs.Empty);
+		private static Task BeforeActivateAsync(this IElement element) => element.TriggerEventAsync("onbeforeactivate", EventArgs.Empty);
 
 		/// <summary>
 		/// Raises the <c>@onbeforedeactivate</c> event on <paramref name="element"/>, passing an empty (<see cref="EventArgs.Empty"/>) 
@@ -125,7 +52,7 @@ private static bool TryGetEventId(this IElement element, string blazorEventName,
 		/// </summary>
 		/// <param name="element">The element to raise the event on.</param>
 		/// <returns>A task that completes when the event handler is done.</returns>
-		private static Task BeforeDeactivateAsync(this IElement element) => TriggerEventAsync(element, "onbeforedeactivate", EventArgs.Empty);
+		private static Task BeforeDeactivateAsync(this IElement element) => element.TriggerEventAsync("onbeforedeactivate", EventArgs.Empty);
 
 		/// <summary>
 		/// Raises the <c>@ondeactivate</c> event on <paramref name="element"/>, passing an empty (<see cref="EventArgs.Empty"/>) 
@@ -140,7 +67,7 @@ private static bool TryGetEventId(this IElement element, string blazorEventName,
 		/// </summary>
 		/// <param name="element">The element to raise the event on.</param>
 		/// <returns>A task that completes when the event handler is done.</returns>
-		private static Task DeactivateAsync(this IElement element) => TriggerEventAsync(element, "ondeactivate", EventArgs.Empty);
+		private static Task DeactivateAsync(this IElement element) => element.TriggerEventAsync("ondeactivate", EventArgs.Empty);
 
 		/// <summary>
 		/// Raises the <c>@onended</c> event on <paramref name="element"/>, passing an empty (<see cref="EventArgs.Empty"/>) 
@@ -155,7 +82,7 @@ private static bool TryGetEventId(this IElement element, string blazorEventName,
 		/// </summary>
 		/// <param name="element">The element to raise the event on.</param>
 		/// <returns>A task that completes when the event handler is done.</returns>
-		private static Task EndedAsync(this IElement element) => TriggerEventAsync(element, "onended", EventArgs.Empty);
+		private static Task EndedAsync(this IElement element) => element.TriggerEventAsync("onended", EventArgs.Empty);
 
 		/// <summary>
 		/// Raises the <c>@onfullscreenchange</c> event on <paramref name="element"/>, passing an empty (<see cref="EventArgs.Empty"/>) 
@@ -170,7 +97,7 @@ private static bool TryGetEventId(this IElement element, string blazorEventName,
 		/// </summary>
 		/// <param name="element">The element to raise the event on.</param>
 		/// <returns>A task that completes when the event handler is done.</returns>
-		private static Task FullscreenChangeAsync(this IElement element) => TriggerEventAsync(element, "onfullscreenchange", EventArgs.Empty);
+		private static Task FullscreenChangeAsync(this IElement element) => element.TriggerEventAsync("onfullscreenchange", EventArgs.Empty);
 
 		/// <summary>
 		/// Raises the <c>@onfullscreenerror</c> event on <paramref name="element"/>, passing an empty (<see cref="EventArgs.Empty"/>) 
@@ -185,7 +112,7 @@ private static bool TryGetEventId(this IElement element, string blazorEventName,
 		/// </summary>
 		/// <param name="element">The element to raise the event on.</param>
 		/// <returns>A task that completes when the event handler is done.</returns>
-		private static Task FullscreenErrorAsync(this IElement element) => TriggerEventAsync(element, "onfullscreenerror", EventArgs.Empty);
+		private static Task FullscreenErrorAsync(this IElement element) => element.TriggerEventAsync("onfullscreenerror", EventArgs.Empty);
 
 		/// <summary>
 		/// Raises the <c>@onloadeddata</c> event on <paramref name="element"/>, passing an empty (<see cref="EventArgs.Empty"/>) 
@@ -200,7 +127,7 @@ private static bool TryGetEventId(this IElement element, string blazorEventName,
 		/// </summary>
 		/// <param name="element">The element to raise the event on.</param>
 		/// <returns>A task that completes when the event handler is done.</returns>
-		private static Task LoadedDataAsync(this IElement element) => TriggerEventAsync(element, "onloadeddata", EventArgs.Empty);
+		private static Task LoadedDataAsync(this IElement element) => element.TriggerEventAsync("onloadeddata", EventArgs.Empty);
 
 		/// <summary>
 		/// Raises the <c>@onloadedmetadata</c> event on <paramref name="element"/>, passing an empty (<see cref="EventArgs.Empty"/>) 
@@ -215,7 +142,7 @@ private static bool TryGetEventId(this IElement element, string blazorEventName,
 		/// </summary>
 		/// <param name="element">The element to raise the event on.</param>
 		/// <returns>A task that completes when the event handler is done.</returns>
-		private static Task LoadedMetadataAsync(this IElement element) => TriggerEventAsync(element, "onloadedmetadata", EventArgs.Empty);
+		private static Task LoadedMetadataAsync(this IElement element) => element.TriggerEventAsync("onloadedmetadata", EventArgs.Empty);
 
 		/// <summary>
 		/// Raises the <c>@onpointerlockchange</c> event on <paramref name="element"/>, passing an empty (<see cref="EventArgs.Empty"/>) 
@@ -230,7 +157,7 @@ private static bool TryGetEventId(this IElement element, string blazorEventName,
 		/// </summary>
 		/// <param name="element">The element to raise the event on.</param>
 		/// <returns>A task that completes when the event handler is done.</returns>
-		private static Task PointerlockChangeAsync(this IElement element) => TriggerEventAsync(element, "onpointerlockchange", EventArgs.Empty);
+		private static Task PointerlockChangeAsync(this IElement element) => element.TriggerEventAsync("onpointerlockchange", EventArgs.Empty);
 
 		/// <summary>
 		/// Raises the <c>@onpointerlockerror</c> event on <paramref name="element"/>, passing an empty (<see cref="EventArgs.Empty"/>) 
@@ -245,7 +172,7 @@ private static bool TryGetEventId(this IElement element, string blazorEventName,
 		/// </summary>
 		/// <param name="element">The element to raise the event on.</param>
 		/// <returns>A task that completes when the event handler is done.</returns>
-		private static Task PointerlockErrorAsync(this IElement element) => TriggerEventAsync(element, "onpointerlockerror", EventArgs.Empty);
+		private static Task PointerlockErrorAsync(this IElement element) => element.TriggerEventAsync("onpointerlockerror", EventArgs.Empty);
 
 		/// <summary>
 		/// Raises the <c>@onreadystatechange</c> event on <paramref name="element"/>, passing an empty (<see cref="EventArgs.Empty"/>) 
@@ -260,7 +187,7 @@ private static bool TryGetEventId(this IElement element, string blazorEventName,
 		/// </summary>
 		/// <param name="element">The element to raise the event on.</param>
 		/// <returns>A task that completes when the event handler is done.</returns>
-		private static Task ReadystateChangeAsync(this IElement element) => TriggerEventAsync(element, "onreadystatechange", EventArgs.Empty);
+		private static Task ReadystateChangeAsync(this IElement element) => element.TriggerEventAsync("onreadystatechange", EventArgs.Empty);
 
 		/// <summary>
 		/// Raises the <c>@onscroll</c> event on <paramref name="element"/>, passing an empty (<see cref="EventArgs.Empty"/>) 
@@ -275,6 +202,6 @@ private static bool TryGetEventId(this IElement element, string blazorEventName,
 		/// </summary>
 		/// <param name="element">The element to raise the event on.</param>
 		/// <returns>A task that completes when the event handler is done.</returns>
-		private static Task ScrollAsync(this IElement element) => TriggerEventAsync(element, "onscroll", EventArgs.Empty);
+		private static Task ScrollAsync(this IElement element) => element.TriggerEventAsync("onscroll", EventArgs.Empty);
 	}
 }

src/bunit.web/EventDispatchExtensions/TriggerEventDispatchExtensions.cs

@@ -0,0 +1,107 @@
+using System;
+using System.Collections.Generic;
+using System.Globalization;
+using System.Linq;
+using System.Threading.Tasks;
+using AngleSharp.Dom;
+using AngleSharp.Html.Dom;
+using AngleSharpWrappers;
+using Bunit.Rendering;
+using Microsoft.AspNetCore.Components.RenderTree;
+
+namespace Bunit
+{
+	/// <summary>
+	/// General event dispatch helper extension methods.
+	/// </summary>
+	public static class TriggerEventDispatchExtensions
+	{
+		private static HashSet<string> NonBubblingEvents = new HashSet<string> { "onabort", "onblur", "onchange", "onerror", "onfocus", "onload", "onloadend", "onloadstart", "onmouseenter", "onmouseleave", "onprogress", "onreset", "onscroll", "onsubmit", "onunload", "ontoggle", "ondomnodeinsertedintodocument", "ondomnoderemovedfromdocument" };
+		private static HashSet<string> DisabledEventNames = new HashSet<string> { "onclick", "ondblclick", "onmousedown", "onmousemove", "onmouseup" };
+
+		/// <summary>
+		/// Raises the event <paramref name="eventName"/> on the element <paramref name="element"/>
+		/// passing the <paramref name="eventArgs"/> to the event handler.
+		/// </summary>
+		/// <param name="element">The element to raise the event on.</param>
+		/// <param name="eventName">The name of the event to raise (using on-form, e.g. <c>onclick</c>).</param>
+		/// <param name="eventArgs">The event arguments to pass to the event handler</param>
+		/// <returns></returns>
+		public static Task TriggerEventAsync(this IElement element, string eventName, EventArgs eventArgs)
+		{
+			if (element is null)
+				throw new ArgumentNullException(nameof(element));
+			if (eventName is null)
+				throw new ArgumentNullException(nameof(eventName));
+			var renderer = element.Owner.Context.GetService<ITestRenderer>();
+			if (renderer is null)
+				throw new InvalidOperationException($"Blazor events can only be raised on elements rendered with the Blazor test renderer '{nameof(ITestRenderer)}'.");
+
+			var isNonBubblingEvent = NonBubblingEvents.Contains(eventName.ToLowerInvariant());
+
+			if (isNonBubblingEvent)
+				return TriggerNonBubblingEventAsync(renderer, element.Unwrap(), eventName, eventArgs);
+			else
+				return TriggerBubblingEventAsync(renderer, element.Unwrap(), eventName, eventArgs);
+		}
+
+		private static Task TriggerBubblingEventAsync(ITestRenderer renderer, IElement element, string eventName, EventArgs eventArgs)
+		{
+			var eventAttrName = Htmlizer.ToBlazorAttribute(eventName);
+			var eventStopPropergationAttrName = $"{eventAttrName}:stoppropagation";
+			var eventIds = new List<ulong>();
+
+			foreach (var candidate in element.GetParentsAndSelf())
+			{
+				if (candidate.TryGetEventId(eventAttrName, out var id))
+					eventIds.Add(id);
+
+				if (candidate.HasAttribute(eventStopPropergationAttrName) || candidate.EventIsDisabled(eventName))
+				{
+					break;
+				}
+			}
+
+			if (eventIds.Count == 0)
+				throw new MissingEventHandlerException(element, eventName);
+
+			return Task.WhenAll(eventIds.Select(TriggerEvent).ToArray());
+
+			Task TriggerEvent(ulong id)
+				=> renderer.DispatchEventAsync(id, new EventFieldInfo() { FieldValue = eventName }, eventArgs);
+		}
+
+		private static Task TriggerNonBubblingEventAsync(ITestRenderer renderer, IElement element, string eventName, EventArgs eventArgs)
+		{
+			var eventAttrName = Htmlizer.ToBlazorAttribute(eventName);
+
+			if (element.TryGetEventId(eventAttrName, out var id))
+				return renderer.DispatchEventAsync(id, new EventFieldInfo() { FieldValue = eventName }, eventArgs);
+			else
+				throw new MissingEventHandlerException(element, eventName);
+		}
+
+		private static bool EventIsDisabled(this IElement element, string eventName)
+		{
+			// We want to replicate the normal DOM event behavior that, for 'interactive' elements
+			// with a 'disabled' attribute, certain mouse events are suppressed
+
+			switch (element)
+			{
+				case IHtmlButtonElement:
+				case IHtmlInputElement:
+				case IHtmlTextAreaElement:
+				case IHtmlSelectElement:
+					return DisabledEventNames.Contains(eventName) && element.IsDisabled();
+				default:
+					return false;
+			}
+		}
+
+		private static bool TryGetEventId(this IElement element, string blazorEventName, out ulong id)
+		{
+			var eventId = element.GetAttribute(blazorEventName);
+			return ulong.TryParse(eventId, NumberStyles.Integer, CultureInfo.InvariantCulture, out id);
+		}
+	}
+}

src/bunit.web/Extensions/ElementNotFoundException.cs

@@ -14,7 +14,15 @@ public class ElementNotFoundException : Exception
 		public string CssSelector { get; }
 
 		/// <inheritdoc/>
-		public ElementNotFoundException(string cssSelector) : base($"No elements were found that matches the selector '{cssSelector}'")
+		public ElementNotFoundException(string cssSelector)
+			: base($"No elements were found that matches the selector '{cssSelector}'")
+		{
+			CssSelector = cssSelector;
+		}
+
+		/// <inheritdoc/>
+		protected ElementNotFoundException(string message, string cssSelector)
+			: base(message)
 		{
 			CssSelector = cssSelector;
 		}