maslianok / react-resize-detector

A Cross-Browser, Event-based, Element Resize Detection for React
http://maslianok.github.io/react-resize-detector/
MIT License
1.25k stars 91 forks source link

Broken in iOS 11, 12, 13 after updating from 5.2 to version 6.6 #141

Closed dobesv closed 3 years ago

dobesv commented 3 years ago

After we updated to 6.6 users on iOS 11-13 get an error undefined is not a constructor, evaluating new window.ResizeObserver(n.resizeHandler)

eduard-s commented 3 years ago

+1 on macOS safari - the same issue

JaLe29 commented 3 years ago

+1 Mobile Safari 12.1, iOS 12.2, "react": "^17.0.1",

maslianok commented 3 years ago

Starting from version 6 the library uses ResizeObserver without any polyfills since it's supported by all major browsers.

In order the library to work in the older browser versions - please import the polyfilled version from react-resize-detector/build/withPolyfill:

import ResizeObserver from 'react-resize-detector/build/withPolyfill';

Does it solve the problem?

izica commented 3 years ago

+1 macOS safari import ResizeObserver from 'react-resize-detector/build/withPolyfill';

importing withPolyfill doesn't resolve problem

"react-resize-detector": "^6.5.0" "react": "^16.13.1"

izica commented 3 years ago

updating to 6.6.1 resolves the problem

maslianok commented 3 years ago

updating to 6.6.1 resolves the problem

👍

azmatrana commented 2 years ago

This issue still exists in latest version 6.7.6 as well.

import ResizeObserver from 'react-resize-detector/build/withPolyfill';

This has fixed the issue. I have tested on: Iphone 5, 5s, 6, 6s, 12, 12 pro, 12 pro max. Android 6, 7, 8, 9, 10

altany commented 2 years ago

I get the same error with version ^7.1.2 because of the latest recharts upgrade.

Semigradsky commented 2 years ago

@altany did you import resize observer polyfill?

brunsy commented 2 years ago

Just came across this myself. As the pollyfill was removed in the v7 release...

zhibek commented 1 year ago

Confirming I was seeing this problem on v7.1.2 when using iOS/Safari 12.5.6.

I downgraded to v6.7.8 so I could import the withPolyfill build react-resize-detector/build/withPolyfill. That fixed the problem for me.

@maslianok Is there any other solution for this problem when using v7 of react-resize-detector?

snelsi commented 1 year ago

@zhibek This library uses ResizeObserver, which is supported in >95% of browsers, so there is no need to polyfill it most of the time. If you still need support for old browsers, you can manually add a polyfill, by installing something like resize-observer-polyfill in your project.