chore(runway): cherry-pick fix: cp-7.51.2 scroll behaviour on Solana New Feature view #17813
+20
−15
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
![runway-github[bot]](https://avatars.githubusercontent.com/in/86225?s=60&v=4){kind=small}
…New Feature view (#17807) ## **Description** This PR fixes the iOS-specific scrolling issue with the Solana feature popup that was preventing users from accessing the bottom buttons. The problem occurred when the title text spans multiple lines (particularly in non-English languages), causing the "Not now" button to appear below the visible screen area. While users could scroll down to reach the button, the ScrollView would automatically snap back to the top, making the buttons inaccessible and effectively blocking app usage. **Root Cause:** The issue was caused by conflicting flex layouts where `contentContainerStyle` with `flex: 1` forced the ScrollView content to always try to fill the full height, creating layout calculation conflicts on iOS that resulted in the automatic scroll-back behavior. **Solution:** - Replaced `flex: 1` with `flexGrow: 1` and `minHeight: '100%'` to allow proper content expansion without forcing full height - Enhanced ScrollView configuration for better iOS compatibility ## **Changelog** CHANGELOG entry: Fixed Solana popup scrolling issue that prevented iOS users from accessing bottom buttons ## **Related issues** Fixes: #17795 ## **Manual testing steps** 1. Open MetaMask on an iOS device (physical device or simulator) 2. Clear the Solana feature modal storage flag to trigger the popup: - In developer tools, delete AsyncStorage key: `@MetaMask:solanaFeatureModalShownV2` - Or temporarily add `StorageWrapper.removeItem(SOLANA_FEATURE_MODAL_SHOWN)` to the component 3. Restart the app to see the Solana popup 4. Test with different scenarios: - **Short title (English)**: Verify normal display with buttons visible - **Long title (other languages)**: Change device language to German/Spanish/French or temporarily replace title with long text 5. When title spans 3+ lines: - Scroll down to reach the "Not now" button - Verify content stays scrolled and doesn't snap back to top - Verify both "Import your wallet" and "Not now" buttons are clickable 6. Test on both iPhone simulator and physical device for best coverage ## **Screenshots/Recordings** ### **Before** - Recording in #17795 - Users reported scrolling down but screen automatically moving back up - "Not now" button became inaccessible on longer text - App effectively blocked for users with this popup ### **After** https://www.loom.com/share/26aefcc54516462596e16fa0aa88e81d - Smooth scrolling behavior without snap-back - Bottom buttons remain accessible after scrolling - Consistent experience across different text lengths and languages ## **Pre-merge author checklist** - [x] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Mobile Coding Standards](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/CODING_GUIDELINES.md). - [x] I've completed the PR template to the best of my ability - [x] I've included tests if applicable - [x] I've documented my code using [JSDoc](https://jsdoc.app/) format if applicable - [x] I've applied the right labels on the PR (see [labeling guidelines](https://github.com/MetaMask/metamask-mobile/blob/main/.github/guidelines/LABELING_GUIDELINES.md)). Not required for external contributors. ## **Pre-merge reviewer checklist** - [x] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed). - [x] I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.
|
CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes. |
|
|
tommasini
approved these changes
Aug 1, 2025
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
This PR fixes the iOS-specific scrolling issue with the Solana feature
popup that was preventing users from accessing the bottom buttons. The
problem occurred when the title text spans multiple lines (particularly
in non-English languages), causing the "Not now" button to appear below
the visible screen area. While users could scroll down to reach the
button, the ScrollView would automatically snap back to the top, making
the buttons inaccessible and effectively blocking app usage.
Root Cause: The issue was caused by conflicting flex layouts where
contentContainerStylewithflex: 1forced the ScrollView content toalways try to fill the full height, creating layout calculation
conflicts on iOS that resulted in the automatic scroll-back behavior.
Solution:
flex: 1withflexGrow: 1andminHeight: '100%'to allowproper content expansion without forcing full height
Changelog
CHANGELOG entry: Fixed Solana popup scrolling issue that prevented iOS
users from accessing bottom buttons
Related issues
Fixes: #17795
Manual testing steps
@MetaMask:solanaFeatureModalShownV2StorageWrapper.removeItem(SOLANA_FEATURE_MODAL_SHOWN)to the componentGerman/Spanish/French or temporarily replace title with long text
Screenshots/Recordings
Before
After
https://www.loom.com/share/26aefcc54516462596e16fa0aa88e81d
Pre-merge author checklist
Docs and MetaMask Mobile
Coding
Standards.
if applicable
guidelines).
Not required for external contributors.
Pre-merge reviewer checklist
app, test code being changed).
in the ticket it closes and includes the necessary testing evidence such
as recordings and or screenshots. e4d305d