[0.76] `KeyboardAvoidingView` animation issues since 0.76+ upgrade
Nobody has claimed this yet.
- Dominant language
- C++
- Stars
- 127k
- Forks
- 25.3k
- Avg merge
- 1d 23h
- Merged PRs (30d)
- 4
Description
Description
I've updated my project from 0.75.2 to 0.76.1 this morning, and I noticed that the KeyboardAvoidingView, which was previously animating properly, is no longer animating. It now jumps and doesn't follow the keyboard animation.
Not sure why in my project it doesn't work, but while creating the reproduction repo, I noticed the animation behaviour has changed and doesn't look native smooth anymore.
Steps to reproduce
Any new project with KeyboardAvoidingView
React Native Version
0.76.1
Affected Platforms
Runtime - iOS
Output of npx react-native info
System:
OS: macOS 15.2
CPU: (10) arm64 Apple M1 Pro
Memory: 157.52 MB / 16.00 GB
Shell:
version: "5.9"
path: /bin/zsh
Binaries:
Node:
version: 22.11.0
path: ~/.nvm/versions/node/v22.11.0/bin/node
Yarn:
version: 1.22.17
path: ~/.npm-global/bin/yarn
npm:
version: 10.9.0
path: ~/.nvm/versions/node/v22.11.0/bin/npm
Watchman:
version: 2024.01.22.00
path: /opt/homebrew/bin/watchman
Managers:
CocoaPods:
version: 1.15.2
path: /Users/Alexis/.rbenv/shims/pod
Stacktrace or Logs
No crash
Reproducer
https://github.com/alexmngn/reproducer-react-native-keyboard-avoiding
Screenshots and Videos
On my project
Before update, 0.75.2
https://github.com/user-attachments/assets/5089cd4d-fb2f-4bde-9a9b-a7790b989c23
After update, 0.76.1
https://github.com/user-attachments/assets/60bc6d95-c444-4492-887b-cdb7d4e562d1
On the reproducer repo
Before update, 0.75.2
https://github.com/user-attachments/assets/83df6cab-b4c4-4698-a458-291ab37f982c
After update, 0.76.1
https://github.com/user-attachments/assets/8fa6d39c-88af-4527-b41c-d7ae2bc8e7a2
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the linked reproducer repository and run its KeyboardAvoidingView example on iOS, comparing React Native 0.75.2 with 0.76.1. Trace the KeyboardAvoidingView behavior across those versions and verify the result against the attached before-and-after videos. Done means the view follows the keyboard animation smoothly again after upgrading.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react-native
- Domain
- mobile
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 38/100