fix(tab): add aria-disabled depending on disabled prop (#4698)

carbon-design-system · Nov 18, 2019 · 79be49d · 79be49d
1 parent fd36c94
commit 79be49d
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 0 deletions.
diff --git a/packages/react/src/components/Tab/Tab-test.js b/packages/react/src/components/Tab/Tab-test.js
@@ -63,6 +63,15 @@ describe('Tab', () => {
       );
     });
 
+    it('has aria-disabled that matches disabled', () => {
+      const getDisabledRegion = () => wrapper.find('[aria-disabled]');
+
+      expect(getDisabledRegion().length).toEqual(0);
+
+      wrapper.setProps({ disabled: true });
+      expect(getDisabledRegion().prop('aria-disabled')).toEqual(true);
+    });
+
     it(`adds [className="${prefix}--tabs__nav-item--selected"] when selected prop is true`, () => {
       wrapper.setProps({ selected: true });
       expect(wrapper.hasClass(`${prefix}--tabs__nav-item--selected`)).toBe(
@@ -110,6 +119,7 @@ describe('Tab', () => {
       });
     });
   });
+
   describe('custom render label', () => {
     const wrapper = mount(
       <Tab

diff --git a/packages/react/src/components/Tab/Tab.js b/packages/react/src/components/Tab/Tab.js
@@ -150,6 +150,7 @@ export default class Tab extends React.Component {
       role: 'tab',
       tabIndex: !disabled ? tabIndex : -1,
       ['aria-selected']: selected,
+      ['aria-disabled']: disabled,
       ref: e => {
         this.tabAnchor = e;
       },