Skip to content

Fix server-side validation errors as string arrays not being displayed - #11447

Open
shondsouza wants to merge 1 commit into
marmelab:masterfrom
shondsouza:fix/submission-errors-array-messages
Open

shondsouza wants to merge 1 commit into
marmelab:masterfrom
shondsouza:fix/submission-errors-array-messages

Conversation

@shondsouza

Copy link
Copy Markdown

Problem

Many APIs return server-side validation errors as a list of messages per field. Django REST Framework is one example:

{ "errors": { "title": ["The title is too short", "The title must be unique"] } }

setSubmissionErrors treated those lists as <ArrayInput> items and set errors on title.0 and title.1. The title input turned red but showed no message (#8278).

The same function also crashed with TypeError: Cannot convert undefined or null to object when a field's value was null, and crashed when it was undefined. For example, { title: 'Required', body: null } triggers it.

Solution

In setSubmissionErrors:

  • A field that maps to an array of strings now gets a single error on the field itself, with the messages joined by a comma.
  • null and undefined values, and empty arrays, are ignored.
  • Arrays of objects are still treated as <ArrayInput> item errors, as before.

Trade-off: an <ArrayInput> holding scalar items, e.g. tags: ['', 'bad tag'], now gets one combined error on tags instead of one error per item. Mixed arrays (strings and objects) keep the previous behaviour.

How to test

  • New unit tests in setSubmissionErrors.spec.ts. Three of them fail without the fix, including the null crash.
  • New story Form / ServerSideValidationWithMessageArrays and a matching test in Form.spec.tsx.
  • Documented in docs/Validation.md and docs_headless/.../Validation.md.

Closes #8278

APIs such as Django REST Framework return a list of messages per field. setSubmissionErrors treated those lists as ArrayInput items, so the input turned red without showing any text. Null or undefined values also made it crash. Closes marmelab#8278.

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Form inputs do not display associated list of errors

1 participant