kylefang/react
1
0
Fork 0
mirror of https://github.com/zhigang1992/react.git synced 2026-01-31 22:41:29 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #308 from yqrashawn/tab-role

Browse Source 
fix(tabs): add role="button" to tab for a11y
This commit is contained in:
witt
2020-07-02 20:38:38 +08:00
committed by GitHub
parent c51e158b54 f28a6078ec
commit eaada29cac
2 changed files with 3 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
components/tabs/__tests__/__snapshots__/index.test.tsx.snap
View File

@@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Tabs should render correctly 1`] = `
"<div class=\\"tabs \\"><header class=\\"\\"><div class=\\"tab \\">label1</div><div class=\\"tab \\">label2</div></header><div class=\\"content\\"></div><style>
"<div class=\\"tabs \\"><header class=\\"\\"><div class=\\"tab \\" role=\\"button\\">label1</div><div class=\\"tab \\" role=\\"button\\">label2</div></header><div class=\\"content\\"></div><style>
.tabs {
width: initial;
}
@@ -76,7 +76,7 @@ exports[`Tabs should render correctly 1`] = `
`;
exports[`Tabs should work correctly with different styles 1`] = `
"<div class=\\"tabs \\"><header class=\\"hide-divider\\"><div class=\\"tab \\">label1</div></header><div class=\\"content\\"></div><style>
"<div class=\\"tabs \\"><header class=\\"hide-divider\\"><div class=\\"tab \\" role=\\"button\\">label1</div></header><div class=\\"content\\"></div><style>
.tabs {
width: initial;
}

1
components/tabs/tabs.tsx
View File

@@ -76,6 +76,7 @@ const Tabs: React.FC<React.PropsWithChildren<TabsProps>> = ({
className={`tab ${selfValue === item.value ? 'active' : ''} ${
item.disabled ? 'disabled' : ''
}`}
role="button"
key={item.value + index}
onClick={() => clickHandler(item)}>
{item.label}