Skip to content

FormField onChange validation delay is hardcoded to 500ms #6129

@simleb

Description

@simleb

onChange validation is debounced to 500ms and there is no option to override it.

Beyond the fact that there is no universally accepted "correct delay" so it's fair to let developers override the default, it's also troublesome because Form attempts to set state after the debounce delay without checking that the component is still mounted (I wrote it as a separate issue).

I found this PR fixing a similar issue for Select but the code has changed since then and while debounceDelay remains in the theme, it appears to be unused.

Expected Behavior

onChange validation delay should be customizable, either at the theme level or as a prop on the form (or ideally both with the prop taking precedence).

If validation ends up being customizable at the FormField level, then a prop at that level would be appropriate too.

The docs should be updated to reflect the change.

Actual Behavior

onChange validation delay is hardcoded at 500ms.

URL, screen shot, or Codepen exhibiting the issue

// A half second (500ms) debounce can be a helpful starting
// point. You want to give the user time to fill out a
// field, but capture their attention before they move on
// past it. 2 second (2000ms) might be too long depending
// on how fast people type, and 200ms would be an eye blink
}, 500);

Steps to Reproduce

N/A

Your Environment

N/A

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

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugissue that does not match design or documentation and requires code changes to address

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions