final-form / react-final-form

🏁 High performance subscription-based form state management for React
https://final-form.org/react
MIT License
7.39k stars 481 forks source link

Initial value on select is not synced #327

Open ghengeveld opened 6 years ago

ghengeveld commented 6 years ago

Are you submitting a bug report or a feature request?

Bug report

What is the current behavior?

Given a field with a <select> input, browsers will pre-select the first option. If initialValues is not provided, this pre-selected value will not be synchronized with final-form's internal state. Since this is not obvious, it quickly leads to bugs. Of course it can be circumvented using initialValues, but that's not obvious and a bit tedious (especially with an asynchronous list of options).

What is the expected behavior?

The first (initial) option of a <select> should be automatically picked up by react-final-form and synced with final-form's internal state. At the very least there should be a warning when using <select> without providing a value for it through initialValues.

Sandbox Link

https://codesandbox.io/s/8ymv5on2wl

Note that 'red' is not persisted in final-form's state, despite it being initially selected by the browser. The only way to make it work is to first select another option, then select red again.

ackvf commented 5 years ago

I consider it a bug. Also as you pointed out, it is very uncomfortable to set the initialValue for asynchronous lists.