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.

handleScroll() null this object

See original GitHub issue

Situation:

We recently incorporated this library, and our monitoring system (rollbar) began firing with issues like the this: image

Our current hypothesis is that the scroll listener is fired after the object is already garbage collected, i.e. this is called after the object is removed: https://github.com/codecks-io/react-sticky-box/blob/master/src/index.js#L243

Expected:

(Assuming the listener is the issue) the listener would be removed before the object is cleaned up

Actual:

(Appears) the listener is not cleaned up.

Note:

Happy to open a PR for you to consider that adds the componentWillUnmount lifecycle method if that would be useful. The proposed change would be something like:

diff --git a/src/index.js b/src/index.js
index fb08721..5a095ec 100644
--- a/src/index.js
+++ b/src/index.js
@@ -57,6 +57,10 @@ export default class StickyBox extends React.Component {
     }
   }
 
+  componentWillUnmount(){
+    this.registerContainerRef(null);
+  }
+
   registerContainerRef = n => {
     if (!stickyProp) return;
     this.node = n;

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Reactions:6
  • Comments:7

github_iconTop GitHub Comments

3reactions
danielberndtcommented, Feb 19, 2020

v0.9.3 released. Please let me now if it improves the situation!

1reaction
adrienlamottecommented, Feb 12, 2020

Same issue here ! It happens after the route change (so the StickyBox in not on the page anymore), and I try to resize the page.

Read more comments on GitHub >

github_iconTop Results From Across the Web

TypeError: Cannot read property 'getBoundingClientRect' of null
I'm trying to create a header with a Sticky effect, but I'm having this error when scrolling the page, sometimes it works and...
Read more >
State variable not updating in useEffect callback? · Issue #14066
I solved it similar to this, but I don't think it is nice at all. Looking forward to the next update. const handleScroll...
Read more >
null - JavaScript - MDN Web Docs - Mozilla
The null value represents the intentional absence of any object value. It is one of JavaScript's primitive values and is treated as falsy...
Read more >
JavaScript Scroll Events, Event Throttling & Passive Events
In this tutorial, you will learn about the JavaScript scroll events and how to handle scroll event properly.
Read more >
How to Fix TypeError: Null is Not an Object in JavaScript
The JavaScript error TypeError: null is not an object occurs when a property is accessed or a method is called on a null...
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