react-reduce-motion icon indicating copy to clipboard operation
react-reduce-motion copied to clipboard

Doesn't work in Safari <13

Open nickmcmillan opened this issue 4 years ago • 2 comments

First up, thanks for making this package!

I've discovered that it doesn't work in Safari 13 (and probably below): [Error] TypeError: mq.addEventListener is not a function.

Safari 13 uses an older, outdated syntax: mq.addListener(handleChange); Whereas modern browsers use the later spec mq.addEventListener('change', handleChange); (https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/addListener)

You could give this a shot instead (although I haven't tested it):

try {
  mq.addEventListener('change', handleChange);
} catch (err) {
  // Safari
  mq.addListener(handleChange);
}

nickmcmillan avatar Jan 11 '21 06:01 nickmcmillan

if (mq.addListener) {
    mq.addListener(handleChange);
} else {
    mq.addEventListener('change', handleChange);
}

LoganDark avatar Jun 27 '21 16:06 LoganDark

I'm getting a similar looking issue with Internet Explorer 11

Object doesn't support property or method 'addEventListener'

Can confirm that this PR will fix the issue as I have tested it locally and IE stops breaking

mitchellwarr avatar Jul 08 '21 01:07 mitchellwarr