The library `@testing-library/user-event` has been updated to the
latest beta version, so that our unit tests better model real user
interactions. In particular, I found that previously the `paste` event
was missing the `clipboardData` API, so it was impossible to implement
any custom handling of paste events (which we will need in later PRs).
See the `v14.0.0-beta.1` release notes for a list of all breaking
changes [1]. The main change is that all methods now return Promises.
The `paste` method has also been dramatically simplified.
The unit tests have also been updated to reset all mocks before each
test. These tests don't have any shared mocks, but this is generally a
good practice, to ensure that tests don't develop accidental inter-
dependencies.
[1]: https://github.com/testing-library/user-event/releases/tag/v14.0.0-beta.1
After landing on Swap, a disclaimer of Smart Transactions appear, and an error on devTools shows the following: “invalid prop ‘type’ of value ‘ul’” supplied to ‘Typography’
After enabling Smart Transactions, an error on devTools shows the following: “invalid prop ‘smartTransactionsOptInSatus’ of type ‘boolean supplied to ‘SlippageButtons’
Signed-off-by: Akintayo A. Olusegun <akintayo.segun@gmail.com>
* Updating Box component and adding dark theme to storybook toolbar
* Updating box props table manually
* Fixing linting issues
* Updating design-tokens to v.1.3.0
* Reverting theme/background changes in .storybook/preview.js so we can use implementation in #13651
* Updating yarn.lock
* Updating titles
* Add design-tokens and apply colors to button
* swap more colors
* tweak button and add dark theme switch to storybook
* tweak buttons
* fix typo
* remove comments
* add dep to ignored list
* fix linting issue
* fix linting issues
* Updating some styles and removing some deprecated buttons (#13742)
* Updating some styles and removing some deprecated buttons
* Warning button fixes
* Fixing warning text for darkmode
* bump design tokens and update storybook theme strategy
Co-authored-by: George Marshall <george.marshall@consensys.net>
* Fix: Insufficient number of substitutions for key "stxSuccessDescription"
* Only calculate "approvalGas" if the "approvalNeeded" param is truthy in a quote
* "Swap from" has to be set to enable "Review Swap", set a default token for "Swap from"
* Fix: Unable to find value of key "undefined" for locale
* Use array destructuring
This is a pure refactor that extracts the SRP input from the
`CreateNewVault` component. This is intended to make future changes to
the SRP input easier, and to reduce duplication between the old and new
onboarding flows.
Extensive unit tests have been added for the new SRP input component.
A new test library was added (`@testing-library/user-event`) for
simulating user events with components rendered using the
`@testing-library` library.
A new helper method has been added (`renderWithLocalization`) for
rendering components using `@testing-library` with just our
localization contexts added as a wrapper. The localization contexts
were already added by the `renderWithProviders` helper function, but
there is no need for a Redux provider in these unit tests.
* Secure you wallet page
* Remove seedPhraseIntroSidebarBulletThree from messages.json
* Change the second bullet from Figma design
* Requested review changes
* Installing design tokens and writing docs in storybook
* Adding design-tokens to dep check ignore
* Link updates, Sentence casing, better css code formatting, other grammer fixes
* fix error with color variable - fix rebase
* clean list search & fuse threshold decreased
* update search-icon , fix tests
* nice to have highlighting text & cleaning
* unit test on settings & search input ui up on expanded view
* fix color variable in alert scss
* setting search input padding right up
* fix dom warning
* util/search test added & Dom element warning fix
* renaming files
* fix color text in settings search
* settings search highlight text refacto & fix ui
* fix settings-search test & renaming
* Fix styling on search field for edge cases, update components and e2e
E2E tests update for search feature
Update components from class to functional component
#
Fix storybook for search box
Fix styling
Fix unit tests
fix: remove z-index
Fix unit tests
Co-authored-by: amerkadicE <amer.kadic@endava.com>
* Created new screen/page "Token details"
* Change color in scss
* Modify elements to the latest requirements and added unit tests
* Review requested changes
* Condensing files into one component
* Added unit tests for token details page
* Added redirection when switching networks, added image for a token and update unit tests
* Requested review changes
* Modify index.scss regarding of the requested review
* Delete data-testid's from Typography and token-details-page.js
* Requested review changes
* Ensure sign message button is only enabled on scroll
* Add button for message scrolling to signature request screen
* lint fix
* Only show scroll button if message is scrollable
Co-authored-by: ryanml <ryanlanese@gmail.com>
* Fixing signature request formatting, requiring scroll before sign
* Ensure sign button not disable when no scroll is required
* Test fix attempt #1
* Clean up e2e tests
Co-authored-by: Dan Miller <danjm.com@gmail.com>
This PR adds `snaps` under Flask build flags to the extension. This branch is mostly equivalent to the current production version of Flask, excepting some bug fixes and tweaks.
Closes#11626
* Do not call `decimalToHex` for `minimumGasLimit`, which is already in hex
* Add `0x` prefix when returning a gas estimate
* Fix UTs
Co-authored-by: Dan J Miller <danjm.com@gmail.com>
The form used for creating a vault on the "Import" page of onboarding
and on the "Restore vault" page is nearly identical, yet the
implementation is totally separate. It has now been extracted to a
separate component, consolidating the two implementations.
There is a "terms of use" checkbox on the import page that isn't on the
restore vault page, so that part has been made optional. The "submit"
button text differs between the two uses as well, so that is
customizable.
There are slight styling differences between the old and new versions
of this form. The fonts and spacing are all using our new standard
design system guidelines, and we're using our standard checkbox now as
well. The spacing and font sizes were chosen somewhat arbitrarily by me
to resemble the old styles, so please feel free to suggest changes if
you think they can be improved upon.
There are some slight copy changes to the "Restore vault" page as well;
the placeholder text and the label for the "Secret Recovery Phrase"
field now matches the "Import" page copy.
* AccountMenu: fix#10168 w/ position: absolute
- use right: 1rem to match .app-header padding
* scss: Use px instead of rem for positioning
Co-authored-by: George Marshall <george.marshall@consensys.net>
Co-authored-by: George Marshall <george.marshall@consensys.net>
* SendHeader, ContactListTab and AdvancedTab story: converted knobs and actions to controls / args
* Added the other function type props to action controls
* Requested review changes
This commit fixes a few issues with ConfirmPageContainerSummary (which
holds the contract being used or action being performed and the money
being sent):
* Remove fixed height so that the secondary currency doesn't get cut off
or spill over
* Add missing padding
* Fix font size of primary and secondary currencies
* Add top border when there is a "address not in your address book"
alert at the top
Co-authored-by: Ariella <ariellavu@gmail.com>
Convert Typography story in ui/components/ui/typography/typography.stories.js to use controls argType annotation
- Add README.MDX
- Story has argTypes that align with component api / props
- All instances of @storybook/addon-knobs have been removed in favour of control args
- All instances of @storybook/addon-actions have been removed in favour of action argType annotation
This PR ensures that the `getLastConnectedInfo` selector handles missing `eth_accounts` permission history. Historically, `eth_accounts` was the only permission in existence, and the only way that a permission subject ended up with a permission history in the first place. This will no longer the case as of #11837, and we were perhaps never right to bake in this assumption to begin with.
* Update the copy for the Flask welcome page (#13223)
* Update the copy for the Flask welcome page
The copy for the Flask Welcome page has been updated to better dissuade
users who are not the target audience, and to better explain the risks
of using Flask.
* Fix typo
* Suggested edits (#13225)
* Suggested edits
* fixup! Suggested edits
Co-authored-by: Erik Marks <25517051+rekmarks@users.noreply.github.com>
* Update app/_locales/en/messages.json
Co-authored-by: David Walsh <davidwalsh83@gmail.com>
Co-authored-by: Erik Marks <25517051+rekmarks@users.noreply.github.com>
Co-authored-by: David Walsh <davidwalsh83@gmail.com>
The first page of the Flask onboarding was causing a propType warning
to appear in the console. It was caused by the array of React Fragments
used to construct the ASCII fox; they were missing the `key` prop.
These fragments are static content, so React doesn't really need to
worry about what to do in the event they are re-ordered. The array
index has been used as the key to silence the warning.
When a lot of transactions are occurring on the network, such as during
an NFT drop, it drives gas fees up. When this happens, we want to not
only inform the user about this, but also dissuade them from using a
higher gas fee (as we have proved in testing that high gas fees can
cause bidding wars and exacerbate the situation).
The method for determining whether the network is "busy" is already
handled by GasFeeController, which exposes a `networkCongestion`
property within the gas fee estimate data. If this number exceeds 0.66 —
meaning that the current base fee is above the 66th percentile among the
base fees over the last several days — then we determine that the
network is "busy".
ESLint rules have been added to enforce our JSDoc conventions. These
rules were introduced by updating `@metamask/eslint-config` to v9.
Some of the rules have been disabled because the effort to fix all lint
errors was too high. It might be easiest to enable these rules one
directory at a time, or one rule at a time.
Most of the changes in this PR were a result of running
`yarn lint:fix`. There were a handful of manual changes that seemed
obvious and simple to make. Anything beyond that and the rule was left
disabled.
The ESLint config for the extension explicitly includes support for
Prettier. However, this is already being provided by our global ESLint
config (`@metamask/eslint-config`). Therefore there is no need to
include it here. In fact, this is causing weird issues where the `curly`
option is getting overridden somehow. After this change, these syntaxes
are invalid:
``` javascript
if (foo) return;
```
``` javascript
if (foo) return 'bar';
```
* Update support links for Flask
* Disable 'prefer-const' in code fence linting
* Add bespoke home footer for Flask and update logic
* fixup! Add bespoke home footer for Flask and update logic
* Fix code fence lint failure
* Fix support request link in account menu
* Fix unit test failure
There was a propType error shown on the snap install screen about the
`name` property of `targetSubjectMetadata` being missing despite it
being marked as required. This property should not have been required,
it does not always exist.
* Prevent automatic rejection of confirmations
Confirmations are now only automatically rejected if a user explicitly
closes the notification window. If we close the window programmatically
because there are no notifications left to show, nothing gets rejected.
This partially avoids a race condition where a confirmation gets
rejected automatically without the user having seen the confirmation
first. This could happen if the confirmation was processed just as the
notification window was being closed.
It's still possible for a confirmation that the user has never seen to
get rejected as a result of the user closing the window. But at least
now it's no longer possible for a confirmation to get rejected in this
manner after the user resolves the last confirmation in the queue.
* Fix bug that prevented automatic closure detection
All windows were being detected as explicit window closures,
essentially just as they were previously, because this variable was
cleared too soon.
* Re-open popup when necessary
After the window is automatically closed, a confirmation may have been
queued up while the window was closing. If so, the popup is now re-
opened.
This error was introduced with #13100, which was merged without CI
checks because CircleCI was not running on that branch for some reason.
This error was fixed with `yarn lint:styles --fix`.
The `mounted` state was used to derive state from props before the
first render of the Home component. Instead this state is now derived
in the constructor, which is also run before the first render. This
should behave exactly the same, except now we don't need the `mounted`
state or the `deriveStateFromProps` function anymore.
The call to `closeCurrentWindow` that was made in `componentDidUpdate`
has been moved to the constructor as well. There is no need to delay
that call, and this saves us from having to compare current with
previous state in that lifecycle function.
The confirmation page template system allows templates to have alerts,
but it throws an uncaught Promise rejection if a template has no
alerts. This is the unintended side-effect of input validation.
The `getTemplateAlerts` function was updated to always return an array.
The one callsite was updated to expect an empty array if there were no
alerts to render, rather than expecting `undefined`.