The Form component, when using onChange validation (validate="change") debounces validation (using a hardcoded delay, see #6129) using a function that attempts to set some state without checking that the form is still mounted. This bit me while testing and forced me to use a delay to ensure the debounced action was finished before ending the test.

Expected Behavior

When the form dismounts, either cancel all debounced actions or use a ref to ensure the component is still mounted before attempting to set its state.

Actual Behavior

Debounced action tries to set state after the form component has been dismounted.

URL, screen shot, or Codepen exhibiting the issue

N/A

Steps to Reproduce

<Form validate="change">
  <FormField validate={(_val: string) => undefined}>
    <TextInput placeholder="type here" />
  </FormField>
</Form>

1. Mount form component
2. Send a change event
3. Destroy form component less than 500ms after the event

Your Environment

Jest/Enzyme

• Grommet version:
• Browser Name and version:
• Operating System and version (desktop or mobile):