Merge pull request #1248 from Michael-Hanley/fix/ariaLabelHeaders

Fix/aria label headers

Author: AllenFang

packages/react-bootstrap-table2/src/header-cell.js

@@ -77,6 +77,7 @@ class HeaderCell extends eventDelegater(React.Component) {
 
     if (sort) {
       const customClick = cellAttrs.onClick;
+      cellAttrs['aria-label'] = sorting ? `${text} sort ${sortOrder}` : `${text} sortable`;
       cellAttrs.onKeyUp = (e) => {
         if (e.key === 'Enter') {
           onSort(column);

packages/react-bootstrap-table2/test/header-cell.test.js

@@ -370,6 +370,11 @@ describe('HeaderCell', () => {
         });
       });
     });
+
+    it('should not have aria-label', () => {
+      wrapper = shallow(<HeaderCell column={ column } index={ index } />);
+      expect(wrapper.find('th').prop('aria-label')).toBeUndefined();
+    });
   });
 
   describe('when column.sort is enable', () => {
@@ -413,11 +418,20 @@ describe('HeaderCell', () => {
       expect(onSortCallBack.callCount).toBe(0);
     });
 
+    it('should have aria-label', () => {
+      expect(wrapper.find('th').prop('aria-label')).toBe('ID sortable');
+    });
+
+
     describe('and sorting prop is false', () => {
       it('header should render SortSymbol as default', () => {
         expect(wrapper.find(SortSymbol).length).toBe(1);
       });
 
+      it('should describe column header as sortable', () => {
+        expect(wrapper.find('th').prop('aria-label')).toBe('ID sortable');
+      });
+
       describe('when sortCaret is defined ', () => {
         beforeEach(() => {
           column = { ...column, sortCaret: jest.fn() };
@@ -445,6 +459,10 @@ describe('HeaderCell', () => {
               <HeaderCell column={ column } index={ index } sortOrder={ order } sorting />);
           });
 
+          it('should describe sort order in aria-label', () => {
+            expect(wrapper.find('th').prop('aria-label')).toBe(`ID sort ${order}`);
+          });
+
           it('should render SortCaret correctly', () => {
             expect(wrapper.find(SortCaret).length).toBe(1);
             expect(wrapper.find(SortCaret).prop('order')).toEqual(order);