fix(tab): Set initial tabIndex state to -1 (#690) (#691)

material-components · Mar 18, 2019 · 9034c98 · 9034c98
1 parent 52eeb52
commit 9034c98
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 0 deletions.
diff --git a/packages/tab/index.tsx b/packages/tab/index.tsx
@@ -72,6 +72,7 @@ export default class Tab extends React.Component<TabProps, TabState> {
     'aria-selected': false,
     'activateIndicator': false,
     'previousIndicatorClientRect': this.props.previousIndicatorClientRect,
+    'tabIndex': -1,
   };
 
   componentDidMount() {

diff --git a/test/unit/tab/index.test.tsx b/test/unit/tab/index.test.tsx
@@ -29,6 +29,16 @@ test('adds the active class if props.active is true on mount', () => {
   assert.isTrue(wrapper.hasClass('mdc-tab--active'));
 });
 
+test('sets the tabIndex to 0 if props.active is true on mount', () => {
+  const wrapper = shallow(<Tab active />);
+  assert.equal(wrapper.prop('tabIndex'), 0);
+});
+
+test('sets the tabIndex to -1 if props.active is false on mount', () => {
+  const wrapper = shallow(<Tab active={false} />);
+  assert.equal(wrapper.prop('tabIndex'), -1);
+});
+
 test('adds a class from state.classList', () => {
   const wrapper = shallow(<Tab />);
   wrapper.setState({classList: new Set(['test-class'])});