This fixes a bug where the network menu would remain present after a
second click on the network menu button. The bug was caused by the
click being handled _twice_, by two separate handlers. First it was
caught by the external click handler of the dropdown menu, which closed
the menu. Second, it was caught by the network button itself, which re-
opened the menu. This all happens quickly enough that to the user it
appears to stay open.
The external click handler of the menu now only fires if the menu is
open. Additionally, any click that is caught by the network menu is
stopped from propagating further, so that it can't trigger additional
click handlers.
The Firefox e2e tests now use the `.zip` file for testing the
extension. We've found this to produce more similar results to
production, compared to the old method of loading the unzipped
directory.
Passing in a `.zip` file to the Chrome driver didn't seem to work. I
didn't investigate this further to see if it was possible, but I'm not
sure it makes a difference on Chrome anyway.
The `waitUntilCalled` utility now has a timeout. It will now throw an
error if the stub is not called enough times, rather than blocking
forever.
The return type had to be changed to a function, so that we could throw
when the timeout is triggered. I tried returning an error that rejected
first, but if you don't handle the error synchronously Node.js will
consider it to be an unhandled Promise rejected (even if it _is_
handled later on).
I worked around this by resolving in the timeout case as well, so that
there is never a "deferred" Promise exception in the timeout case. The
returned function re-throws the error if it's given. That way there is
never any unhandled Promise rejection.
The metrics e2e test would fail if the segment events still weren't
dispatched when the page loaded. The Segment events are sent on a set
interval, so it isn't abnormal for them to lag behind the page load
itself. The `waitUntilCalled` utility has been used to wait until all
required events have been dispatched.
The `wait-until-called` module was converted to an ES5 module, so that
it could be used from an e2e test. The optional `callCount` parameter
has also been added, to allow waiting for more than one call.
The `segmentSpy` had to be converted to a `segmentStub`, to allow the
`waitUntilCalled` utility to be used.
The e2e test driver used to perform the initial navigation
automatically within the `buildWebDriver` function, so that that step
wouldn't need to be repeated at the beginning of each test. However
this prevented you from doing any setup in the test before the first
navigation.
The navigation has now been moved into each individual test. It should
be functionally equivalent, except now it's possible to control exactly
when the first navigation occurs.
A 1 second delay was also removed, as it didn't seem to be necessary
when testing this. It was initially added as an attempted fix to an
intermittent failure. It did not fix that failure.
* Remove use of ethgassthat; use metaswap /gasPrices api for gas price estimates
* Remove references to ethgasstation
* Pass base to BigNumber constructor in fetchExternalBasicGasEstimates
* Update ui/app/hooks/useTokenTracker.js
Co-authored-by: Erik Marks <25517051+rekmarks@users.noreply.github.com>
* Delete gas price chart
* Remove price chart css import
* Delete additional fee chart code
* Lint fix
* Delete more code no longer used after ethgasstation removal
Co-authored-by: Erik Marks <25517051+rekmarks@users.noreply.github.com>
The assertion ensuring that there were at least 3 metrics received
didn't end up being useful. If this assertion fails, it doesn't explain
what segment events _were_ received.
By removing this assertion and letting the later assertions catch this
case, we at least learn which of the three expected events were
present.
An e2e test has been added that uses the new mock Segment server to
verify that the three initial page metric events are sent correctly.
Using the mock Segment server requires a special build with this mock
Segment server hostname embedded, so a distinct job for building and
running this test was required. As such, it was left out of the
`run-all.sh` script.
A few inconsistencies in JSDoc formatting have been fixed throughout
the project. Many issues remain; these were just the few things that
were easy to fix with a regular expression.
The changes include:
* Using lower-case for primitive types, but capitalizing non-primitive
types
* Separating the parameter identifier and the description with a dash
* Omitting a dash between the return type and the return description
* Ensuring the parameter type is first and the identifier is second (in
a few places it was backwards)
* Using square brackets to denote when a parameter is optional, rather
than putting "(optional)" in the parameter description
* Including a type and identifier with every parameter
* Fixing inconsistent spacing, except where it's used for alignment
* Remove incorrectly formatted `@deprecated` tags that reference non-
existent properties
* Remove lone comment block without accompanying function
Additionally, one parameter was renamed for clarity.
The e2e test for the contract deposit action was unnecessarily reliant
upon timing. After initiating a deposit, it would grab the first
transaction in the transaction list and assume it was the deposit that
it had just initiated. If it looked prior to the unapproved transaction
being added to the list, it would grab the wrong transaction.
It now looks specifically for _unconfirmed_ transactions, meaning it
will block until the deposit transaction is rendered.
This was discovered in testing a test-dapp PR:
https://github.com/MetaMask/test-dapp/pull/76
Refs #9663
See [`node/no-deprecated-api`][1] for more information.
This change enables `node/no-deprecated-api` and fixes the issues raised by the rule.
[1]:https://github.com/mysticatea/eslint-plugin-node/blob/v11.1.0/docs/rules/no-deprecated-api.md
The change to the way that `punycode` is imported is to address the fact that
third-party module is hidden by the built-in. This is a silly hack but it works.
`@metamask/eslint-config` has been updated to v4.1.0. This update
requires that we update `eslint` to v7 as well, which in turn requires
updating most `eslint`-related packages.
Most notably, `babel-eslint` was replaced with `@babel/eslint-parser`,
and `babel-eslint-plugin` was replaced by `@babel/eslint-plugin`. This
required renaming all the `babel/*` rules to `@babel/*`.
Most new or updated rules that resulted in lint errors have been
temporarily disabled. They will be fixed and re-enabled in subsequent
PRs.
* Delete localhost provider type
* Use ganache-cli default chain ID for tests
* Delete unused test firstTimeState variable
* Migrate default ganache-cli network to frequentRpcListDetail
* Add default test provider state
* Add test functionality to createJsonRpcClient
* Lint locales
* Update test middleware creation
* fixup! Update test middleware creation
* Only shows the swaps intro popup on mainnet
* Remove code that closes swaps popup from e2e tests
* correct casing on isMainnet prop in home component
* Remove network config store
* Remove inline networks variable in network controller
* Re-key network controller 'rpcTarget' to 'rpcUrl'
* Require chainId in lookupNetwork, implement eth_chainId
* Require chain ID in network form
* Add alert, migrations, and tests
* Add chainId validation to addToFrequentRpcList
* Update public config state selector to match new network controller
state
* Use network enums in networks-tab.constants
* Ensure chainId in provider config is current
* Update tests
Instead of using `eslint-plugin-json` for linting JSON files,
`prettier` is now used. `prettier` is capable of detecting and
correcting more problems than `eslint-plugin-json` can, such as
indentation.
All JSON files have been run through `prettier`. The changes are all
superficial.
* Fix require-unicode-regexp issues
See [`require-unicode-regexp`](https://eslint.org/docs/rules/require-unicode-regexp) for more information.
This change enables `require-unicode-regexp` and fixes the issues raised by the rule.
* Remove case-insensitive flag from regexps
This one gets a bit more complicated because the styles were interwoven and needed to be untangled to be moved. Essentially, though, the goal is to put the styles where they make the most sense and colocate them with their components.
This tests the `personal_sign` method using the test dapp. This test
reflects part of the `confirm-sig-requests` integration test, which
tests the confirmation of a `personal_sign` signature request.
A `data-testid` prop was added to the 'Sign' button on the signature
request confirmation page, to make it easier to select the 'Sign'
button reliably.
This updated test dapp has a new `personal_sign` button. It also fixes
the `Encrypt` button, which was broken in `v3.0.0`.
The `signature-request` e2e test needed to be updated to find the
'Sign' button by id rather than by text, since there are now two
buttons with the text 'Sign'.
The `withFixtures` helper function now has the option of starting the
test dapp as well. It will wait to ensure it has started up correctly,
and it'll shut it down when the test ends.
This test mirrors the `localization` integration test. It only tests
the display of fiat currency on the home page, and it only tests one
currency (`php`).
Both the primary and secondary balance components on `EthOverview` now
have `data-testid` props, so that they can be more easily referenced in
e2e tests.
This required the addition of a `data-testid` prop to the component
`UserPreferencedCurrencyDisplay`, which is passed through to the
underlying `CurrencyDisplay` component.
The e2e test helper function `withFixtures` now includes verbose
reporting on failure. Whenever a test fails, debugging information will
be saved to disk, just as with the other e2e test modules.
e2e test that use the `withFixtures` helper now check for console
errors after each successful test. If any errors are found, the test
fails.
It's currently enabled for Chrome only, because the Firefox driver
throws an error when you attempt to get the browser logs. Not sure why
exactly, but it's a long-standing problem.
The webdriver method `verboseReportOnFailure` had previously taken a
single parameter, `test`, which was an object representing the current
Mocha test. However, only one property was used (`title`).
Instead the `title` is now passed through directly. This was done to
make this function easier to use outside of a Mocha context.
The 'Expand view' button in the 'Account Options' menu was still being
shown on the fullscreen UI. This button is not useful in fullscreen, as
all it does is open the fullscreen UI. It is now hidden on the
fullscreen UI.
'Activity' is a better name for this tab because it contains more than
just transactions. Signature requests are also included, and more non-
transaction activity may be included in the future.
The entry for imported accounts in the account menu looked wrong with
the new connected site icon - there was no padding between the site
icon and the 'imported' label. The entry was pretty crowded with these
three symbols as well (the third being the 'x' used to remove the
account).
The site icon has been made the right-most icon, so that it lines up
with the site icons shown for other accounts, and spacing has been
added between the site icon and the 'imported' label.
The 'x' used to remove accounts has been removed. Accounts can still be
removed from the 'Account Options' menu on the Home screen. This seemed
like the wrong place for this button to exist, as it's the only action
that can be taken from that menu aside from navigation.
* refactor asset items to use list-item
Refactors the asset-list-item and token-cell to rely on the list-item
component for UI. Little changes were needed to the list-item code
to make this work! The result should be lots of eliminated code
Co-authored-by: Mark Stacey <markjstacey@gmail.com>
The "the transaction has the expected gas price" test was assuming the
fifth element with the `transaction-breakdown__value` class was the
element with the gas price. In practice that was sometimes not the
case, because some transaction detail fields would not be present, or
would appear after the first render.
The field is now looked up with a test id, ensuring it always finds the
correct field.
The e2e test for the "Hide token" functionality was incorrectly
clicking "Cancel" on the "Hide token" modal, thus not actually testing
that that token was hidden at all.
The "Confirm" button is now selected using a test id, to ensure the
wrong button isn't selected.
A new page has been created for viewing assets. This replaces the old
`selectedToken` state, which previously would augment the home page
to show token-specific information.
The new asset page shows the standard token overview as seen previously
on the home page, plus a history filtered to show just transactions
relevant to that token.
The actions that were available in the old token list menu have been
moved to a "Token Options" menu that mirrors the "Account Options"
menu.
The `selectedTokenAddress` state has been removed, as it is no longer
being used for anything.
`getMetaMetricState` has been renamed to `getBackgroundMetaMetricState`
because its sole purpose is extracting data from the background state
to send metrics from the background. It's not really a selector, but
it was convenient for it to use the same selectors the UI uses to
extract background data, so I left it there for now.
A new Redux store has been added to track state related to browser history.
The most recent "overview" page (i.e. the home page or the asset page) is
currently being tracked, so that actions taken from the asset page can return
the user back to the asset page when the action has finished.
The fullscreen UI now shows roughly the same design as the popup UI.
A few additional changes depicted in the new fullscreen designs will
be implemented in subsequent PRs (e.g. the inline buttons on assets)
This was done now to make asset pages easier to implement. Implementing
asset pages solely for the popup UI would have been complicated by the
fact that we use viewport size to switch between the two layouts, so we
would have had to re-route upon resizing the window.
The `AccountDetailsDropdown` component has been rewritten to use the
new `Menu` component, and to follow the latest designs.
This should be functionally equivalent. A couple of the icons have
changed, but that's about it.
Support for a subtitle was added to `MenuItem` to support the `origin`
subtitle used for the explorer link for custom RPC endpoints.
A few adjustments were required to `test/helper.js` to accommodate
the use of `Menu` from a JSDOM context (this is the first time it's
been used in a unit test). A `popover-content` element was added to the
fake DOM, and another global was added that `react-popper` used
internally.
An additional driver method (`clickPoint`) was added to the e2e driver
to allow clicking the background behind the menu to dismiss it. This
wasn't possible using the `clickElement` method, because that method
would refuse to click an obscured element. The only non-obscured
element to click was the menu backdrop, and that didn't work either
because the center was obscured by the menu (Selenium clicks the center
of whichever element is targeted).
The `TransactionViewBalance` component has been split into three
separate components. This was done primarily to make the asset page
easier to implement. Also the name `TransactionViewBalance` didn't
describe this component very well anymore.
Instead of the Ethereum and token-specific logic being in the same
component, the two cases were split into the `EthOverview` and
`TokenOverview` components respectively. They both use the
`WalletOverview` component, which has the structure shared by both
cases.
All asset list items now use the same component (`AssetListItem`).
Previously the tokens and the Ethereum balance were totally separate
components, despite being styled similarly.
Various unnecessary DOM elements and style rules were removed, but the
overall list looks identical to how it looked before.
The test for receiving ETH from a contract had been clicking on the
first transaction list item, assuming it was pending. This is not
necessarily true; if the pending transaction hadn't yet been rendered,
this could select the first confirmed transaction instead.
The test has been updated to look for the first _pending_ transaction,
rather than just the first transaction.
Note that this likely does not fix the intermittent failure we've been
experiencing. The failure has been observed with this fix in place.
This test would occasionally fail due to a fluke of timing, where a
pending transaction would take slightly longer than expected to
be rendered in the "confirmed transactions" list. This `wait` block
ensures the test will try again until it has confirmed.
The test artifact directory for failed test "verbose reports" was
mistakenly being set to `[browser]/undefined`. This was broken during
the refactor in #7798, when the `driver` parameter was mistakenly left
in after the `verboseReportOnFailure` function was converted to a
method being called on `driver`.
This state has been removed from the background. It was used for the
old UI, and has been unused for some time. A migration has been added
to delete this state as well.
The action creator responsible for updating this state has been removed
from the UI as well, along with the `callBackgroundThenUpdateNoSpinner`
convenience function, which was only used for this action.
Previously all browser globals were allowed to be used anywhere by
ESLint because we had set the `env` property to `browser` in the ESLint
config. This has made it easy to accidentally use browser globals
(e.g. #8338), so it has been removed. Instead we now have a short list
of allowed globals.
All browser globals are now accessed as properties on `window`.
Unfortunately this change resulted in a few different confusing unit
test errors, as some of our unit tests setup assumed that a particular
global would be used via `window` or `global`. In particular,
`window.fetch` didn't work correctly because it wasn't patched by the
AbortController polyfill (only `global.fetch` was being patched).
The `jsdom-global` package we were using complicated matters by setting
all of the JSDOM `window` properties directly on `global`, overwriting
the `AbortController` for example.
The `helpers.js` test setup module has been simplified somewhat by
removing `jsdom-global` and constructing the JSDOM instance manually.
The JSDOM window is set on `window`, and a few properties are set on
`global` as well as needed by various dependencies. `node-fetch` and
the AbortController polyfill/patch now work as expected as well,
though `fetch` is only available on `window` now.
* Add UI for selecting multiple accounts on the first permissions connect screen
* Make accounts list scrollable on connect screen
* Change title wording on connect screen to 'select your accounts'
* Add select all tooltip to info circle on top of connect screen account list
* Add security info footer to the first screen of the connect flow
* Apply redesigns to page 2 of connect flow
* Display number of accounts on connect flow second screen if there are multiple to connect
* Update e2e tests for connect screen multi-select changes
* Remove unused chooseAnAcount message
* Fix styling/display of redirect elements on second page of connect flow
* Assorted small fixes in permissions connect
* Remove unnecessary tiny delays in spec files
* Remove incorrect use of bem modified in choose-account
* Remove unused locale
* Use Set for managing selected accounts in choose-acount and permissions-connect componets
* Compone!
* Move connect flow header into a reusable component, and implement new header designs
* Update locales and add missing locales
* Improve permission list item design (second screen of connect flow)
* Check box component improvements
* Fixes in variables.scss
* Simplfy code in selectAll of choose-account.component
* Hide checkboxes on first pages on connect flow when there is only one account
* Allow autofill of default new account modal text with right arrow
* Disable next button on first screen of connect flow when no accounts selected
* Improve choose-account/index.scss
* Remove metamask secure graphic
* Fix connect flow redirect screen
* Fix connectToMultiple locale
* Remove locales no longer used after connect flow multiple connect updates
* Fix size of dapp icon on redirect screen of connect flow
* Clean up choose-account code
* Stop using placeholder in new-account-modal
* Remove unused styles in permission-page-container/index.scss
* Pass origin instead of site name to PermissionsConnectHeader in connect flow
* Make iconName a required prop in permissions-connect-header
* Show checkbox in cases where there is one account in the choose-account list
* Do not render select all checkbox when only 1 list item, instead of just hiding it
* Small cleanup in choose-account/index.scss
Two tabs have been created on the home screen: 'Assets' and 'History'.
This tabbed view is shown only on small screens (e.g. in the popup).
The fullscreen view is unchanged.
The toggle-able left sidebar no longer exists, so some 'sidebar-left'
specific code and styles have been removed. The button in the menu bar
has been removed as well.
The 'History' title of the transaction history is now redundant when
where are no pending transactions, so it as been conditionally hidden.
A passthrough for `data-testid` has been added to the Tab component for
convenience in e2e tests.
The 'Add Token' component has been redesigned to be more in-line with
the new home screen design. The description instructing the user to
click the 'Add Token' button has been removed, and the section itself
has been made roughly the same size as one of the list item. The text
now appears on just one line, overflowing to two if necessary.
The styles for the TokenCell component have been moved to be alongside
the component. They have also been renamed from `token-list-item` to
match the component name.
This commit updates the existing _Connected Sites_ section to a modal using
the `Popover` component. This will serve as a base for the new modal design.
