diff --git a/src/components/ButtonTabs/ButtonTabs.tsx b/src/components/ButtonTabs/ButtonTabs.tsx index 4413664d3..480c8b047 100644 --- a/src/components/ButtonTabs/ButtonTabs.tsx +++ b/src/components/ButtonTabs/ButtonTabs.tsx @@ -53,7 +53,7 @@ const ButtonTabs: React.FC = ({ ); return ( -
+
{items.map(({id, title}) => { const isActive = id === activeTabId; @@ -65,7 +65,8 @@ const ButtonTabs: React.FC = ({ size={tabSize} onClick={handleClick(id)} extraProps={{ - 'aria-current': isActive || undefined, + role: 'tab', + 'aria-selected': isActive, }} /> ); diff --git a/src/components/ButtonTabs/__tests__/ButtonTabs.test.tsx b/src/components/ButtonTabs/__tests__/ButtonTabs.test.tsx index 0221df9c7..4c3f219fe 100644 --- a/src/components/ButtonTabs/__tests__/ButtonTabs.test.tsx +++ b/src/components/ButtonTabs/__tests__/ButtonTabs.test.tsx @@ -36,7 +36,7 @@ describe('ButtonTabs', () => { test('has active tab', async () => { const activeTabId = 1; render(); - const buttons = screen.getAllByRole('button'); + const buttons = screen.getAllByRole('tab'); buttons.forEach((button, index) => { if (index === activeTabId) { @@ -59,7 +59,7 @@ describe('ButtonTabs', () => { const handleOnClick = jest.fn(); render(); - const buttons = screen.getAllByRole('button'); + const buttons = screen.getAllByRole('tab'); buttons.forEach(async (button, i) => { await user.click(button);