We had a Bootstrap Table feature on a Drupal 7 project that we recently migrated to Drupal 8. In the old implementation, we had added a patch to allow sorting columns with keyboard. We had also added title and aria-label attributes to the pagination so that they are accessible to screen readers.

After migrating the feature to Drupal 8, we discovered that sorting with keyboard no longer worked on IE11. My initial thought was that it had to do with certain features being dropped from the updated version of jQuery in Drupal 8 (currently 3.2.1) as opposed to the version we had in Drupal 7 (which for us was 1.9.1). Sure enough, when I temporarily forced Drupal 8 to use the older version of jQuery, sorting worked in IE. But other portions of Drupal were not working as expected. To validate this further, I created a Jekyll site with a sample table and the latest versions of jQuery and Bootstrap-Table (patched with our changes, of course). It worked fine in IE. I then ripped out the sample table and replaced it with our table. It did not work in IE. That meant there was something wrong with our implementation. It turned out that the problem had to do with buttons associated with filters for the table. The filter and associated buttons were not wrapped by <form></form>, so hitting <Enter> while focused on the column name lost context.

It’s hard to say if IE is to blame here. It might have implemented some strict specs. It wouldn’t be the first time, either..

By the way, here is the patch I used for the 508 compliance:

diff --git a/dist/bootstrap-table.js b/dist/bootstrap-table.js
index 9f13ae6..0758e14 100644
--- a/dist/bootstrap-table.js
+++ b/dist/bootstrap-table.js
@@ -877,6 +877,7 @@
                     sprintf(' colspan="%s"', column.colspan),
                     sprintf(' data-field="%s"', column.field),
                     j === 0 && column.fieldIndex ? ' data-not-first-th' : '',
+                    "tabindex='0'",
                     '>');

                 html.push(sprintf('<div class="th-inner %s">', that.options.sortable && column.sortable ?
@@ -1498,7 +1499,7 @@
             html.push('</div>',
                 sprintf('<div class="%s-%s pagination">', bs.pullClass, this.options.paginationHAlign),
                 '<ul class="pagination' + sprintf(' pagination-%s', this.options.iconSize) + '">',
-                sprintf('<li class="page-item page-pre"><a class="page-link" href="#">%s</a></li>',
+                sprintf('<li class="page-item page-pre"><a title="Go to previous page" aria-label="Go to previous page" class="page-link" href="#">%s</a></li>',
                 this.options.paginationPreText));

             if (this.totalPages < 5) {
@@ -1582,7 +1583,7 @@
             }

             html.push(
-                sprintf('<li class="page-item page-next"><a class="page-link" href="#">%s</a></li>',
+                sprintf('<li class="page-item page-next"><a title="Go to next page" aria-label="Go to next page" class="page-link" href="#">%s</a></li>',
                 this.options.paginationNextText),
                 '</ul>',
                 '</div>');

The patch above is a quick fix. It only changes the dist file for debugging purposes. The proposer solution is the patch the entire codebase.

Resources