feat(ui5-wizard): add getFocusDomRef (#12668)

Author: StefanDimitrov04

packages/fiori/cypress/specs/Wizard.cy.tsx

@@ -633,4 +633,76 @@ describe("Wizard inside Dialog", () => {
             .find("[ui5-responsive-popover]")
             .should("be.visible");
     });
+});
+
+describe("Wizard - getFocusDomRef Method", () => {
+    it("should focus the last focused wizard tab on wizard focus", () => {
+        const onButtonClick = () => {
+            document.getElementById("wizard").focus();
+        }
+        cy.mount(
+            <>
+                <Wizard id="wizard">
+                    <WizardStep icon="sap-icon://product" titleText="Product type">
+                        <MessageStrip>
+                            The Wizard control is supposed to break down large tasks.
+                        </MessageStrip>
+                    </WizardStep>
+                    <WizardStep titleText="Product Information" selected />
+                    <WizardStep titleText="Product Text" />
+                </Wizard>
+                <Button>Dummy Btn</Button>
+                <Button onClick={onButtonClick}>Focus Wizard</Button>
+            </>
+        );
+
+        cy.get("[ui5-wizard]")
+            .shadow()
+            .find("[ui5-wizard-tab]")
+            .eq(2)
+            .realClick();
+
+        cy.get("[ui5-button]")
+            .eq(0)
+            .realClick();
+
+        cy.get("[ui5-button]")
+            .eq(1)
+            .realClick();
+
+        cy.get("[ui5-wizard]")
+            .shadow()
+            .find("[ui5-wizard-tab]")
+            .eq(2)
+            .shadow()
+            .find(".ui5-wiz-step-root")
+            .should("be.focused");
+    });
+
+    it("should focus the first wizard tab if no tab was focused before ", () => {
+        const onButtonClick = () => {
+            document.getElementById("wizard").focus();
+        }
+        cy.mount(
+            <>
+                <Wizard id="wizard">
+                    <WizardStep icon="sap-icon://product" titleText="Product type"></WizardStep>
+                    <WizardStep titleText="Product Information" />
+                    <WizardStep titleText="Product Text" />
+                </Wizard>
+                <Button onClick={onButtonClick}>Focus Wizard</Button>
+            </>
+        );
+
+        cy.get("[ui5-button]")
+            .realClick();
+
+        cy.get("[ui5-wizard]")
+            .shadow()
+            .find("[ui5-wizard-tab]")
+            .eq(0)
+            .shadow()
+            .find(".ui5-wiz-step-root")
+            .should("be.focused");
+    });
 });

packages/fiori/src/Wizard.ts

@@ -694,6 +694,10 @@ class Wizard extends UI5Element {
 		return contentHeight;
 	}
 
+	getFocusDomRef() {
+		return this._itemNavigation._getCurrentItem();
+	}
+
 	getStepAriaLabelText(step: WizardStep, ariaLabel: string) {
 		return Wizard.i18nBundle.getText(WIZARD_STEP_ARIA_LABEL, ariaLabel);
 	}