enableScrollSpy disables onEnd and onStart callback func

[DevYemi]

Hi there, thanks for the package.

When ever i enable enableScrollSpy it kinda disables onEnd and onStart callback func, they don't get called.

Is this the normal behavior or this is a bug ?

[ventenni]

I'm also having this issue.

[ventenni]

@DevYemi

Hey. I've just played around with my usage and noticed that I had both the scrollSpyDelay and delay properties set. Once I removed delay it started working as expected.

[elinarbur]

I'm not observing the behaviour described in this issue, likely due to not having the delay prop set. However, I am experiencing that with enableScrollSpy set the onEnd callback is called before the component enters into the viewport.

Sample code snippet:

<CountUp
    end={142}
    duration={5}
    enableScrollSpy
    scrollSpyDelay={500}
    scrollSpyOnce
    onEnd={() =>
        console.log("end")
    }
/>

Produces the following developer console output:

Watching the console in real-time you'll see the first message logged before the other two.

EDIT: I did some testing to see if I could use my own scrollspy. What I found is that react-countup, or at least my configuration, seems to reset state after completing. You can easily test this yourselves with this snippet:

const [test, setTest] = useState("test string");

...

<CountUp
    end={142}
    duration={5}
    enableScrollSpy
    scrollSpyDelay={500}
    scrollSpyOnce
    onStart={() => {
        setTest("string test");
    }}
    onEnd={() =>
        console.log(test)
    }
/>

For me the above would log test string only.