rrutsche / react-parallax

A React Component for parallax effect
MIT License
847 stars 76 forks source link

Uncaught TypeError when using React Router #64

Closed ReinBentdal closed 4 years ago

ReinBentdal commented 4 years ago

When i initialy load the page everything works as expected. But when i go to a new page using react-router-dom an error occurs in the console:

Uncaught TypeError: Cannot read property 'getBoundingClientRect' of null
    at index.js:230
    at HTMLDocument.n.onScroll (index.js:233)

the code where the error occurs (7. line):

if (n.canUseDOM) {
            var e = Date.now();
            e - n.timestamp >= 10 && function (e) {
              var t = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : 0,
                  n = arguments.length > 2 ? arguments[2] : void 0;
              if (!n) return !1;
              var o = e.getBoundingClientRect().top - t, // right here
                  r = e.getBoundingClientRect().bottom + t;
              return o <= d(n) && r >= 0;
            }(n.node, 100, n.canUseDOM) && (window.requestAnimationFrame(n.updatePosition), n.timestamp = e);
          }

I guess the error has something to do with the Parallax widget getting disposed.

rrutsche commented 4 years ago

I will probably add some additional test there to check if the element really exists.

davwheat commented 4 years ago

This is a really annoying issue. Any update on when this will be patched?

rrutsche commented 4 years ago

@davwheat I will have a look at it. Did not find time so far. It would really help me if you guys set up an example where this issue occurs - maybe on codesandbox (just use the link in the readme and fork the project). Otherwise I end up adding many ifs and else without knowing the real cause. Thanks