react-native-web icon indicating copy to clipboard operation
react-native-web copied to clipboard

ScrollView disables control of children when using pagingEnabled

Open ettmetal opened this issue 6 months ago • 0 comments

Is there an existing issue for this?

  • [x] I have searched the existing issues

Describe the issue

When using the pagingEnabled prop of ScrollView, it is no longer possible to control the styles of children. I believe this is because, while there is a contentContainerStyle prop on the component, it actually adds an additional layer of containers wrapping children when pagingEnabled is true.

Expected behavior

I expect to be able to set style props on the children I provide to ScrollView, and for the rendered view to act as if those props were applied.

Perhaps the wrapping view could copy style props from the child it wraps? I'm not sure how the implementation would be exactly, but as it stands there's a difference in how the component acts and looks, and what styling is even possible, depending on if the pagingEnabled prop is set or not.

Steps to reproduce

  1. Set the pagingEnabled prop on an ScrollView
  2. Observe that it is now impossible to manipulate layout of ScrollView children by setting props such as height, width, flex* etc. They are bounded to their minimum dimensions.

Test case

It is not possible to use that template: see below

Additional comments

The provided template for repro results in the following error when forked:

error reading: The editor could not be opened due to an unexpected error: Assertion Failed: argument is undefined or null, with a button labelled Try Again beneath the message

ettmetal avatar Aug 05 '25 22:08 ettmetal