Closed Holger-Mayer closed 2 months ago
Thank you @Holger-Mayer for this precise comparison between the backend and the frontend. And the fix. This is a great job. I'm aware to add some missing pattern rules to the OpenAPI specification. With @alexandre-touret we could create an issue.
Thanks again @Holger-Mayer for your PR. Don't hesitate to submit other enhancements. You are most welcome
Align validation rules of add and edit forms to Rest OpenAPI validation rules
The pet clinic rest api defines validation rules for component properties (see here).
The pet clinic angular application defines validation rules for fields (bound to the previously cited component properties) within the angular components \-add.component.html and \-edit.component.html files.
Currently, there is a lack of alignment among these. Some definitions in the angular application are different, and some are not defined at all.
Overview
The following tables document the situation before this change
Field is the name of the openAPI component property Rule is the kind of rule enforced openAPI is the validation rule value openAPI enforces Angular Add is the validation rule the Angluar front end enforces in add functionality Angular Edit is the validation rule then Angular front end enforces in the edit functionality
Specialty
Owner
Pet
Vet
Visit
PetType
User
User is currently not implemented in the angular front end.
NA - not applicable
Role
Role is currently not implemented in the angular front end.
NA - not applicable
Note
An anomaly is defined within the openAPI validation.
We define some fields with a minimal length but we do not have a pattern validation rule defined. This enables the user of the api to define i.e. names with all blank characters. Here in the future, the openApi description should define pattern validation rules.
In the meantime, it is assumed, that any required name field with a length > 0 may not start with a character other than [A-za-z]. This is implemented in this pull request.
What did change?
The input field requirement rules are adjusted in the add-component.html or edit.component.html files so that they follow the openAPI rules with one exception.
Where names are defined the leading character must be a letter or digit so that all spaces names are not allowed. The rule used here is pattern="\^[A-Za-z0-9].{0,N}$ with N the maxlength - 1;
Example
From
to
Then the help block for the fields are adjusted
Example From
To
And finally, the validation state enables the add/save button.
Example
From
To
Extra
The specialty add function displayed error messages in the wrong color (grey insted of red).The reason was a missing definition.
[class.has-success]="specialityName.dirty && specialityName.valid" [class.has-error]="specialityName.dirty && !specialityName.valid"
This was corrected in the file specialty-add.component.html too.