Skip to content

Conversation

@prem22k
Copy link

@prem22k prem22k commented Jan 20, 2026

Link to Jira Ticket

Fixes #590

Description

What changed?

I updated the useEffect hook in src/components/Form.tsx to include a proper cancellation pattern.
Specifically:

  1. Added a local ignore flag to track if the effect has been cleaned up (unmounted).
  2. Updated the cleanup function to set ignore = true.
  3. Added a check after the asynchronous createWebformInstance call to immediately destroy the instance if ignore is true.

Why have you chosen this solution?

The previous implementation relied on a ref (isMounted) that could be inconsistent during the rapid mount/unmount cycles triggered by React Strict Mode or fast user navigation. This race condition caused two Formio instances to be created and attached to the DOM, resulting in "double loading spinners" and potential memory leaks.

The new pattern ensures that if the component is unmounted while the form is still initializing, the "zombie" instance is destroyed immediately upon creation, preventing it from ever attaching to the DOM or state. This aligns with the pattern already successfully used in FormBuilder.tsx.

Breaking Changes / Backwards Compatibility

None. This is an internal fix to the component's lifecycle management.

Dependencies

None.

How has this PR been tested?

  • Ran npm test locally, and verified that existing tests pass (src/components/__tests__/Form.test.tsx).
  • Validated the fix logic by comparing it against the stable implementation in FormBuilder.tsx.

Checklist:

  • I have completed the above PR template
  • I have commented my code, particularly in hard-to-understand areas
  • I have made corresponding changes to the documentation (if applicable)
  • My changes generate no new warnings
  • My changes include tests that prove my fix is effective (or that my feature works as intended)
  • New and existing unit/integration tests pass locally with my changes
  • Any dependent changes have corresponding PRs that are listed above

Copilot AI review requested due to automatic review settings January 20, 2026 17:57
Copy link

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot encountered an error and was unable to review this pull request. You can try again by re-requesting a review.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Two loading spinners are displayed

1 participant