From dedd30d4f5efbefa88755cd7ef8580f66b447a62 Mon Sep 17 00:00:00 2001
From: Lukas Harbarth <lukas.harbarth@sap.com>
Date: Wed, 12 Mar 2025 09:30:07 +0100
Subject: [PATCH] fix(AnalyticalTable): fix focus behavior when tabbing

---
 .../AnalyticalTable/AnalyticalTable.cy.tsx        | 15 ++++++++++-----
 .../TableBody/VirtualTableBodyContainer.tsx       |  1 +
 .../scrollbars/VerticalScrollbar.tsx              |  1 +
 3 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/packages/main/src/components/AnalyticalTable/AnalyticalTable.cy.tsx b/packages/main/src/components/AnalyticalTable/AnalyticalTable.cy.tsx
index 2720435c33e..b4efa40d696 100644
--- a/packages/main/src/components/AnalyticalTable/AnalyticalTable.cy.tsx
+++ b/packages/main/src/components/AnalyticalTable/AnalyticalTable.cy.tsx
@@ -3013,17 +3013,22 @@ describe('AnalyticalTable', () => {
     cy.focused().parent().should('have.attr', 'ui5-button');
 
     cy.mount(
-      <AnalyticalTable
-        data={generateMoreData(50)}
-        columns={columns}
-        selectionMode={AnalyticalTableSelectionMode.Multiple}
-      />
+      <>
+        <AnalyticalTable
+          data={generateMoreData(50)}
+          columns={columns}
+          selectionMode={AnalyticalTableSelectionMode.Multiple}
+        />
+        <button>Interactive Element</button>
+      </>
     );
 
     cy.findByText('Name-0').should('be.visible');
     cy.window().focus();
     cy.realPress('Tab');
     cy.focused().should('have.attr', 'data-row-index', '0').should('have.attr', 'data-column-index', '1');
+    cy.realPress('Tab');
+    cy.focused().should('have.text', 'Interactive Element');
 
     cy.mount(
       <AnalyticalTable
diff --git a/packages/main/src/components/AnalyticalTable/TableBody/VirtualTableBodyContainer.tsx b/packages/main/src/components/AnalyticalTable/TableBody/VirtualTableBodyContainer.tsx
index e3db971e91c..27be1be27d7 100644
--- a/packages/main/src/components/AnalyticalTable/TableBody/VirtualTableBodyContainer.tsx
+++ b/packages/main/src/components/AnalyticalTable/TableBody/VirtualTableBodyContainer.tsx
@@ -122,6 +122,7 @@ export const VirtualTableBodyContainer = (props: VirtualTableBodyContainerProps)
         width: `${totalColumnsWidth}px`
       }}
       data-component-name="AnalyticalTableBody"
+      tabIndex={-1}
     >
       {isMounted && children}
     </div>
diff --git a/packages/main/src/components/AnalyticalTable/scrollbars/VerticalScrollbar.tsx b/packages/main/src/components/AnalyticalTable/scrollbars/VerticalScrollbar.tsx
index 720143795fa..d6936c2fa0c 100644
--- a/packages/main/src/components/AnalyticalTable/scrollbars/VerticalScrollbar.tsx
+++ b/packages/main/src/components/AnalyticalTable/scrollbars/VerticalScrollbar.tsx
@@ -68,6 +68,7 @@ export const VerticalScrollbar = forwardRef<HTMLDivElement, VerticalScrollbarPro
         onScroll={handleVerticalScrollBarScroll}
         className={clsx(classNames.scrollbar, nativeScrollbar && 'ui5-content-native-scrollbars')}
         data-component-name="AnalyticalTableVerticalScrollbar"
+        tabIndex={-1}
       >
         <div
           ref={scrollElementRef}