Controlled form resets focus on every keystroke

[joesaunderson]

Prerequisites

• I have searched the existing issues
• I understand that providing a SSCCE example is tremendously useful to the maintainers.
• I have read the documentation
• Ideally, I'm providing a sample JSFiddle, Codesandbox.io or preferably a shared playground link demonstrating the issue.

What theme are you using?

core

Version

5.x

Current Behavior

When using the form in controlled mode, every keystroke into the form resets the forms focus.

Example:

const App = () => {
  const [formData, setFormData] = React.useState(null);
  return (
    <Form
      schema={{ type: 'string' }}
      formData={formData}
      onChange={(e) => setFormData(e.formData)}
      validator={validator}
    />
  );
};

Expected Behavior

It should maintain the focus state of the element.

Steps To Reproduce

Run the above code, type into the form.

Environment

React 18

Anything else?

Linked to #391 (changing to controlled form as a workaround due to the attached issue).

[nickgros]

@joesaunderson I cannot reproduce this in this CodeSandbox, is there something I failed to capture here?

[joesaunderson]

@joesaunderson I cannot reproduce this in this CodeSandbox, is there something I failed to capture here?

Hey, the only difference is we're styling the form, reproducible example (with no fields being overriden, but the methods the same)

https://codesandbox.io/p/devbox/rjsf-v5-4544-reproduction-forked-dm5cmw