Forms: Fix dashboard initialization (#45539)

lezama · web-flow · commit 175854501afa · 2025-10-17T14:10:04.000-07:00
* Forms: Use data attribute to track initialization state

* Add changelog
diff --git a/projects/packages/forms/changelog/fix-forms-spa-init b/projects/packages/forms/changelog/fix-forms-spa-init
@@ -0,0 +1,4 @@
+Significance: patch
+Type: changed
+
+Forms: Make dashboard initialization idempotent for SPA environments by using data attribute to track state
diff --git a/projects/packages/forms/src/dashboard/index.tsx b/projects/packages/forms/src/dashboard/index.tsx
@@ -21,23 +21,17 @@ declare global {
 	}
 }
 
-let isInitialized = false;
-
 /**
  * Initialize the Forms dashboard
  */
 function initFormsDashboard() {
-	if ( isInitialized ) {
-		return;
-	}
-
 	const container = document.getElementById( 'jp-forms-dashboard' );
 
-	if ( ! container ) {
+	if ( ! container || container.dataset.formsInitialized ) {
 		return;
 	}
 
-	isInitialized = true;
+	container.dataset.formsInitialized = 'true';
 
 	const router = createHashRouter( [
 		{

Original file line number	Diff line number	Diff line change
`@@ -21,23 +21,17 @@ declare global {`
`21`	`21`	`}`
`22`	`22`	`}`
`23`	`23`
`24`		`-let isInitialized = false;`
`25`		`-`
`26`	`24`	`/**`
`27`	`25`	`* Initialize the Forms dashboard`
`28`	`26`	`*/`
`29`	`27`	`function initFormsDashboard() {`
`30`		`- if ( isInitialized ) {`
`31`		`- return;`
`32`		`- }`
`33`		`-`
`34`	`28`	`const container = document.getElementById( 'jp-forms-dashboard' );`
`35`	`29`
`36`		`- if ( ! container ) {`
	`30`	`+ if ( ! container \|\| container.dataset.formsInitialized ) {`
`37`	`31`	`return;`
`38`	`32`	`}`
`39`	`33`
`40`		`- isInitialized = true;`
	`34`	`+ container.dataset.formsInitialized = 'true';`
`41`	`35`
`42`	`36`	`const router = createHashRouter( [`
`43`	`37`	`{`