question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Move away from MutationObserver

See original GitHub issue

Is your feature request related to a problem? Please describe. MutationObserver is outside of the React DOM removal process and so it feels weird. It’s not causing a problem apart from possibly browser support issues and the perf impact of using it.

Describe the solution you’d like In https://github.com/react-hook-form/react-hook-form/issues/26 @bluebill1049 says he needs mutation observer to realise when the field has been removed. However, that doesn’t seem necessary. If passing a ref as a function, React calls that function with null once the DOM element is removed. So thats the best way of detecting the removal of the DOM node.

I appreciate I could be missing something here though if theres more to it than that.

Describe alternatives you’ve considered N/A

Additional context N/A

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:8 (5 by maintainers)

github_iconTop GitHub Comments

2reactions
bluebill1049commented, Nov 21, 2019

Yeah I think we can leave what we have for now…

2reactions
adamscybotcommented, Nov 21, 2019

Hi @bluebill1049 The suggestion is to simply check null in your ref function. React calls it with null when the reference is removed exactly for the same use-case you need. Is there an advantage to using an external observer? Happy to PR. It will highly likely give a performance boost over mutation observer.

Read more comments on GitHub >

github_iconTop Results From Across the Web

MutationObserver.disconnect() - Web APIs - MDN Web Docs
The MutationObserver method disconnect() tells the observer to stop watching for mutations. The observer can be reused by calling its observe() ...
Read more >
Reconnect and disconnect a MutationObserver
I've moved the observers into an array and made it accessible outside of that function, so you can disconnect and reconnect them normally....
Read more >
Getting To Know The MutationObserver API
Moving A Node Tree That's Being Observed #. One last thing I'll point out is that a MutationObserver will continue to observe for...
Read more >
Mutation observer
MutationObserver is a built-in object that observes a DOM element and fires a callback when it detects a change.
Read more >
How to track changes in the DOM using MutationObserver
MutationObserver is a Web API provided by modern browsers for detecting changes in the ... You can check out David Walsh's blog post...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found