React-table: Compatibility with IE

[alexbensimon]

Problem Description

The lib doesn't seem to support IE (10 or 11). I couldn't find any information about compatibility in the README.

Code Snippet(s) or Codepen (http://codepen.io/tannerlinsley/pen/QpeZBa?editors=0010)

Steps to Reproduce

1. Take the link of the Codepen demo
2. Open it in IE 10 or IE 11

System Information

• Browser & Browser Version: IE 10 and IE 11
• Node Version:
• OS Version: Windows 10 pro
• NPM Version:
• Yarn Version:

[VyvIT]

Looks like some polyfills are missing for IE11. Now it fails with: "Object doesn't support property or method 'find'".

[kolbeypruitt]

Really need help here.. Did this used to work with ie11?

[alexbensimon]

@kolbeypruitt: According to #105, it used to work. @tannerlinsley said in #171 that he doesn't guarantee support for ie, but he seems concerned with the compatibility issue (#240). If it's only a matter of a few polyfills, I think it wouldn't take too much time to fix it, but would be useful to several people.

[JCofman]

I am currently using the Table for a project with IE10 and IE11 support. To make the table work you have to provide a polyfill e.g. -> https://babeljs.io/docs/usage/polyfill/. There is also an issue with flexbox see #304 so you have to add the following to your CSS:

.ReactTable {
  display: block;
}

And an issue related to the loading overlay as already referenced by @alexandrebensimon #240. The loading overlay persists on IE10 so you can't hover or click on the table rows. I resolved this issue by manipulating the z-index by adding following:

.ReactTable .-loading {
  z-index: -1;
}
.ReactTable .-loading.-active {
  z-index: 2;
}

[kolbeypruitt]

This is exactly what I needed. Thanks so much! (:

[alexbensimon]

Yes! Thank you @Ixl123. I think you should propose a PR with this.

[tannerlinsley]

I will accept a PR with these changes. Open it up when you want! :)

[ReactRS]

Thank you Ixl123, resolved the issue for us.