Atlassian Design "Form" Component Sporadic Silent Render Failures

Hello All,

I am in the midst of building a custom UI Atlassian forge app and I have been making use of some of the ADS components.

I have successfully built custom forms using this Form component but I am currently facing a persistent issue with one of my components where the form simply will not render.

Posting here in hopes that somebody may be aware of known issues with the Atlassian Form component that I may be unknowingly running up against.

Following is my specific use-case:

  1. Parent component conditionally renders “Create” component with form.
  2. Upon submission, the parent component conditionally renders “Edit” component with form. (I have temporarily removed all state related dependencies to debug… The current form in the “Edit” component is essentially a carbon copy of the form from the "Create” component)
  3. Form from create component renders and works completely fine, whereas the edit component’s form does not.
  4. The conditional JSX in the Edit component renders completely fine…It’s just the carbon copy of that form that fails to render
  5. The create & edit components exist in completely separate conditional JSX blocks, and I can confirm that there is no nested form declaration going on inside of the form
  6. I have tried wrapping the form in the available primitive components but haven’t had any luck
  7. I have omitted any styling for the time being to mitigate variables

*Note: I am spreading the formProps inside the native form tag as done in the ADS documentation:

    {({ formProps }) => (

        <form {...formProps}> …

If anybody has any insight, it would be tremendously appreciated, because as it stands, I am at a complete loss.

Hi Alp, would you mind sharing a minimal reproduction (preferably by modifying one of the code sandboxes from the Atlassian Design System Website) to make it easier to debug :slight_smile:

Sim Saini