microsoft / microsoft/react-native-windows

All 'scroll to' buttons, except for 'Top', on SectionList 'scrollable' example page not working as intended on RNTesterApp-Fabric

Open
#13,480 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Area: FlatList Area: ScrollView bug New Architecture Workstream: Component Parity
Dominant language
C++
Stars
17.3k
Forks
1.2k
Avg merge
1d 13h
Merged PRs (30d)
33

Description

Problem Description

On the SectionList 'scrollable' example page, the 'scroll to' buttons are not working as expected. All of the buttons scroll back to the top of the page rather than the section that it says it will scroll to. i.e clicking on 'scroll to section 3' while in the middle of the page will scroll you back to the top.

Steps To Reproduce
  1. Launch RNTesterApp-Fabric
  2. Navigate to the 'scrollable' example on the SectionList component page
  3. Click on any of the 'scroll to' buttons except for 'Top'.
  4. Observe no scrolling occur
  5. Scroll to the bottom of the page
  6. Click any of the 'scroll to' buttons except 'Top'
  7. Observe page scroll to top
Expected Results

Page should scroll to position described by button.

CLI version

14.0.0-alpha.2

Environment

System:
OS: Windows 11 10.0.26120
CPU: "(24) x64 AMD Ryzen Threadripper PRO 3945WX 12-Cores "
Memory: 43.46 GB / 63.86 GB
Binaries:
Node:
version: 18.18.0
path: C:\Program Files\nodejs\node.EXE
Yarn:
version: 1.22.19
path: C:\Program Files (x86)\Yarn\bin\yarn.CMD
npm:
version: 9.8.1
path: C:\Program Files\nodejs\npm.CMD
Watchman: Not Found
SDKs:
Android SDK: Not Found
Windows SDK:
AllowDevelopmentWithoutDevLicense: Enabled
AllowAllTrustedApps: Enabled
Versions:
- 10.0.18362.0
- 10.0.19041.0
- 10.0.22000.0
- 10.0.22621.0
IDEs:
Android Studio: AI-213.7172.25.2113.9123335
Visual Studio:
- 17.10.35027.167 (Visual Studio Enterprise 2022)
- 16.11.34931.43 (Visual Studio Enterprise 2019)
Languages:
Java:
version: 18.0.2.1
path: C:\Program Files\Common Files\Oracle\Java\javapath\javac.EXE
Ruby: Not Found
npmPackages:
"@react-native-community/cli": Not Found
react: Not Found
react-native: Not Found
react-native-windows: Not Found
npmGlobalPackages:
"react-native": Not Found
Android:
hermesEnabled: Not found
newArchEnabled: Not found
iOS:
hermesEnabled: Not found
newArchEnabled: Not found

Community Modules

No response

Target Platform Version

None

Target Device(s)

No response

Visual Studio Version

Visual Studio 2022

Build Configuration

Release

Snack, code example, screenshot, or link to a repository

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the issue in the SectionList “scrollable” example in RNTesterApp-Fabric on Windows. Inspect how the “scroll to” buttons select their target sections, then verify that each button reaches the section named by its label rather than the top of the page.

Written by the indexing model from the issue text.

Assessment

Tech stack
react-native
Domain
desktop-dev, frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.