What you were expecting:
No error thrown in the console log.
What happened instead:
When a user interacts with the filter components on a List view, the following React error is thrown: "Warning: Cannot update a component from inside the function body of a different component."
Steps to reproduce:
Encountered the error in a custom app but it seems to be reproducible in the latest demo sandbox.
Open the console, error appears on the user applying a filter to the Posts list (e.g. Title) in the demo CodeSandbox example: https://codesandbox.io/s/github/marmelab/react-admin/tree/master/examples/simple
Environment
Warning: Cannot update a component (`ReactFinalForm`) while rendering a different component (`TextInput`). To locate the bad setState() call inside `TextInput`, follow the stack trace as described in https://fb.me/setstate-in-render
in TextInput (at PostList.js:46)
in div (created by FilterFormInput)
in FilterFormInput
in form
in Unknown (created by ReactFinalForm)
in ReactFinalForm (created by EnhancedFilterForm)
in EnhancedFilterForm (created by Filter)
in Filter (at PostList.js:44)
in PostFilter (at PostList.js:128)
in div (created by ForwardRef(Toolbar))
in ForwardRef(Toolbar) (created by WithStyles(ForwardRef(Toolbar)))
in WithStyles(ForwardRef(Toolbar)) (created by ListToolbar)
in ListToolbar
in div
in Unknown (created by List)
in List (at PostList.js:125)
in PostList (created by WithPermissions)
in WithPermissions (created by Context.Consumer)
in Route (created by ResourceRoutes)
in Switch (created by ResourceRoutes)
in ResourceRoutes (created by Resource)
in Resource (at src/index.js:40)
in Route (created by RoutesWithLayout)
in Switch (created by RoutesWithLayout)
in RoutesWithLayout (created by Context.Consumer)
in div (created by Layout)
in main (created by Layout)
in div (created by Layout)
in div (created by Layout)
in Layout (created by WithStyles(Layout))
in WithStyles(Layout) (created by Context.Consumer)
in withRouter(WithStyles(Layout)) (created by ConnectFunction)
in ConnectFunction (created by LayoutWithTheme)
in ThemeProvider (created by LayoutWithTheme)
in LayoutWithTheme (at Layout.js:42)
in _default (created by Context.Consumer)
in Route (created by CoreAdminRouter)
in Switch (created by CoreAdminRouter)
in div (created by CoreAdminRouter)
in CoreAdminRouter (created by Context.Consumer)
in Route (created by CoreAdminUI)
in Switch (created by CoreAdminUI)
in CoreAdminUI (created by AdminUI)
in AdminUI (created by Admin)
in Router (created by ConnectedRouter)
in ConnectedRouter (created by Context.Consumer)
in ConnectedRouterWithContext (created by ConnectFunction)
in ConnectFunction (created by CoreAdminContext)
in TranslationProvider (created by CoreAdminContext)
in Provider (created by CoreAdminContext)
in CoreAdminContext (created by AdminContext)
in AdminContext (created by Admin)
in Admin (at src/index.js:19)
Reproduced on master by removing the yarn.lock and reinstalling dependencies. As the current yarn.lock doesn't show the bug, I believe it's a regression in one of our dependencies that causes the bug.
OK, this is a bug in react-final-form (https://github.com/final-form/react-final-form/issues/751) revealed by a recent react update (https://github.com/facebook/react/issues/18178). There is nothing we can do in react-admin to fix this bug.
It seems the upstream bug is fixed in react-final-form v6.4.0. Can you upgrade and report here how it affects your bug?
https://github.com/final-form/react-final-form/issues/751#issuecomment-606212893
@fzaninotto no longer able to reproduce with the upgrade to react-admin v3.3.3 (react-final-form v6.4.0). Thanks for the feedback, closing issue :)
Most helpful comment
It seems the upstream bug is fixed in react-final-form v6.4.0. Can you upgrade and report here how it affects your bug?
https://github.com/final-form/react-final-form/issues/751#issuecomment-606212893