Using `contentOffset` causes invalid scroll events to fire when animated ScrollView is first mounted

[mozzius]

Description

Hi there! This is related to an issue I just filed with React Native (https://github.com/facebook/react-native/issues/46748) but I thought I'd file one here too, since a) this is what we're actually using in our app and b) the symptoms are slightly different

When using the contentOffset prop on Animated.ScrollView, we've observed that this causes extra scroll events to fire when the component is mounted. Specifically, it sends an event with the contentOffset equal to the value passed to the prop, then sends a second one - if the contentOffset is positive, it's the same value again, and if it's negative, it's 0. Unlike with a plain React Native ScrollView, it does this ~3 times - this is what's different from the React Native issue

We're trying to use a negative contentOffset.y value in conjunction with a paddingTop style so that the scrollview content can be offset from the top a certain distance.

Expected behaviour: no scroll events are fired until the scrollview is actually scrolled

Steps to reproduce

1. Create a ScrollView that has an onScroll handler that logs contentOffset
2. Add a contentOffset of { x: 0, y: -100 }
3. Observe the logs look like this:

-100
0
-100
0
-100
0

Snack or a link to a repository

https://github.com/mozzius/reanimated-scroll-evt-repro

Reanimated version

3.10.1

React Native version

0.74.5

Platforms

iOS

JavaScript runtime

Hermes

Workflow

Expo Go

Architecture

Paper (Old Architecture)

Build type

Debug app & dev bundle

Device

iOS simulator

Device model

iPhone 15

Acknowledgements

Yes

[patrycjakalinska]

hi @mozzius, I think this issue is on RN side, yet we will look at that in the future.

I noticed that this issue no longer exists on New Architecture - have you been thinking about migrating? I highly recommend it! Let me know :)

[mozzius]

Hey! Yeah, we're in the middle of a migration, should be shipping new arch on Android this week :)