From 02ef4b0949c3e6a0fb533ddcb413f99d68719c3d Mon Sep 17 00:00:00 2001 From: Simon Steinbeiss Date: Wed, 10 Dec 2025 14:05:07 +0100 Subject: [PATCH] fix(Wizard): Fix crash in nav when first sub-step is hidden Update logic to focus on the first visible sub-step when navigating from a parent step. --- .../components/Wizard/WizardNavInternal.tsx | 6 +-- .../Wizard/__tests__/Wizard.test.tsx | 39 +++++++++++++++++++ 2 files changed, 42 insertions(+), 3 deletions(-) diff --git a/packages/react-core/src/components/Wizard/WizardNavInternal.tsx b/packages/react-core/src/components/Wizard/WizardNavInternal.tsx index 3ac47570b1c..b94d0f7ec57 100644 --- a/packages/react-core/src/components/Wizard/WizardNavInternal.tsx +++ b/packages/react-core/src/components/Wizard/WizardNavInternal.tsx @@ -48,7 +48,7 @@ export const WizardNavInternal = ({ let firstSubStepIndex: number; let hasActiveChild = false; - const subNavItems = step.subStepIds?.map((subStepId, subStepIndex) => { + const subNavItems = step.subStepIds?.map((subStepId, _subStepIndex) => { const subStep = steps.find((step) => step.id === subStepId); const hasVisitedNextStep = steps.some((step) => step.index > subStep.index && step.isVisited); const isSubStepDisabled = @@ -66,8 +66,8 @@ export const WizardNavInternal = ({ return; } - // Store the first sub-step index so that when its parent is clicked, the first sub-step is focused - if (subStepIndex === 0) { + // Store the first visible sub-step index so that when its parent is clicked, the first sub-step is focused + if (firstSubStepIndex === undefined) { firstSubStepIndex = subStep.index; } diff --git a/packages/react-core/src/components/Wizard/__tests__/Wizard.test.tsx b/packages/react-core/src/components/Wizard/__tests__/Wizard.test.tsx index 49780e335bd..f421a173571 100644 --- a/packages/react-core/src/components/Wizard/__tests__/Wizard.test.tsx +++ b/packages/react-core/src/components/Wizard/__tests__/Wizard.test.tsx @@ -627,3 +627,42 @@ test('onStepChange skips over disabled or hidden steps and substeps', async () = WizardStepChangeScope.Back ); }); + +test('clicking parent step navigates to first visible sub-step when first sub-step is hidden', async () => { + const user = userEvent.setup(); + const onStepChange = jest.fn(); + + render( + + + , + , + + ]} + /> + + + ); + + // Navigate to step 3 first + await user.click(screen.getByRole('button', { name: 'Test step 3' })); + expect(onStepChange).toHaveBeenCalledWith( + null, + expect.objectContaining({ id: 'step-3' }), + expect.objectContaining({ id: 'step-1' }), + WizardStepChangeScope.Nav + ); + + // Click on parent step 2 - should navigate to the first VISIBLE sub-step (step2-sub2), not crash + await user.click(screen.getByRole('button', { name: 'Test step 2' })); + expect(onStepChange).toHaveBeenCalledWith( + null, + expect.objectContaining({ id: 'step2-sub2' }), + expect.objectContaining({ id: 'step-3' }), + WizardStepChangeScope.Nav + ); +});