material-ui/core failing on IE11

Created on 1 Jun 2018  路  10Comments  路  Source: mui-org/material-ui

Expected Behavior

material-ui/core do not use(?) Number.isNaN as any of IE have no support for this method.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/isNaN

Current Behavior

https://github.com/mui-org/material-ui/blob/f454b33269e1e99cd1ee74a3752b3c6a45bf01dd/packages/material-ui/src/styles/transitions.js#L38

Steps to Reproduce (for bugs)

example at https://codesandbox.io/s/wnzy1100o8
try to see what happens in IE11

  1. follow the link above
  2. wait while app is load
  3. open loaded app in new window in chrome and in IE
  4. ... profit

Context

Can not run react app with material-ui on IE11 as it stated in
https://material-ui.com/getting-started/comparison/#browser-support

Your Environment

| Tech | Version |
|--------------|---------|
| Material-UI | v1.1.0 |
| React | v16.4.0|
| browser |IE 11.0.9600.18378|
| production servlet container |Tomacat 8|

bug 馃悰 good first issue

All 10 comments

@B-R-Bender What is the error message? I can't reproduce your issue with the codesandbox or docs site.

What is the error message?

@mbrookes Object doesn't support property or method 'isNaN'.
@B-R-Bender Do you want to do the following diff?

-export const isNumber = (value: any) => !Number.isNaN(parseFloat(value)); 
+export const isNumber = (value: any) => !isNaN(parseFloat(value)); 

Can not run react app with material-ui on IE11 as it stated in

This piece of code only runs in development. It's working in production as you can see it in the live documentation. It's not luck.

Can I update this in the code? @oliviertassinari @mbrookes

This piece of code only runs in development. It's working in production as you can see it in the live documentation. It's not luck.

Working in production is a great news, but I have at least one more issue in IE (hopefuly not with MUI) and I can't get to it (in dev) through this issue.
Hope it's a good idea to fix it in dev, @oliviertassinari @mbrookes ?

it's a good idea to fix it in dev

Yes, it's.

IE must not more supported by any modern project

@webmobiles What do you mean?

Also I searched for an alternative solution, and found this, If that's okay can we do something like this.

export const isNumber = (value: any) => parseFloat(value) === +value;

Reference taken from https://stackoverflow.com/a/10109757/4921319

Was this page helpful?
0 / 5 - 0 ratings

Related issues

ghost picture ghost  路  3Comments

iamzhouyi picture iamzhouyi  路  3Comments

ghost picture ghost  路  3Comments

finaiized picture finaiized  路  3Comments

anthony-dandrea picture anthony-dandrea  路  3Comments