FluentUI TextField onchange does not fire errormessage

Question

So I've been working with FluentUI and I've setup a TextField with a onError Property which fires but it only fires when starting the app up. When changing the value the error does not fire again.

I've followed the FluentUI docs but I cannot replicate what they did somehow.

Would be nice to get some help.

const ControlledTextField = (props:any):JSX.Element => {
const getErrorMessage = (value: string): string => {
    console.log(value);
    return value.length > 0 && value.length < 3
      ? ""
      : `Input value length must be less than 3. Actual length is ${value.length}.`;
  };

return (
<TextField label="String-based validation" onGetErrorMessage={getErrorMessage} />
);

https://codesandbox.io/s/shy-worker-wlxhfw?file=/src/App.tsx:1095-1198