diff --git a/src/components/Tab.js b/src/components/Tab.js
index 911966fae1..256070a504 100644
--- a/src/components/Tab.js
+++ b/src/components/Tab.js
@@ -85,6 +85,7 @@ export default class Tab extends Component {
aria-disabled={disabled ? 'true' : 'false'}
aria-controls={panelId}
tabIndex={tabIndex || (selected ? '0' : null)}
+ data-rttab
>
{children}
diff --git a/src/components/UncontrolledTabs.js b/src/components/UncontrolledTabs.js
index 4933a1f53f..ca3cf81f2b 100644
--- a/src/components/UncontrolledTabs.js
+++ b/src/components/UncontrolledTabs.js
@@ -13,7 +13,7 @@ function isNode(node) {
// Determine if a node from event.target is a Tab element
function isTabNode(node) {
- return isNode(node) && node.getAttribute('role') === 'tab';
+ return isNode(node) && node.getAttribute('data-rttab');
}
// Determine if a tab node is disabled
@@ -347,7 +347,7 @@ export default class UncontrolledTabs extends Component {
let nodeAncestor = node.parentElement;
do {
if (nodeAncestor === this.node) return true;
- if (nodeAncestor.getAttribute('data-tabs')) break;
+ if (nodeAncestor.getAttribute('data-rttabs')) break;
nodeAncestor = nodeAncestor.parentElement;
} while (nodeAncestor);
@@ -383,7 +383,7 @@ export default class UncontrolledTabs extends Component {
this.node = node;
if (domRef) domRef(node);
}}
- data-tabs
+ data-rttabs
>
{this.getChildren()}
diff --git a/src/components/__tests__/__snapshots__/Tab-test.js.snap b/src/components/__tests__/__snapshots__/Tab-test.js.snap
index 3e15f72512..f297ca0e3b 100644
--- a/src/components/__tests__/__snapshots__/Tab-test.js.snap
+++ b/src/components/__tests__/__snapshots__/Tab-test.js.snap
@@ -6,6 +6,7 @@ exports[` override the tabIndex if it was provided 1`] = `
aria-disabled="false"
aria-selected="false"
className="react-tabs__tab"
+ data-rttab={true}
id={null}
role="tab"
tabIndex="0"
@@ -20,6 +21,7 @@ exports[` should accept className 1`] = `
aria-disabled="false"
aria-selected="false"
className="foobar"
+ data-rttab={true}
id={null}
role="tab"
tabIndex={null}
@@ -32,6 +34,7 @@ exports[` should allow to be wrapped in higher-order-component 1`] = `
aria-disabled="false"
aria-selected="false"
className="react-tabs__tab"
+ data-rttab={true}
id={null}
role="tab"
tabIndex={null}
@@ -44,6 +47,7 @@ exports[` should have sane defaults 1`] = `
aria-disabled="false"
aria-selected="false"
className="react-tabs__tab"
+ data-rttab={true}
id={null}
role="tab"
tabIndex={null}
@@ -56,6 +60,7 @@ exports[` should not allow overriding all default properties 1`] = `
aria-disabled="false"
aria-selected="false"
className="react-tabs__tab"
+ data-rttab={true}
id={null}
role="tab"
tabIndex={null}
@@ -68,6 +73,7 @@ exports[` should pass through custom properties 1`] = `
aria-disabled="false"
aria-selected="false"
className="react-tabs__tab"
+ data-rttab={true}
data-tooltip="Tooltip contents"
id={null}
role="tab"
@@ -81,6 +87,7 @@ exports[` should support being disabled 1`] = `
aria-disabled="true"
aria-selected="false"
className="react-tabs__tab react-tabs__tab--disabled"
+ data-rttab={true}
id={null}
role="tab"
tabIndex={null}
@@ -93,6 +100,7 @@ exports[` should support being disabled with custom class name 1`] = `
aria-disabled="true"
aria-selected="false"
className="react-tabs__tab coolDisabled"
+ data-rttab={true}
id={null}
role="tab"
tabIndex={null}
@@ -105,6 +113,7 @@ exports[` should support being selected 1`] = `
aria-disabled="false"
aria-selected="true"
className="react-tabs__tab react-tabs__tab--selected"
+ data-rttab={true}
id="abcd"
role="tab"
tabIndex="0"
@@ -119,6 +128,7 @@ exports[` should support being selected with custom class 1`] = `
aria-disabled="false"
aria-selected="true"
className="react-tabs__tab cool"
+ data-rttab={true}
id={null}
role="tab"
tabIndex="0"
diff --git a/src/components/__tests__/__snapshots__/TabList-test.js.snap b/src/components/__tests__/__snapshots__/TabList-test.js.snap
index b6d371ec96..a103c88f7b 100644
--- a/src/components/__tests__/__snapshots__/TabList-test.js.snap
+++ b/src/components/__tests__/__snapshots__/TabList-test.js.snap
@@ -10,7 +10,7 @@ exports[` should accept className 1`] = `
exports[` should allow for higher order components 1`] = `
@@ -23,6 +23,7 @@ exports[`
should allow for higher order components 1`] = `
aria-disabled="false"
aria-selected="true"
className="react-tabs__tab react-tabs__tab--selected"
+ data-rttab={true}
id="react-tabs-12"
role="tab"
tabIndex="0"
@@ -34,6 +35,7 @@ exports[`
should allow for higher order components 1`] = `
aria-disabled="false"
aria-selected="false"
className="react-tabs__tab"
+ data-rttab={true}
id="react-tabs-14"
role="tab"
tabIndex={null}
@@ -61,7 +63,7 @@ exports[`
should allow for higher order components 1`] = `
exports[`
should display the custom classnames for selected and disabled tab 1`] = `
@@ -74,6 +76,7 @@ exports[`
should display the custom classnames for selected and disab
aria-disabled="false"
aria-selected="true"
className="react-tabs__tab active"
+ data-rttab={true}
id="react-tabs-8"
role="tab"
tabIndex="0"
@@ -85,6 +88,7 @@ exports[`
should display the custom classnames for selected and disab
aria-disabled="true"
aria-selected="false"
className="react-tabs__tab disabled"
+ data-rttab={true}
id="react-tabs-10"
role="tab"
tabIndex={null}
@@ -112,7 +116,7 @@ exports[`
should display the custom classnames for selected and disab
exports[`
should display the custom classnames for selected and disabled tab specified on tabs 1`] = `
@@ -125,6 +129,7 @@ exports[`
should display the custom classnames for selected and disab
aria-disabled="false"
aria-selected="true"
className="react-tabs__tab active"
+ data-rttab={true}
id="react-tabs-4"
role="tab"
tabIndex="0"
@@ -136,6 +141,7 @@ exports[`
should display the custom classnames for selected and disab
aria-disabled="true"
aria-selected="false"
className="react-tabs__tab disabled"
+ data-rttab={true}
id="react-tabs-6"
role="tab"
tabIndex={null}
@@ -185,7 +191,7 @@ exports[`
should pass through custom properties 1`] = `
exports[`
should retain the default classnames for active and disabled tab 1`] = `
@@ -198,6 +204,7 @@ exports[`
should retain the default classnames for active and disable
aria-disabled="false"
aria-selected="true"
className="react-tabs__tab react-tabs__tab--selected"
+ data-rttab={true}
id="react-tabs-0"
role="tab"
tabIndex="0"
@@ -209,6 +216,7 @@ exports[`
should retain the default classnames for active and disable
aria-disabled="true"
aria-selected="false"
className="react-tabs__tab react-tabs__tab--disabled"
+ data-rttab={true}
id="react-tabs-2"
role="tab"
tabIndex={null}
diff --git a/src/components/__tests__/__snapshots__/Tabs-test.js.snap b/src/components/__tests__/__snapshots__/Tabs-test.js.snap
index 6f93146c3b..acdf178673 100644
--- a/src/components/__tests__/__snapshots__/Tabs-test.js.snap
+++ b/src/components/__tests__/__snapshots__/Tabs-test.js.snap
@@ -3,7 +3,7 @@
exports[`
child props should reset ids correctly 1`] = `
child props should reset ids correctly 1`] = `
aria-disabled="false"
aria-selected="true"
class="react-tabs__tab react-tabs__tab--selected"
+ data-rttab="true"
data-testid="tab1"
id="react-tabs-0"
role="tab"
@@ -26,6 +27,7 @@ exports[`
child props should reset ids correctly 1`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
data-testid="tab2"
id="react-tabs-2"
role="tab"
@@ -37,6 +39,7 @@ exports[`
child props should reset ids correctly 1`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
data-testid="tab3"
id="react-tabs-4"
role="tab"
@@ -52,6 +55,7 @@ exports[`
child props should reset ids correctly 1`] = `
aria-disabled="true"
aria-selected="false"
class="react-tabs__tab react-tabs__tab--disabled"
+ data-rttab="true"
data-testid="tab4"
id="react-tabs-6"
role="tab"
@@ -95,7 +99,7 @@ exports[`
child props should reset ids correctly 1`] = `
exports[`
child props should reset ids correctly 2`] = `
child props should reset ids correctly 2`] = `
aria-disabled="false"
aria-selected="true"
class="react-tabs__tab react-tabs__tab--selected"
+ data-rttab="true"
data-testid="tab1"
id="react-tabs-0"
role="tab"
@@ -118,6 +123,7 @@ exports[`
child props should reset ids correctly 2`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
data-testid="tab2"
id="react-tabs-2"
role="tab"
@@ -129,6 +135,7 @@ exports[`
child props should reset ids correctly 2`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
data-testid="tab3"
id="react-tabs-4"
role="tab"
@@ -144,6 +151,7 @@ exports[`
child props should reset ids correctly 2`] = `
aria-disabled="true"
aria-selected="false"
class="react-tabs__tab react-tabs__tab--disabled"
+ data-rttab="true"
data-testid="tab4"
id="react-tabs-6"
role="tab"
@@ -187,7 +195,7 @@ exports[`
child props should reset ids correctly 2`] = `
exports[`
performance should render all tabs if forceRenderTabPanel is true 1`] = `
performance should render all tabs if forceRenderTabPanel is t
aria-disabled="false"
aria-selected="true"
class="react-tabs__tab react-tabs__tab--selected"
+ data-rttab="true"
data-testid="tab1"
id="react-tabs-0"
role="tab"
@@ -210,6 +219,7 @@ exports[`
performance should render all tabs if forceRenderTabPanel is t
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
data-testid="tab2"
id="react-tabs-2"
role="tab"
@@ -221,6 +231,7 @@ exports[`
performance should render all tabs if forceRenderTabPanel is t
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
data-testid="tab3"
id="react-tabs-4"
role="tab"
@@ -236,6 +247,7 @@ exports[`
performance should render all tabs if forceRenderTabPanel is t
aria-disabled="true"
aria-selected="false"
class="react-tabs__tab react-tabs__tab--disabled"
+ data-rttab="true"
data-testid="tab4"
id="react-tabs-6"
role="tab"
@@ -285,7 +297,7 @@ exports[`
performance should render all tabs if forceRenderTabPanel is t
exports[`
props should accept className 1`] = `
props should accept className 1`] = `
aria-disabled="false"
aria-selected="true"
class="react-tabs__tab react-tabs__tab--selected"
+ data-rttab="true"
data-testid="tab1"
id="react-tabs-0"
role="tab"
@@ -308,6 +321,7 @@ exports[`
props should accept className 1`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
data-testid="tab2"
id="react-tabs-2"
role="tab"
@@ -319,6 +333,7 @@ exports[`
props should accept className 1`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
data-testid="tab3"
id="react-tabs-4"
role="tab"
@@ -334,6 +349,7 @@ exports[`
props should accept className 1`] = `
aria-disabled="true"
aria-selected="false"
class="react-tabs__tab react-tabs__tab--disabled"
+ data-rttab="true"
data-testid="tab4"
id="react-tabs-6"
role="tab"
@@ -377,7 +393,7 @@ exports[`
props should accept className 1`] = `
exports[`
props should have sane defaults 1`] = `
props should have sane defaults 1`] = `
aria-disabled="false"
aria-selected="true"
class="react-tabs__tab react-tabs__tab--selected"
+ data-rttab="true"
data-testid="tab1"
id="react-tabs-0"
role="tab"
@@ -400,6 +417,7 @@ exports[`
props should have sane defaults 1`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
data-testid="tab2"
id="react-tabs-2"
role="tab"
@@ -411,6 +429,7 @@ exports[`
props should have sane defaults 1`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
data-testid="tab3"
id="react-tabs-4"
role="tab"
@@ -426,6 +445,7 @@ exports[`
props should have sane defaults 1`] = `
aria-disabled="true"
aria-selected="false"
class="react-tabs__tab react-tabs__tab--disabled"
+ data-rttab="true"
data-testid="tab4"
id="react-tabs-6"
role="tab"
@@ -469,7 +489,7 @@ exports[`
props should have sane defaults 1`] = `
exports[`
props should honor negative defaultIndex prop 1`] = `
props should honor negative defaultIndex prop 1`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
data-testid="tab1"
id="react-tabs-0"
role="tab"
@@ -491,6 +512,7 @@ exports[`
props should honor negative defaultIndex prop 1`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
data-testid="tab2"
id="react-tabs-2"
role="tab"
@@ -502,6 +524,7 @@ exports[`
props should honor negative defaultIndex prop 1`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
data-testid="tab3"
id="react-tabs-4"
role="tab"
@@ -517,6 +540,7 @@ exports[`
props should honor negative defaultIndex prop 1`] = `
aria-disabled="true"
aria-selected="false"
class="react-tabs__tab react-tabs__tab--disabled"
+ data-rttab="true"
data-testid="tab4"
id="react-tabs-6"
role="tab"
@@ -558,7 +582,7 @@ exports[`
props should honor negative defaultIndex prop 1`] = `
exports[`
props should honor positive defaultIndex prop 1`] = `
props should honor positive defaultIndex prop 1`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
data-testid="tab1"
id="react-tabs-0"
role="tab"
@@ -580,6 +605,7 @@ exports[`
props should honor positive defaultIndex prop 1`] = `
aria-disabled="false"
aria-selected="true"
class="react-tabs__tab react-tabs__tab--selected"
+ data-rttab="true"
data-testid="tab2"
id="react-tabs-2"
role="tab"
@@ -592,6 +618,7 @@ exports[`
props should honor positive defaultIndex prop 1`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
data-testid="tab3"
id="react-tabs-4"
role="tab"
@@ -607,6 +634,7 @@ exports[`
props should honor positive defaultIndex prop 1`] = `
aria-disabled="true"
aria-selected="false"
class="react-tabs__tab react-tabs__tab--disabled"
+ data-rttab="true"
data-testid="tab4"
id="react-tabs-6"
role="tab"
@@ -650,7 +678,7 @@ exports[`
props should honor positive defaultIndex prop 1`] = `
exports[`
should allow for higher order components 1`] = `
should allow for higher order components 1`] = `
aria-disabled="false"
aria-selected="true"
class="react-tabs__tab react-tabs__tab--selected"
+ data-rttab="true"
id="react-tabs-0"
role="tab"
tabindex="0"
@@ -672,6 +701,7 @@ exports[`
should allow for higher order components 1`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
id="react-tabs-2"
role="tab"
>
@@ -698,7 +728,7 @@ exports[`
should allow for higher order components 1`] = `
exports[`
should allow string children 1`] = `
Foo
should allow string children 1`] = `
aria-disabled="false"
aria-selected="true"
class="react-tabs__tab react-tabs__tab--selected"
+ data-rttab="true"
id="react-tabs-0"
role="tab"
tabindex="0"
@@ -723,6 +754,7 @@ exports[`
should allow string children 1`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
id="react-tabs-2"
role="tab"
>
@@ -751,14 +783,14 @@ exports[`
should allow string children 1`] = `
exports[`
should not add known props to dom 1`] = `
`;
exports[`
should pass through custom properties 1`] = `
`;
@@ -766,7 +798,7 @@ exports[`
should pass through custom properties 1`] = `
exports[`
validation should allow other DOM nodes 1`] = `
validation should allow other DOM nodes 1`] = `
aria-disabled="false"
aria-selected="true"
class="react-tabs__tab react-tabs__tab--selected"
+ data-rttab="true"
id="react-tabs-0"
role="tab"
tabindex="0"
@@ -797,6 +830,7 @@ exports[`
validation should allow other DOM nodes 1`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
id="react-tabs-2"
role="tab"
/>
@@ -830,7 +864,7 @@ exports[`
validation should allow other DOM nodes 1`] = `
exports[`
validation should allow random order for elements 1`] = `
validation should allow random order for elements 1`] = `
aria-disabled="false"
aria-selected="true"
class="react-tabs__tab react-tabs__tab--selected"
+ data-rttab="true"
id="react-tabs-0"
role="tab"
tabindex="0"
@@ -860,6 +895,7 @@ exports[`
validation should allow random order for elements 1`] = `
aria-disabled="false"
aria-selected="false"
class="react-tabs__tab"
+ data-rttab="true"
id="react-tabs-2"
role="tab"
>
@@ -880,7 +916,7 @@ exports[`
validation should allow random order for elements 1`] = `
exports[`
validation should be okay with rendering just TabList 1`] = `
validation should be okay with rendering just TabList 1`] = `
exports[`
validation should be okay with rendering without any children 1`] = `
`;
exports[`
validation should gracefully render null 1`] = `
validation should gracefully render null 1`] = `
aria-disabled="false"
aria-selected="true"
class="react-tabs__tab react-tabs__tab--selected"
+ data-rttab="true"
id="react-tabs-0"
role="tab"
tabindex="0"
@@ -931,7 +968,7 @@ exports[`
validation should gracefully render null 1`] = `
exports[`
validation should not throw a warning when wrong element is found 1`] = `
validation should not throw a warning when wrong element is fo
aria-disabled="false"
aria-selected="true"
class="react-tabs__tab react-tabs__tab--selected"
+ data-rttab="true"
id="react-tabs-0"
role="tab"
tabindex="0"