Number validation not working

[devbydaniel]

Sorry, it's me again.

I am trying to add a form with the following schema:

const schema = {
  type: 'object',
  properties: {
    ...otherFields,
    docNo: {
      type: 'integer', // or 'number'
      title: 'Document Number',
    },
  },
}

When I enter invalid values (as in: letters) for docNo the following happens

• first invalid value: onChange is triggered with errors == [] and docNo == undefined
• subsequent invalid values: onChange is not triggered again

If I enter something valid in other fields, onChange is triggered again with errors == [] and docNo == undefined

As soon as I delete the invalid values and enter something valid, e.g. '123', the onChange passes the correct value for docNo.

Other validations work correctly.

Here's a minimal example from my repo:

import { materialCells, materialRenderers } from '@jsonforms/material-renderers'

import AppFrame from '../../layouts/AppFrame'
import ContentAreaLayout from '../../layouts/ContentAreaLayout'
import { JsonForms } from '@jsonforms/react'
import { useState } from 'react'

const schema = {
  type: 'object',
  properties: {
    issuedBy: {
      type: 'string',
      title: 'Issuer',
    },
    issueDate: {
      type: 'string',
      format: 'date',
      title: 'Issue Date',
    },
    expiryDate: {
      type: 'string',
      format: 'date',
      title: 'Expiry Date',
    },
    docNo: {
      type: 'integer', // same with 'number'
      title: 'Document Number',
    },
  },
}

const defaultData = {
  issuedBy: 'Ministry of Foreign Affairs',
  issueDate: '2015-01-01',
  expiryDate: '2015-12-31',
  docNo: 123,
}

export default function Page() {
  const [currentData, setCurrentData] = useState(defaultData)
  return (
    <AppFrame pageTitle="JsonFormTestPage">
      <ContentAreaLayout>
        <div>
          <JsonForms
            renderers={materialRenderers}
            cells={materialCells}
            data={currentData}
            schema={schema}
            onChange={({ data, errors }) => {
              console.log({ data, errors })
              setCurrentData(data)
            }}
          />
        </div>
      </ContentAreaLayout>
    </AppFrame>
  )
}

Screenshot of the console when entering the first invalid value:

I am using:

"@jsonforms/core": "^3.1.0",
"@jsonforms/material-renderers": "^3.1.0",
"@jsonforms/react": "^3.1.0",
"@mui/icons-material": "^5.11.16",

Am I missing something? My expectation is that the errors object in onChange contains an error as soon as I start typing letters into a numbers field and the data object contains the invalid values for docNo.