Fix(web-react): Add missing presentation role to TabItem #DS-1653

lmc-eu · Jan 23, 2025 · 66a901b · 66a901b
1 parent f25d377
commit 66a901b
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 1 deletion.
diff --git a/packages/web-react/src/components/Tabs/TabItem.tsx b/packages/web-react/src/components/Tabs/TabItem.tsx
@@ -25,7 +25,7 @@ const TabItem = ({ children, forTabPane, onClick, ...restProps }: TabItemProps):
   };
 
   return (
-    <li className={classProps.item}>
+    <li className={classProps.item} role="presentation">
       <button
         {...transferProps}
         {...styleProps}

diff --git a/packages/web-react/src/components/Tabs/__tests__/TabItem.test.tsx b/packages/web-react/src/components/Tabs/__tests__/TabItem.test.tsx
@@ -11,6 +11,14 @@ describe('TabItem', () => {
 
   restPropsTest((props) => <TabItem forTabPane={0} {...props} />, 'button');
 
+  it('should render list item', () => {
+    render(<TabItem forTabPane={0} />);
+
+    const element = screen.getByRole('presentation');
+
+    expect(element).toHaveClass('Tabs__item');
+  });
+
   it('should render button tag when there is no href prop', () => {
     render(<TabItem forTabPane={0} />);