Repository navigation
fix(menu): account for keyboard already open when Menu mounts - #5122
manchoudhary wants to merge 4 commits into
Conversation
3dbb724 to
033b0a8
Compare
Use Keyboard.metrics() when measuring layout so a Menu that mounts while the keyboard is visible still avoids it. Fixes callstack#5096.
033b0a8 to
26358d5
Compare
Co-authored-by: Mikita Kliushun <nikita.kliushun@gmail.com>
manchoudhary
left a comment
There was a problem hiding this comment.
Thanks for the review! Addressed both points:
-
Blocker: The call itself is now optional: Keyboard.metrics?.()?.height ?? fallback. On react-native-web, where Keyboard.metrics is undefined, it no longer throws undefined is not a function. I added a test that sets Keyboard.metrics to undefined and asserts the menu still positions correctly. Spies and the original value are restored in finally.
-
#5073: It rewrites the same windowLayoutResult.height - keyboardHeightRef.current block without handling an already-open keyboard. This PR changes that line to use getKeyboardHeight(keyboardHeightRef.current). The test “accounts for a keyboard that is already open when the menu mounts” asserts the final rendered height, so it will fail if that call is dropped in a merge. I’ll rebase on whichever lands first, and I’ll also leave a note on #5073.
yarn lint, yarn typecheck and yarn test all pass. Ready for another look.
| @@ -1,3 +1,6 @@ | |||
| import { Dimensions, Keyboard, StyleSheet, View } from 'react-native'; | |||
There was a problem hiding this comment.
[blocker] this line duplicates line #4
that's why whole test suite fails to load
could we fix it up?
Motivation
Menuonly learned keyboard height fromkeyboardDidShowafter mount. iOS does not replay that event for a keyboard that is already open, so aMenuthat mounts while the keyboard is visible (for example a row added while typing) measured against the full window and laid items under the keyboard.This uses
Keyboard.metrics()when showing the menu (and seeds the ref on mount) so the already-open keyboard is accounted for.Related issue
Fixes #5096
Screenshots / Videos
N/A — layout behavior; verified manually on iPhone 16 simulator.
Test plan
yarn lintyarn typecheckyarn test