Merge pull request #1377 from navikt/bugfix-summary-validation

Bugfix summary validation
navikt · Dec 13, 2024 · e5a4873 · e5a4873
2 parents 0546c3d + dcdf710
commit e5a4873
Show file tree

Hide file tree

Showing 12 changed files with 65 additions and 26 deletions.
diff --git a/packages/bygger/src/formio/builder/WebformBuilder.tsx b/packages/bygger/src/formio/builder/WebformBuilder.tsx
@@ -56,8 +56,6 @@ class WebformBuilder extends NavFormioJs.Builders.builders.webform {
 
     super.editComponent(component, parent, isNew, isJsonEdit, original, flags);
 
-    this.editForm.editFormDialog = true;
-
     if (isJsonEdit) {
       this.editForm.form = {
         ...this.editForm.form,
@@ -90,6 +88,23 @@ class WebformBuilder extends NavFormioJs.Builders.builders.webform {
         NavFormioJs.Components.components[component.type],
       );
     }
+
+    const saveButtons = this.componentEdit.querySelectorAll('[ref="saveButton"]');
+    saveButtons.forEach((saveButton) => {
+      this.editForm.removeEventListener(saveButton, 'click');
+      this.editForm.addEventListener(saveButton, 'click', (event) => {
+        event.preventDefault();
+        // Need to set editFormDialogSaveClicked, to not trigger any error messages before user have tried to save.
+        this.editForm.editFormDialogSaveClicked = true;
+        if (!this.editForm.checkValidity(this.editForm.data, true, this.editForm.data)) {
+          this.editForm.setPristine(false);
+          this.editForm.showErrors();
+          return false;
+        }
+        this.saved = true;
+        this.saveComponent(component, parent, isNew, original);
+      });
+    });
   }
 
   destroy(...args) {

diff --git a/packages/bygger/src/formio/builder/WizardBuilder.tsx b/packages/bygger/src/formio/builder/WizardBuilder.tsx
@@ -87,8 +87,6 @@ class WizardBuilder extends NavFormioJs.Builders.builders.wizard {
 
     super.editComponent(component, parent, isNew, isJsonEdit, original, flags);
 
-    this.editForm.editFormDialog = true;
-
     if (isJsonEdit) {
       this.editForm.form = {
         ...this.editForm.form,

diff --git a/packages/fyllut/cypress/e2e/components/driving-list.cy.ts b/packages/fyllut/cypress/e2e/components/driving-list.cy.ts
@@ -324,5 +324,17 @@ describe('DrivingList', () => {
           cy.findByRole('link', { name: `Du må fylle ut: ${ACTIVITIES_LABEL}` }).should('exist');
         });
     });
+
+    it('should render alert when there are no activities and the user go directly to summary page url', () => {
+      cy.mocksUseRouteVariant('get-activities:success-empty');
+      cy.visit(`/fyllut/testdrivinglist/oppsummering?sub=digital&innsendingsId=a66e8932-ce2a-41c1-932b-716fc487813b`);
+      cy.defaultWaits();
+      cy.wait('@getMellomlagring');
+
+      cy.get('.navds-alert').should('exist');
+
+      cy.findAllByRole('link', { name: 'Fortsett utfylling' }).should('have.length', 2);
+      cy.findByRole('link', { name: 'Send til Nav' }).should('not.exist');
+    });
   });
 });
diff --git a/packages/fyllut/cypress/e2e/form/focus-handling.cy.ts b/packages/fyllut/cypress/e2e/form/focus-handling.cy.ts
@@ -119,7 +119,8 @@ describe('Focus handling', () => {
       cy.get('[data-cy=error-summary]')
         .should('exist')
         .within(() => {
-          cy.findByRole('link', { name: 'Du må fylle ut: Hvilken type bolig bor du i?' }).should('exist').click();
+          cy.findByRole('link', { name: 'Du må fylle ut: Hvilken type bolig bor du i?' }).should('exist');
+          cy.findByRole('link', { name: 'Du må fylle ut: Hvilken type bolig bor du i?' }).click();
         });
 
       cy.findByRole('group', { name: 'Hvilken type bolig bor du i?' })
@@ -133,7 +134,8 @@ describe('Focus handling', () => {
       cy.get('[data-cy=error-summary]')
         .should('exist')
         .within(() => {
-          cy.findByRole('link', { name: 'Du må fylle ut: Mottakers fornavn' }).should('exist').click();
+          cy.findByRole('link', { name: 'Du må fylle ut: Mottakers fornavn' }).should('exist');
+          cy.findByRole('link', { name: 'Du må fylle ut: Mottakers fornavn' }).click();
         });
       cy.findByRole('textbox', { name: 'Mottakers fornavn' }).should('have.focus').type('Max');
 

diff --git a/packages/shared-components/src/formio/components/base/BaseComponent.ts b/packages/shared-components/src/formio/components/base/BaseComponent.ts
@@ -190,15 +190,15 @@ class BaseComponent extends FormioReactComponent {
   }
 
   hasPrefill(): boolean {
-    return (this.isSubmissionDigital() && !!this.component?.prefillKey && !!this.component?.prefillValue) ?? false;
+    return (this.isSubmissionDigital() && !!this.component?.prefillKey) ?? false;
   }
 
   /**
    * elementId is used to focus to the correct element when clicking on error summary
    * Message is the error message that is shown in the error summary
    */
   addError(message: string, elementId?: string) {
-    if (this.showErrorMessages()) {
+    if (message && this.showErrorMessages()) {
       this.logger.debug('addError', { errorMessage: message });
       this.componentErrors.push(this.createError(message, elementId));
     }
@@ -226,6 +226,16 @@ class BaseComponent extends FormioReactComponent {
     this.rerender();
   }
 
+  setComponentValidity(messages, dirty, silentCheck) {
+    if (messages.length && (!silentCheck || this.error) && this.showErrorMessages()) {
+      this.setCustomValidity(messages, dirty);
+    } else {
+      this.setCustomValidity('');
+    }
+
+    return this.componentErrors.length === 0;
+  }
+
   createError(message: string, elementId?: string): ComponentError {
     return {
       message,
@@ -255,7 +265,10 @@ class BaseComponent extends FormioReactComponent {
    */
   showErrorMessages() {
     return (
-      this.root.currentPage?.nextPageClicked || this.root.submitted || this.builderMode || this.root.editFormDialog
+      (this.root.currentPage?.nextPageClicked && baseComponentUtils.isOnCurrentPage(this)) ||
+      this.root.submitted ||
+      this.builderMode ||
+      this.root.editFormDialogSaveClicked
     );
   }
 }

diff --git a/packages/shared-components/src/formio/components/base/baseComponentUtils.ts b/packages/shared-components/src/formio/components/base/baseComponentUtils.ts
@@ -35,12 +35,25 @@ const isReadOnly = (component?: Component, options?: ReactComponentType['options
   );
 };
 
+const getParentPanel = (component: ReactComponentType) => {
+  if (!component.parent) {
+    return;
+  }
+
+  return component.parent?.type === 'components' ? component.parent : getParentPanel(component.parent);
+};
+
+const isOnCurrentPage = (component: ReactComponentType) => {
+  return component.root.currentPage?.id === getParentPanel(component)?.id;
+};
+
 const baseComponentUtils = {
   getId,
   getLabel,
   getHideLabel,
   getEditFields,
   isRequired,
   isReadOnly,
+  isOnCurrentPage,
 };
 export default baseComponentUtils;
diff --git a/packages/shared-components/src/formio/components/base/index.d.ts b/packages/shared-components/src/formio/components/base/index.d.ts
@@ -76,6 +76,8 @@ interface ReactComponentType {
   labelIsHidden(): boolean;
   setCustomValidity(messages: string | string[] | ComponentError[], dirty?: boolean, external?: boolean): void;
   isEmpty(value?: any): boolean;
+  parent?: ReactComponentType;
+  type: string;
   // Element
   id?: any;
   emit(event: string, data: object): void;

diff --git a/packages/shared-components/src/formio/components/core/activities/Activities.tsx b/packages/shared-components/src/formio/components/core/activities/Activities.tsx
@@ -35,10 +35,6 @@ class Activities extends BaseComponent {
     return activitiesBuilder();
   }
 
-  override get errors() {
-    return this.componentErrors;
-  }
-
   override getError(): string | undefined {
     const error = this.componentErrors[0];
     if (error) return error.message;

diff --git a/packages/shared-components/src/formio/components/core/address/Address.tsx b/packages/shared-components/src/formio/components/core/address/Address.tsx
@@ -126,7 +126,7 @@ class Address extends BaseComponent {
   }
 
   getReadOnly(): boolean {
-    return !!this.component?.prefillKey && this.isSubmissionDigital();
+    return this.hasPrefill() || super.getReadOnly();
   }
 
   showAddressTypeChoice(): boolean {

diff --git a/packages/shared-components/src/formio/components/core/monthpicker/MonthPicker.tsx b/packages/shared-components/src/formio/components/core/monthpicker/MonthPicker.tsx
@@ -32,10 +32,6 @@ class MonthPicker extends BaseComponent {
     this.rerender();
   }
 
-  override get errors() {
-    return this.componentErrors;
-  }
-
   override checkValidity(data?: SubmissionData, dirty?: boolean, row?: SubmissionData): boolean {
     this.removeAllErrors();
 

diff --git a/...shared-components/src/formio/components/extensions/address-validitity/AddressValidity.tsx b/...shared-components/src/formio/components/extensions/address-validitity/AddressValidity.tsx
@@ -26,10 +26,6 @@ export default class AddressValidity extends BaseComponent {
     return addressValidityBuilder();
   }
 
-  get errors() {
-    return this.componentErrors;
-  }
-
   checkValidity(data, dirty, row) {
     this.removeAllErrors();
 

diff --git a/packages/shared-components/src/formio/components/extensions/identity/Identity.tsx b/packages/shared-components/src/formio/components/extensions/identity/Identity.tsx
@@ -53,10 +53,6 @@ export default class Identity extends BaseComponent {
     return this.hasPrefill() || super.getReadOnly();
   }
 
-  get errors() {
-    return this.componentErrors;
-  }
-
   checkValidity(data, dirty, row) {
     this.removeAllErrors();