search

inputlogic / elements

Dependable UI Components for (P)React Apps
0 stars 0 forks source link

re-render causes useForm to lose state #146

Closed bkmaibach closed 4 years ago

bkmaibach commented 4 years ago

Expected behaviour: isSubmitting should remain true while the front end is waiting for the server to respond

Encountered behaviour: isSubmitting becomes true, then immediately becomes false before server responds, formState gets set to "success"

How to reproduce: See src/modals/email-signup.js in the inputcowork-html project. (This modal can be opened by navigating to http://localhost:3000/membership and clikcing the Join the Community button)

Set a breakpoint in apps/cowork/views.py on the return of the function email_list_signup in the cowork-api project (so that in theory, isSubmitting should get stuck as true)

Open node_modules/@app-elements/use-form/dist/use-form.m.js add a debugging statement to line 43 as follows:

var _useState = useState(INIT),
      formState = _useState[0],
      setFormState = _useState[1]; // Functions
      console.log("FORMSTATE", formState)

Notice that this indicates that formState is being set to success before the server processes the request.

also add this line to just above the return statement of the mentioned modal component:

console.log("IS SUBMITTING?", isSubmitting)

isSubmitting will briefly flash as true, then will immediately become false again. The spinner on the button is never displayed.