jaredpalmer
Map fields not supported
🐛 Bug report
Current Behavior
Using javascript Map as a form field makes the form dirty property not to change to true when modifying the Map field.
In this old issue https://github.com/jaredpalmer/formik/issues/1339 it is reported this broken support and @jaredpalmer confirms that Formik is fine not supporting this type. But the issue is very old (2016) and maybe now this types are supported. I could find anything in the docs.
Expected Behavior
If there is no support for Maps the docs should make this clear.
If there is support for Maps then this is a BUG.
Reproducible example
https://codesandbox.io/s/formik-with-maps-error-1mqzs
Your environment
| Software | Version(s) |
|---|---|
| Formik | 1.5.1 |
| React | 16.8.6 |
| TypeScript | - |
| Browser | Any |
| npm/Yarn | 6.4.1 |
| Operating System | Ubuntu 16 |
There hasn't been any movement on supporting Maps or Sets, though the last comments on the original issue #1339 say that they might add support upstream sometime soon.
I don't think we'll be changing this in Formik, but I'd be down with documenting that maps and sets are not supported. (FAQ?)
Support for this types in react-fast-compare (the library used by Formik to check the dirty property of the form) is a future addition but it is not clear when (I will not say soon), so I don't will rely on this. See react-fast-compare issue #36.
About the docs for me it will be easy to find in a note about unsuported types in the API Reference in the initialValues section. Maybe another place is in the Guides in the section Arrays and Nested objects, that covers a different but related subject.
Anyway thanks for this great piece of software!
https://github.com/FormidableLabs/react-fast-compare has landed support for Map, Set and ArrayBuffer in master and will publish soon.
Version 3.0.0 of react-fast-compare has been available for over 3 years now. Meanwhile, Formik is still using a version that's around 5 years old.
In the meantime, I'm overriding the dependency using resolutions to support Map and Set in my values:
package.json
"resolutions": {
"react-fast-compare": "^3.2.0"
}
