Reinitializing Forms Triggers Endless Submit Loop on Pages With Multiple Forms

[brianlyktwoday]

Which Umbraco Forms version are you using? (Please write the exact version, example: 13.4.0)

16.2.0

Which Umbraco version are you using? (Please write the exact version, example: 13.5.2)

16.3.4

Issue summary

When using the new umbracoFormsReinitialize feature (introduced in response to issue #1224), reinitializing forms causes a form on the page to continuously submit itself in an endless loop after the event has been dispatched.

Specifics

The issue occurs when more than one form exists on the page - one form rendered normally, and another injected dynamically. After dispatching the umbracoFormsReinitialize event, submitting the original form causes that same form to repeatedly self-submit.

Steps to reproduce

1. Install a clean Umbraco solution with only Umbraco Forms installed.
2. Create a simple Umbraco Form.
3. Create a new Document Type with a template and add it to the content tree.
4. Add a Form Picker to the Document Type and select the created form in the content node.
5. In the template:
   1. Call @Html.RenderUmbracoFormDependencies(Url)
   2. Get the selected form ID
   3. Render the form using the ViewComponent: @await Component.InvokeAsync("RenderForm", new { formId = Guid.Parse(formId), theme = "default", includeScripts = true })
   4. Add a small JavaScript snippet to log whenever any <form> is submitted.
6. Load the page and verify normal behavior: the log appears once when submitting the form.
7. Add a second instance of the same form to the DOM (e.g., directly via DevTools).
8. Trigger the reinitialization feature: document.dispatchEvent(new Event('umbracoFormsReinitialize'));
9. Submit the first form.
10. Observe that this form (the one submitted) enters an endless submit loop.

A reproduction solution is attached below. It includes credentials for logging in (credentials.md) and a template containing buttons that add a second form and run the reinitialization code.

Note that only the umbraco-forms-form-config element from the second form is added when clicking the button. That's enough for the reinitialization function to cause the loop.

FormsTest.zip

Expected result / actual result

Expected:
The submitted form should post once, and newly injected forms should have validation reattached without side effects.

Actual:
The submitted form begins endlessly submitting itself, causing continuous console logs and repeated post attempts.

---

This item has been added to our backlog AB#62405

[rickbutterfield]

Hi @brianlyktwoday! Thanks for your comprehensive steps to triage this. Using your example I have managed to resolve this issue. Look out for a bug fix in the final release of 17.0.0 and 16.3.0