Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[NO QA] revert changes from PRs 23306/23780 #24347

Merged
merged 1 commit into from
Aug 10, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion contributingGuides/FORMS.md
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@ Form inputs will NOT store draft values by default. This is to avoid accidentall

### Validate on Blur, on Change and Submit

Each individual form field that requires validation will have its own validate test defined. When the form field loses focus (blur) we will run that validate test and show feedback. A blur on one field will not cause other fields to validate or show errors unless they have already been blurred. To prevent server errors from being cleared inadvertently, we only run validation on blur if any form data has changed since the last validation/submit.
Each individual form field that requires validation will have its own validate test defined. When the form field loses focus (blur) we will run that validate test and show feedback. A blur on one field will not cause other fields to validate or show errors unless they have already been blurred.

Once a user has “touched” an input, i.e. blurred the input, we will also start validating that input on change when the user goes back to editing it.

Expand Down
14 changes: 1 addition & 13 deletions src/components/Form.js
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,6 @@ function Form(props) {
const inputRefs = useRef({});
const touchedInputs = useRef({});
const isFirstRender = useRef(true);
const lastValidatedValues = useRef({...props.draftValues});

const {validate, onSubmit, children} = props;

Expand Down Expand Up @@ -148,11 +147,6 @@ function Form(props) {
setErrors(touchedInputErrors);
}

const isAtLeastOneInputTouched = _.keys(touchedInputs.current).length > 0;
if (isAtLeastOneInputTouched) {
lastValidatedValues.current = values;
}

return touchedInputErrors;
},
[errors, touchedInputs, props.formID, validate],
Expand Down Expand Up @@ -312,12 +306,7 @@ function Form(props) {
// web and mobile web platforms.
setTimeout(() => {
setTouchedInput(inputID);

// To prevent server errors from being cleared inadvertently, we only run validation on blur if any form values have changed since the last validation/submit
const shouldValidate = !_.isEqual(inputValues, lastValidatedValues.current);
if (shouldValidate) {
onValidate(inputValues);
}
onValidate(inputValues);
}, 200);
}

Expand Down Expand Up @@ -429,7 +418,6 @@ function Form(props) {

delete inputRefs.current[inputID];
delete touchedInputs.current[inputID];
delete lastValidatedValues.current[inputID];

setInputValues((prevState) => {
const copyPrevState = _.clone(prevState);
Expand Down