Async validation react-final-form setTimeout

Question

I am migrating from redux-form and I have issue with form, where I have async validation. This validation happens on change, but I want to do the asynchronous call only when users stops typing.

In redux-form I was using setTimeout, clearTimeout and throwing an error in async validation similar to this

I have created example which I would expect to be working. The full example is available here.

const usernameAvailable = value => {
  if (!value) {
    return "Required";
  }

  setTimeout(() => {
    return "Username taken!";
  }, 500);
};

Required works as expected if there is no value, but Username taken! is never shown as an error.

Answer 1

How about using validateOnBlur?