Length is Undefined

[joebentaylor1995]

Getting this error:

index.js:192 Uncaught TypeError: Cannot read property 'length' of undefined
    at MagnetMouse.magnetElement (index.js:192)
    at index.js:251
    at index.js:57

my code: (React)

// ------
import React, { useEffect } from 'react'
import MagnetMouse from 'magnet-mouse';

// Styles
// ------
import {
    Jacket,
    InnerCircle
} from './styles';

// Component
// ------
const Cursor = () => {
    useEffect(() => {
        let mm = new MagnetMouse({
            follow: {
                element: '.cursor',
                class: 'follow-mouse-active' /* Add class to element that follows the mouse when enter in the magnet effect */
            },
        });

        mm.init();
    }, [])

    return (
        <Jacket className="cursor">
            <InnerCircle />
        </Jacket>
    );
}

export default React.memo(Cursor);

[jamestsang]

It hasn't assigns posElement by getElementsPosition()
You may addposElement = _this.getElementsPosition(); to line 268
or trigger window resize by your self.

[Skamnoel]

just faced the same Error ( also using this lib in my React component )
As @jamestsang said, triggering resize manually fixes it.
Just do it immediately after you call mm.init() with this: window.dispatchEvent(new Event('resize'))

[valentinilas]

I think it's because it tries to get the element position on DOMContentLoaded and your script runs after that event fires, so posElement remains undefined

      // Calculate position of element when page load
      document.addEventListener('DOMContentLoaded', () => {
        posElement = this.getElementsPosition();
      });