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.

Sign up for GitHub

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

Jump to bottom

Bug 1908296: Fix pipeline builder form yaml switcher validation issue #7565

Merged
merged 1 commit into from Jan 12, 2021
Merged

Bug 1908296: Fix pipeline builder form yaml switcher validation issue #7565

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
9 changes: 9 additions & 0 deletions ...ckages/pipelines-plugin/src/components/pipelines/pipeline-builder/PipelineBuilderForm.tsx
View file
Open in desktop
Expand Up @@ -52,10 +52,19 @@ const PipelineBuilderForm: React.FC<PipelineBuilderFormProps> = (props) => {
setFieldValue,
setStatus,
values,
validateForm,
} = props;
const statusRef = React.useRef(status);
statusRef.current = status;

React.useEffect(() => {
if (values.editorType === EditorType.Form) {
// Force validation against the new data that was adjusted in the YAML
// Formik isn't properly handling the immediate state of the form values during the cycle of the editorType
setTimeout(() => validateForm(), 0);
}
}, [values.editorType, validateForm]);
Comment on lines +60 to +66
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why not use useFormikValidationFix hook here? It does a similar hack.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I tried using this hook, but unfortunately it doesn't work. with pipeline builder form component, validation happens before the task is preselected, so the above code is to validate the form right after all the new changes are in place, thus setTimeout is used.


const updateErrors: UpdateErrors = React.useCallback(
(taskErrors) => {
if (taskErrors) {
Expand Down