feat: Support form submission from buttons and inputs outside form using form attribute (#1771)

* Initial plan

* Initial investigation of form submit issue

Co-authored-by: egil <105649+egil@users.noreply.github.com>

* Implement support for clicking submit button outside form with form attribute

Co-authored-by: egil <105649+egil@users.noreply.github.com>

* Improve comments in FindFormById method

Co-authored-by: egil <105649+egil@users.noreply.github.com>

* Restore net10.0 target framework to all projects

Co-authored-by: linkdotnet <26365461+linkdotnet@users.noreply.github.com>

* Fix misleading comment about incremental DOM rendering

Co-authored-by: egil <105649+egil@users.noreply.github.com>

* Add test cases for input element with form attribute outside form

Co-authored-by: egil <105649+egil@users.noreply.github.com>

* Simplify FindFormById by removing GetElementById attempt

Co-authored-by: egil <105649+egil@users.noreply.github.com>

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: egil <105649+egil@users.noreply.github.com>
Co-authored-by: linkdotnet <26365461+linkdotnet@users.noreply.github.com>

Author: 3 people

src/bunit/EventDispatchExtensions/TriggerEventDispatchExtensions.cs

@@ -176,10 +176,56 @@ private static bool TryGetParentFormElementSpecialCase(
 			IHtmlButtonElement { Type: "submit", Form: not null } button => button.Form,
 			_ => null
 		};
+		
+		// If form is still null, try to find it by the form attribute for submit buttons/inputs
+		if (form is null && element.HasAttribute("form"))
+		{
+			var isSubmitElement = element switch
+			{
+				IHtmlInputElement { Type: "submit" } => true,
+				IHtmlButtonElement { Type: "submit" } => true,
+				_ => false
+			};
+			
+			if (isSubmitElement)
+			{
+				var formId = element.GetAttribute("form");
+				if (!string.IsNullOrEmpty(formId))
+				{
+					// Try to find the form element by traversing up to find a common ancestor
+					// and then searching down for the form
+					form = FindFormById(element, formId);
+				}
+			}
+		}
 
 		return form is not null
 			&& form.TryGetEventId(Htmlizer.ToBlazorAttribute("onsubmit"), out eventId);
 	}
+	
+	private static IHtmlFormElement? FindFormById(IElement element, string formId)
+	{
+		// Traverse up the DOM tree to find a common ancestor and search its children
+		// for the form with the matching ID. This handles cases where the button and
+		// form are siblings or in different subtrees.
+		var current = element.Parent as IElement;
+		while (current is not null)
+		{
+			// Search children of current element for the form with matching ID
+			foreach (var child in current.Children)
+			{
+				if ((child.Id == formId || child.GetAttribute("id") == formId) && child is IHtmlFormElement htmlForm)
+				{
+					return htmlForm;
+				}
+			}
+			
+			// Move up to parent to widen the search
+			current = current.Parent as IElement;
+		}
+		
+		return null;
+	}
 
 	private static bool EventIsDisabled(this IElement element, string eventName)
 	{

tests/bunit.testassets/SampleComponents/FormWithSubmitElementsOutside.razor

@@ -0,0 +1,13 @@
+<form @onsubmit="Callback" id="form1">
+</form>
+<button type="submit" form="form1" id="submit-button">Submit Button</button>
+<input type="submit" form="form1" id="submit-input" value="Submit Input" />
+
+@code {
+	public bool SubmitWasCalled { get; private set; }
+	
+	private void Callback()
+	{
+		SubmitWasCalled = true;
+	}
+}

tests/bunit.tests/EventDispatchExtensions/FormDispatchExtensionTest.cs

@@ -41,4 +41,24 @@ public void ClickingOnSubmitButtonOutsideTriggersOnsubmitOfForm()
 
 		cut.Instance.SubmitWasCalled.ShouldBeTrue();
 	}
+
+	[Fact]
+	public void ClickingOnSubmitButtonOutsideWithFormAttributeTriggersOnsubmit()
+	{
+		var cut = Render<FormWithSubmitElementsOutside>();
+
+		cut.Find("#submit-button").Click();
+
+		cut.Instance.SubmitWasCalled.ShouldBeTrue();
+	}
+
+	[Fact]
+	public void ClickingOnSubmitInputOutsideWithFormAttributeTriggersOnsubmit()
+	{
+		var cut = Render<FormWithSubmitElementsOutside>();
+
+		cut.Find("#submit-input").Click();
+
+		cut.Instance.SubmitWasCalled.ShouldBeTrue();
+	}
 }