metamask-extension icon indicating copy to clipboard operation
metamask-extension copied to clipboard

feat: add token autodetect modal

Open salimtb opened this issue 10 months ago • 7 comments

Description

Add in recommended auto token enablement button in new Extension app update, once we enable auto token detection by default for new users, for existing users, we need to get them to turn on auto token detection as well.

Open in GitHub Codespaces

Related issues

Fixes:

Manual testing steps

  1. you are an existing user and you have token autodetection off
  2. once the upgrade will be done , you should see the modal below right after what's new pop up
  3. if you have it of and you decide to disable , you should see the pop up once

Screenshots/Recordings

Before

No Modal was displayed

After

Existing users with toggle off

https://github.com/MetaMask/metamask-extension/assets/26223211/2ff49f38-e652-4287-9b0a-a7092b8a1812

Users with toggle on and want to disable it ( the modal should be displayed once )

https://github.com/MetaMask/metamask-extension/assets/26223211/4438312f-cbb3-47f1-bc80-d1158b73e66a

Pre-merge author checklist

  • [x] I’ve followed MetaMask Coding Standards.
  • [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 format if applicable
  • [x] I’ve applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

Pre-merge reviewer checklist

  • [ ] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
  • [ ] 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.

salimtb avatar Apr 29 '24 14:04 salimtb

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.

github-actions[bot] avatar Apr 29 '24 14:04 github-actions[bot]

Codecov Report

Attention: Patch coverage is 46.96970% with 35 lines in your changes are missing coverage. Please review.

Project coverage is 65.76%. Comparing base (5f22357) to head (283fd03).

Files Patch % Lines
ui/store/actions.ts 16.67% 10 Missing :warning:
app/scripts/metamask-controller.js 0.00% 6 Missing :warning:
shared/modules/selectors/token-auto-detect.ts 58.33% 5 Missing :warning:
ui/ducks/metamask/metamask.js 0.00% 4 Missing :warning:
ui/pages/home/home.container.js 0.00% 4 Missing :warning:
ui/pages/home/home.component.js 25.00% 3 Missing :warning:
app/scripts/controllers/app-metadata.ts 0.00% 2 Missing :warning:
.../app/auto-detect-token/auto-detect-token-modal.tsx 94.12% 1 Missing :warning:
Additional details and impacted files
@@             Coverage Diff             @@
##           develop   #24281      +/-   ##
===========================================
- Coverage    65.79%   65.76%   -0.02%     
===========================================
  Files         1364     1366       +2     
  Lines        54315    54385      +70     
  Branches     14126    14139      +13     
===========================================
+ Hits         35732    35766      +34     
- Misses       18583    18619      +36     

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

codecov[bot] avatar May 02 '24 10:05 codecov[bot]

Builds ready [85398c5]
Page Load Metrics (581 ± 501 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint60161822612
domContentLoaded86013115
load4727015811043501
domInteractive86013115
Bundle size diffs [🚨 Warning! Bundle size has increased!]
  • background: 30 Bytes (0.00%)
  • ui: 4.94 KiB (0.08%)
  • common: 1.64 KiB (0.03%)

metamaskbot avatar May 02 '24 11:05 metamaskbot

I haven't been able to get this modal to appear yet. Maybe my process is wrong, and not sufficient to simulate the upgrade.

I imported a fresh build from develop and disabled token autodetect. Then I changed to a build of this branch. But it doesn't show the modal because this is undefined instead of null:

Screenshot 2024-05-14 at 10 33 42 AM

bergeron avatar May 14 '24 17:05 bergeron

I haven't been able to get this modal to appear yet. Maybe my process is wrong, and not sufficient to simulate the upgrade.

I imported a fresh build from develop and disabled token autodetect. Then I changed to a build of this branch. But it doesn't show the modal because this is undefined instead of null:

Screenshot 2024-05-14 at 10 33 42 AM

Hey @bergeron ,

It seems there's an issue with the process you're following. The modal in question is designed to show up exclusively during the onboarding/upgrade process, and it will only do so after a fresh installation of the app.

if you're doing the fresh app using develop branch, you'll not see the modal.

To replicate the issue, there are two methods. The first method applies to users who have the auto-detection feature turned off by default:

  • In the preferences.js file, set the state to false (this simulates users who have token auto-detection disabled by default).
  • Build and import your app using the auto-detect-token-modal branch.
  • Import your account.
  • You should see the modal appear right after the transaction simulation (refer to the linked video for clarity).

https://github.com/MetaMask/metamask-extension/assets/26223211/b242c243-a5c6-40e2-b293-536576d0720d

The second method is for users who had auto-detection enabled by default upon installing the app:

  • Install your app from the build using the auto-detect-token-modal branch.
  • Navigate to settings and turn off token auto-detection.
  • Return to the wallet view, and the modal should appear.
  • For this scenario, please refer to the provided video for more details.

https://github.com/MetaMask/metamask-extension/assets/26223211/f9129b17-a2db-4471-a8d9-4154117dd147

Let me know if you need any further information or clarification.

salimtb avatar May 15 '24 08:05 salimtb

Builds ready [73b61f5]
Page Load Metrics (1353 ± 684 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint73160972512
domContentLoaded108618178
load59345413531424684
domInteractive108618178
Bundle size diffs [🚨 Warning! Bundle size has increased!]
  • background: 30 Bytes (0.00%)
  • ui: 4.94 KiB (0.08%)
  • common: 1.68 KiB (0.03%)

metamaskbot avatar May 15 '24 09:05 metamaskbot

Builds ready [30b2041]
Page Load Metrics (782 ± 531 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint662471024220
domContentLoaded9221232
load5131767821105531
domInteractive9221232
Bundle size diffs [🚨 Warning! Bundle size has increased!]
  • background: 30 Bytes (0.00%)
  • ui: 4.94 KiB (0.07%)
  • common: 1.68 KiB (0.03%)

metamaskbot avatar May 16 '24 10:05 metamaskbot

Builds ready [8dfc4b7]
Page Load Metrics (653 ± 480 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint7713996199
domContentLoaded8421394
load6525496531000480
domInteractive8421394
Bundle size diffs [🚨 Warning! Bundle size has increased!]
  • background: 58 Bytes (0.00%)
  • ui: 4.93 KiB (0.07%)
  • common: 1.68 KiB (0.03%)

metamaskbot avatar May 28 '24 09:05 metamaskbot

I ve tested the upgrade scenario and the fresh import, the modal was displayed correctly, thnx 🙏

sahar-fehri avatar May 30 '24 16:05 sahar-fehri

Builds ready [283fd03]
Page Load Metrics (66 ± 8 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint8012798126
domContentLoaded11241331
load4810966168
domInteractive11231331

metamaskbot avatar May 31 '24 16:05 metamaskbot