diff --git a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/wizard/v1/wizard/clientlibs/site/js/wizardview.js b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/wizard/v1/wizard/clientlibs/site/js/wizardview.js index 43591923cc..1e5d989332 100644 --- a/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/wizard/v1/wizard/clientlibs/site/js/wizardview.js +++ b/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/wizard/v1/wizard/clientlibs/site/js/wizardview.js @@ -61,7 +61,8 @@ constructor(params) { super(params); - const {element} = params; + const {element, formContainer} = params; + this.formContainer = formContainer; this.cacheElements(element); this.setActive(this.getCachedTabs()) this._active = this.getActiveIndex(this.getCachedTabs()); @@ -232,6 +233,8 @@ if (tabs && nextVisibleIndex >= 0) { this.#navigateAndFocusTab(nextVisibleIndex); } + } else { + this.formContainer.setFocus(validationErrorList[0].fieldName); } this.#hideUnhideNavButtons(this._active); } diff --git a/ui.tests/test-module/specs/wizard/wizard.runtime.cy.js b/ui.tests/test-module/specs/wizard/wizard.runtime.cy.js index 3e9dfdae42..140e8aa497 100644 --- a/ui.tests/test-module/specs/wizard/wizard.runtime.cy.js +++ b/ui.tests/test-module/specs/wizard/wizard.runtime.cy.js @@ -223,6 +223,20 @@ describe("Form with Wizard Layout Container With Validation", () => { }) }) }); + + it("should stay on current tab and show validation errors when next is clicked with invalid fields", () => { + getTabs().should('have.length', 5); + getWizardPanels().should('have.length', 5); + getTabAtIndex(0).should('have.class', 'cmp-adaptiveform-wizard__tab--active'); + getWizardPanelAtIndex(0).should('have.class', 'cmp-adaptiveform-wizard__wizardpanel--active'); + + getNextButton().click({force: true}).then(() => { + getTabAtIndex(0).should('have.class', 'cmp-adaptiveform-wizard__tab--active'); + getWizardPanelAtIndex(0).should('have.class', 'cmp-adaptiveform-wizard__wizardpanel--active'); + getWizardPanelAtIndex(0).find('.cmp-adaptiveform-numberinput__errormessage').should('be.visible'); + getWizardPanelAtIndex(0).find('.cmp-adaptiveform-datepicker__errormessage').should('be.visible'); + }); + }); }); describe("Form with Wizard Layout Container with focus", () => {