infinite loop caused by `isInViewRef`

When calling setRef from this package, it causes an infinite loop if called from within an inline function e.g. when passed as a param to packages like react-merge-ref.

Here’s a simple repro of the issue (calling manually from inside an inline ref callback):

https://codesandbox.io/s/sweet-rgb-6werdb?file=/src/App.js

When an inline ref function is used, React will set the ref to null and back again on every render. So, from my quick dive into this package’s code I believe this caveat is causing the observer to set up again which is firing setState and re-rendering, which calls setRef with null (and back again), and loops.

[thebuilder]

🎉 This issue has been resolved in version 9.4.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

[jjenzz]

There’s no perfect way to solve this (that I’m aware of)

The lib is calling setState with a new object reference regardless of whether the intersection value has actually changed (causing an infinite loop). Checking for change there would prevent it:

• https://codesandbox.io/s/epic-pare-2d9w9j?file=/src/App.js
• https://codesandbox.io/s/boring-field-2qx7rw?file=/src/App.js

Another approach is to take advantage of React’s batching to set the node in state:

https://codesandbox.io/s/fervent-wood-h7jj1g?file=/src/App.js

There are likely other ways I haven’t considered but it does seem that the lib should be able to handle it.