From 1c220bbddf3558332aa8668df9c103ef1a83dc43 Mon Sep 17 00:00:00 2001
From: Titani <tlabaj@redaht.com>
Date: Tue, 3 May 2022 14:28:18 -0400
Subject: [PATCH 1/2] fix(Wixard): Fixed id not being applied to wizard step

---
 packages/react-core/src/components/Wizard/Wizard.tsx        | 3 +++
 packages/react-core/src/components/Wizard/WizardNavItem.tsx | 4 ++++
 2 files changed, 7 insertions(+)

diff --git a/packages/react-core/src/components/Wizard/Wizard.tsx b/packages/react-core/src/components/Wizard/Wizard.tsx
index 9e8c4cc3947..c66fe552b26 100644
--- a/packages/react-core/src/components/Wizard/Wizard.tsx
+++ b/packages/react-core/src/components/Wizard/Wizard.tsx
@@ -381,6 +381,7 @@ export class Wizard extends React.Component<WizardProps, WizardState> {
               return (
                 <WizardNavItem
                   key={index}
+                  id={step.id}
                   content={step.name}
                   isExpandable={isNavExpandable}
                   isCurrent={hasActiveChild}
@@ -399,6 +400,7 @@ export class Wizard extends React.Component<WizardProps, WizardState> {
                       return (
                         <WizardNavItem
                           key={`child_${indexChild}`}
+                          id={childStep.id}
                           content={childStep.name}
                           isCurrent={activeStep.name === childStep.name}
                           isDisabled={!enabled}
@@ -417,6 +419,7 @@ export class Wizard extends React.Component<WizardProps, WizardState> {
               <WizardNavItem
                 {...step.stepNavItemProps}
                 key={index}
+                id={step.id}
                 content={step.name}
                 isCurrent={activeStep.name === step.name}
                 isDisabled={!enabled}
diff --git a/packages/react-core/src/components/Wizard/WizardNavItem.tsx b/packages/react-core/src/components/Wizard/WizardNavItem.tsx
index a1fa07bf656..311f4a545bf 100644
--- a/packages/react-core/src/components/Wizard/WizardNavItem.tsx
+++ b/packages/react-core/src/components/Wizard/WizardNavItem.tsx
@@ -22,6 +22,8 @@ export interface WizardNavItemProps {
   href?: string;
   /** Flag indicating that this NavItem has child steps and is expandable */
   isExpandable?: boolean;
+  /** The id for the nav item */
+  id?: string | number;
 }
 
 export const WizardNavItem: React.FunctionComponent<WizardNavItemProps> = ({
@@ -34,6 +36,7 @@ export const WizardNavItem: React.FunctionComponent<WizardNavItemProps> = ({
   navItemComponent = 'button',
   href = null,
   isExpandable = false,
+  id,
   ...rest
 }: WizardNavItemProps) => {
   const NavItemComponent = navItemComponent;
@@ -69,6 +72,7 @@ export const WizardNavItem: React.FunctionComponent<WizardNavItemProps> = ({
       <NavItemComponent
         {...rest}
         {...(navItemComponent === 'a' ? { ...linkProps } : { ...btnProps })}
+        {...(id && { id: id.toString() })}
         onClick={() => (isExpandable ? setIsExpanded(!isExpanded || isCurrent) : onNavItemClick(step))}
         className={css(
           styles.wizardNavLink,

From 42c6aa9ec672b02182f9b0db7df588dda381161b Mon Sep 17 00:00:00 2001
From: Titani <tlabaj@redaht.com>
Date: Thu, 5 May 2022 15:02:13 -0400
Subject: [PATCH 2/2] add id to tests

---
 .../src/components/Wizard/__tests__/Wizard.test.tsx      | 9 ++++++---
 .../Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap  | 6 ++++++
 2 files changed, 12 insertions(+), 3 deletions(-)

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 991e9ad7841..c4d537993ac 100644
--- a/packages/react-core/src/components/Wizard/__tests__/Wizard.test.tsx
+++ b/packages/react-core/src/components/Wizard/__tests__/Wizard.test.tsx
@@ -5,24 +5,27 @@ import { Wizard, WizardStepFunctionType, WizardStep } from '../Wizard';
 describe('Wizard', () => {
   test('Wizard should match snapshot', () => {
     const steps: WizardStep[] = [
-      { name: 'A', component: <p>Step 1</p> },
+      { name: 'A', id: "step-A", component: <p>Step 1</p> },
       {
         name: 'B',
+        id: "step-B",
         steps: [
           {
             name: 'B-1',
+            id: "step-B-1",
             component: <p>Step 2</p>,
             enableNext: true
           },
           {
             name: 'B-2',
+            id: "step-B-2",
             component: <p>Step 3</p>,
             enableNext: false
           }
         ]
       },
-      { name: 'C', component: <p>Step 4</p> },
-      { name: 'D', component: <p>Step 5</p> }
+      { name: 'C', id: "step-C", component: <p>Step 4</p> },
+      { name: 'D', id: "step-D", component: <p>Step 5</p> }
     ];
     const onBack: WizardStepFunctionType = step => {
       // eslint-disable-next-line @typescript-eslint/no-unused-vars
diff --git a/packages/react-core/src/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap b/packages/react-core/src/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap
index 2978eef8191..9a9672aed93 100644
--- a/packages/react-core/src/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap
+++ b/packages/react-core/src/components/Wizard/__tests__/__snapshots__/Wizard.test.tsx.snap
@@ -351,6 +351,7 @@ exports[`Wizard Wizard should match snapshot 1`] = `
               <button
                 aria-current="step"
                 class="pf-c-wizard__nav-link pf-m-current"
+                id="step-A"
               >
                 A
               </button>
@@ -361,6 +362,7 @@ exports[`Wizard Wizard should match snapshot 1`] = `
               <button
                 aria-current="false"
                 class="pf-c-wizard__nav-link"
+                id="step-B"
               >
                 B
               </button>
@@ -373,6 +375,7 @@ exports[`Wizard Wizard should match snapshot 1`] = `
                   <button
                     aria-current="false"
                     class="pf-c-wizard__nav-link"
+                    id="step-B-1"
                   >
                     B-1
                   </button>
@@ -383,6 +386,7 @@ exports[`Wizard Wizard should match snapshot 1`] = `
                   <button
                     aria-current="false"
                     class="pf-c-wizard__nav-link"
+                    id="step-B-2"
                   >
                     B-2
                   </button>
@@ -395,6 +399,7 @@ exports[`Wizard Wizard should match snapshot 1`] = `
               <button
                 aria-current="false"
                 class="pf-c-wizard__nav-link"
+                id="step-C"
               >
                 C
               </button>
@@ -405,6 +410,7 @@ exports[`Wizard Wizard should match snapshot 1`] = `
               <button
                 aria-current="false"
                 class="pf-c-wizard__nav-link"
+                id="step-D"
               >
                 D
               </button>