-
Notifications
You must be signed in to change notification settings - Fork 2.2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Browse files
Browse the repository at this point in the history
* Fixed #1596 by adapting the fix from #2002 into rjsf v5 - Added a new `mergeValidationData()` method in `@rjsf/utils` to handle the appending of errors onto the end of the validationData from an additional error schema - Added this to the `schema` directory `index.ts` along with exposing it on the `SchemaUtils` type and implementation - Also fixed the type of `toErrorList()` in `ValidatorType` to change from `fieldName: string` to `fieldPath: string[]` - Added reusable `mergeValidationDataTest.ts`, calling it in the utils - Update the `@rjsf/validator-ajv6` to pick up the breaking change from #2002 around `AJV6Validator.toErrorList()` - Also modified the `validateFormData()` function to return the result of `mergeValidationData()` when the user has a custom validator - Updated tests for the new structure of the `toErrorList()` data - Also updated the `schema.tests` to add the new `mergeValidationDataTest()` - Updated `Form` to use the `mergeValidationData()` function in the few places where `extraErrors` was being merged into the schema validation - Updated tests for the new structor of the `toErrorList()` data - Updated the `CHANGELOG.md` to describe this fix - Updated the `5.x upgrade guide.md` to describe all the new utility functions added and describe util.js and validator.js breaking changes - Updated the `validation.md` documentation for the `ErrorListTemplate` change along with making the `RJSFValidationError` interface describe the optional properties * - Responded to reviewer feedback... also, removed the `:` after the property in the `stack` to match AJV stack, adding `message` to also match AJV - Added migration guide changes
- Loading branch information
1 parent
e3edba7
commit 5f1bd8a
Showing
19 changed files
with
367 additions
and
82 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -23,7 +23,8 @@ Unfortunately, there is required work pending to properly support React 18, so u | |
| ### New packages | ||
|
|
||
| There are three new packages added in RJSF version 5: | ||
| - `@rjsf/utils`: All of the [utility functions](https://react-jsonschema-form.readthedocs.io/en/stable/api-reference/utiltity-functions) previously imported from `@rjsf/core/utils` as well as the Typescript types for RJSV version 5. | ||
| - `@rjsf/utils`: All of the [utility functions](https://react-jsonschema-form.readthedocs.io/en/stable/api-reference/utiltity-functions) previously imported from `@rjsf/core/utils` as well as the Typescript types for RJSF version 5. | ||
| - The following new utility functions were added: `createSchemaUtils()`, `getInputProps()`, `mergeValidationData()` and `processSelectValue()` | ||
| - `@rjsf/validator-ajv6`: The [ajv](https://github.com/ajv-validator/ajv)-v6-based validator refactored out of `@rjsf/[email protected]`, that implements the `ValidatorType` interface defined in `@rjsf/utils`. | ||
| - `@rjsf/mui`: Previously `@rjsf/material-ui/v5`, now provided as its own theme. | ||
|
|
||
|
|
@@ -86,10 +87,10 @@ render(( | |
| ), document.getElementById("app")); | ||
| ``` | ||
|
|
||
| #### validate renamed | ||
| ##### validate renamed | ||
| In version 5, the `validate` prop on `Form` was renamed to `customValidate` to avoid confusion with the new `validator` prop. | ||
|
|
||
| #### utils | ||
| #### utils.js | ||
| In version 5, all the utility functions that were previously accessed via `import { utils } from '@rjsf/core';` are now available via `import utils from '@rjsf/utils';`. | ||
| Because of the decoupling of validation from `@rjsf/core` there is a breaking change for all the [validator-based utility functions](https://react-jsonschema-form.readthedocs.io/en/stable/api-reference/utiltity-functions#validator-based-utility-functions), since they now require an additional `ValidatorType` parameter. | ||
|
|
||
|
|
@@ -130,6 +131,93 @@ function YourWidget(props: WidgetProps) { | |
| } | ||
| ``` | ||
|
|
||
| #### validator.js | ||
| Because of the decoupling of validation from `@rjsf/core` this file was refactored into its own `@rjsf/validator-ajv` package. | ||
| During that refactor a few **breaking changes** were made to how it works related to custom validation and `ErrorSchema` conversion. | ||
|
|
||
| ##### toErrorList param changed | ||
| In previous versions, the `toErrorList()` function used to take a `fieldName` string defaulted to `root`, and use it to format the `stack` message. | ||
| In version 5, `fieldName` was changed to `fieldPath` string array defaulted to an empty array, and is used to recursively add the field name to the errors as the `property` object along with the raw `message`. | ||
| The result is that if you had an `ErrorSchema` that looks like: | ||
|
|
||
| ```tsx | ||
| const errorSchema: ErrorSchema = { | ||
| __error: [ "error message 1"], | ||
| password: { __error: "passwords do not match" } | ||
| } | ||
| ``` | ||
|
|
||
| The returned result from calling `toErrorList(errorSchema)` has changed as follows: | ||
|
|
||
| ```tsx | ||
| // version 4 result | ||
| [ | ||
| { stack: "root: error message 1" }, | ||
| { stack: "password: passwords do not match" } | ||
| ] | ||
|
|
||
| // version 5 result | ||
| [ | ||
| { property: ".", message: "error message 1", stack: ". error message 1" }, | ||
| { property: ".password", message: "passwords do not match", stack: ".password passwords do not match" } | ||
| ] | ||
| ``` | ||
|
|
||
| ##### Custom validation and extraErrors | ||
| In previous versions, when using a custom validator on the `Form`, any errors that were generated were inconsistently inserted into the validations `errors` list. | ||
| In addition, there was an [issue](https://github.com/rjsf-team/react-jsonschema-form/issues/1596) with the additional AJV error information besides the `stack` being lost when custom validation generated errors, which has been fixed. | ||
| Also, when `extraErrors` were provided, they were being inconsistently inserted into the `errors` list and the additional AJV error information besides the `stack` was also lost. | ||
| In version 5, all of these errors will be consistently appended onto the end of the validation `errors` list, and the additional AJV error information is maintained. | ||
|
|
||
| In other words, if custom validation or `extraErrors` produced the following `ErrorSchema`: | ||
|
|
||
| ```tsx | ||
| { | ||
| __error: [ "Please correct your password"], | ||
| password2: { __error: "passwords do not match" } | ||
| } | ||
| ``` | ||
|
|
||
| And the AJV validation produced the following `ErrorSchema`: | ||
|
|
||
| ```tsx | ||
| { | ||
| __error: [{ | ||
| message: "should NOT be shorter than 3 characters", | ||
| name: "minLength", | ||
| params: { limit: 3 }, | ||
| property: ".password2", | ||
| schemaPath: "#/properties/password2/minLength", | ||
| stack: ".password2 should NOT be shorter than 3 characters", | ||
| }] | ||
| } | ||
| ``` | ||
|
|
||
| The resulting `errors` list has changed as follows: | ||
|
|
||
| ```tsx | ||
| // version 4 | ||
| [ | ||
| { stack: "root: Please correct your password" }, | ||
| { stack: "password2: passwords do not match" }, | ||
| { stack: "password2: should NOT be shorter than 3 characters" } | ||
| ] | ||
|
|
||
| // version 5 | ||
| [ | ||
| { | ||
| message: "should NOT be shorter than 3 characters", | ||
| name: "minLength", | ||
| params: { limit: 3 }, | ||
| property: ".password2", | ||
| schemaPath: "#/properties/password2/minLength", | ||
| stack: ".password2 should NOT be shorter than 3 characters", | ||
| }, | ||
| { property: ".", message: "Please correct your password", stack: ". Please correct your password" }, | ||
| { property: ".", message: "passwords do not match", stack: ".password2 passwords do not match" } | ||
| ] | ||
| ``` | ||
|
|
||
| #### Generate correct ids when arrays are combined with `anyOf`/`oneOf` | ||
|
|
||
| In v4, with arrays inside `anyOf` or `oneOf`, the parent name was not used to generate ids. | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.