Skip to content

Commit

Permalink
Add test
Browse files Browse the repository at this point in the history
  • Loading branch information
darkwing committed Sep 22, 2023
1 parent cbcdef4 commit 9108e64
Show file tree
Hide file tree
Showing 4 changed files with 412 additions and 5 deletions.
339 changes: 339 additions & 0 deletions ui/components/app/asset-list/__snapshots__/asset-list.test.js.snap
Original file line number Diff line number Diff line change
@@ -0,0 +1,339 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`AssetList calculates the correct fiat account total 1`] = `
<div>
<div
class="mm-box token-balance-overview mm-box--padding-4 mm-box--display-flex mm-box--justify-content-space-between mm-box--align-items-center"
>
<div
class="mm-box token-balance-overview__balance"
>
<h2
class="mm-box mm-text token-balance-overview__secondary-balance mm-text--heading-lg mm-box--color-text-default"
>
$64,382.85
</h2>
</div>
<button
class="mm-box mm-text mm-button-base mm-button-base--size-md token-balance-portfolio mm-button-secondary mm-text--body-md-medium mm-box--padding-0 mm-box--padding-right-4 mm-box--padding-left-4 mm-box--display-inline-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-primary-default mm-box--background-color-transparent mm-box--rounded-pill mm-box--border-color-primary-default box--border-style-solid box--border-width-1"
>
Portfolio
<span
class="mm-box mm-icon mm-icon--size-sm mm-box--margin-inline-start-1 mm-box--display-inline-block mm-box--color-inherit"
style="mask-image: url('./images/icons/export.svg');"
/>
</button>
</div>
<div
class="mm-box multichain-token-list-item mm-box--display-flex mm-box--gap-4 mm-box--flex-direction-column"
data-testid="multichain-token-list-item"
>
<a
class="mm-box multichain-token-list-item__container-cell mm-box--padding-4 mm-box--display-flex mm-box--flex-direction-row"
data-testid="multichain-token-list-button"
href="#"
>
<div
class="mm-box mm-badge-wrapper mm-box--margin-right-3 mm-box--display-inline-block"
>
<div
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-md mm-avatar-token mm-avatar-token--with-halo mm-text--body-sm mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-transparent box--border-style-solid box--border-width-1"
>
<img
aria-hidden="true"
class="mm-avatar-token__token-image--blurred"
src="./images/eth_logo.png"
/>
<img
alt="ETH logo"
class="mm-avatar-token__token-image--size-reduced"
src="./images/eth_logo.png"
/>
</div>
<div
class="mm-box mm-badge-wrapper__badge-container mm-badge-wrapper__badge-container--circular-top-right"
>
<div
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-xs mm-avatar-network mm-text--body-xs mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-border-muted box--border-style-solid box--border-width-1"
>
?
</div>
</div>
</div>
<div
class="mm-box multichain-token-list-item__container-cell--text-container mm-box--display-flex mm-box--flex-direction-column mm-box--width-full"
style="flex-grow: 1; overflow: hidden;"
>
<div
class="mm-box mm-box--display-flex mm-box--gap-1 mm-box--justify-content-space-between"
>
<div
class="mm-box mm-box--width-1/3"
>
<p
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--ellipsis mm-box--color-text-default"
>
Ethereum
</p>
</div>
<p
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--text-align-end mm-box--width-2/3 mm-box--color-text-default"
>
$1.83 USD
</p>
</div>
<p
class="mm-box mm-text mm-text--body-md mm-box--color-text-alternative"
data-testid="multichain-token-list-item-value"
>
0.0011
ETH
</p>
</div>
</a>
</div>
<div>
<div
class="mm-box multichain-token-list-item mm-box--display-flex mm-box--gap-4 mm-box--flex-direction-column"
data-testid="multichain-token-list-item"
>
<a
class="mm-box multichain-token-list-item__container-cell mm-box--padding-4 mm-box--display-flex mm-box--flex-direction-row"
data-testid="multichain-token-list-button"
href="#"
>
<div
class="mm-box mm-badge-wrapper mm-box--margin-right-3 mm-box--display-inline-block"
>
<div
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-md mm-avatar-token mm-avatar-token--with-halo mm-text--body-sm mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-border-default box--border-style-solid box--border-width-1"
>
U
</div>
<div
class="mm-box mm-badge-wrapper__badge-container mm-badge-wrapper__badge-container--circular-top-right"
>
<div
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-xs mm-avatar-network mm-text--body-xs mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-border-muted box--border-style-solid box--border-width-1"
>
?
</div>
</div>
</div>
<div
class="mm-box multichain-token-list-item__container-cell--text-container mm-box--display-flex mm-box--flex-direction-column mm-box--width-full"
style="flex-grow: 1; overflow: hidden;"
>
<div
class="mm-box mm-box--display-flex mm-box--gap-1 mm-box--justify-content-space-between"
>
<div
class="mm-box mm-box--width-1/3"
>
<p
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--ellipsis mm-box--color-text-default"
>
USDC
</p>
</div>
<p
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--text-align-end mm-box--width-2/3 mm-box--color-text-default"
>
$199.36 USD
</p>
</div>
<p
class="mm-box mm-text mm-text--body-md mm-box--color-text-alternative"
data-testid="multichain-token-list-item-value"
>
199.4875
USDC
</p>
</div>
</a>
</div>
<div
class="mm-box multichain-token-list-item mm-box--display-flex mm-box--gap-4 mm-box--flex-direction-column"
data-testid="multichain-token-list-item"
>
<a
class="mm-box multichain-token-list-item__container-cell mm-box--padding-4 mm-box--display-flex mm-box--flex-direction-row"
data-testid="multichain-token-list-button"
href="#"
>
<div
class="mm-box mm-badge-wrapper mm-box--margin-right-3 mm-box--display-inline-block"
>
<div
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-md mm-avatar-token mm-avatar-token--with-halo mm-text--body-sm mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-border-default box--border-style-solid box--border-width-1"
>
L
</div>
<div
class="mm-box mm-badge-wrapper__badge-container mm-badge-wrapper__badge-container--circular-top-right"
>
<div
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-xs mm-avatar-network mm-text--body-xs mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-border-muted box--border-style-solid box--border-width-1"
>
?
</div>
</div>
</div>
<div
class="mm-box multichain-token-list-item__container-cell--text-container mm-box--display-flex mm-box--flex-direction-column mm-box--width-full"
style="flex-grow: 1; overflow: hidden;"
>
<div
class="mm-box mm-box--display-flex mm-box--gap-1 mm-box--justify-content-space-between"
>
<div
class="mm-box mm-box--width-1/3"
>
<p
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--ellipsis mm-box--color-text-default"
>
LINK
</p>
</div>
<p
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--text-align-end mm-box--width-2/3 mm-box--color-text-default"
>
$824.78 USD
</p>
</div>
<p
class="mm-box mm-text mm-text--body-md mm-box--color-text-alternative"
data-testid="multichain-token-list-item-value"
>
122.0005
LINK
</p>
</div>
</a>
</div>
<div
class="mm-box multichain-token-list-item mm-box--display-flex mm-box--gap-4 mm-box--flex-direction-column"
data-testid="multichain-token-list-item"
>
<a
class="mm-box multichain-token-list-item__container-cell mm-box--padding-4 mm-box--display-flex mm-box--flex-direction-row"
data-testid="multichain-token-list-button"
href="#"
>
<div
class="mm-box mm-badge-wrapper mm-box--margin-right-3 mm-box--display-inline-block"
>
<div
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-md mm-avatar-token mm-avatar-token--with-halo mm-text--body-sm mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-transparent box--border-style-solid box--border-width-1"
>
<img
aria-hidden="true"
class="mm-avatar-token__token-image--blurred"
src="https://s3.amazonaws.com/airswap-token-images/WBTC.png"
/>
<img
alt="WBTC logo"
class="mm-avatar-token__token-image--size-reduced"
src="https://s3.amazonaws.com/airswap-token-images/WBTC.png"
/>
</div>
<div
class="mm-box mm-badge-wrapper__badge-container mm-badge-wrapper__badge-container--circular-top-right"
>
<div
class="mm-box mm-text mm-avatar-base mm-avatar-base--size-xs mm-avatar-network mm-text--body-xs mm-text--text-transform-uppercase mm-box--display-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-background-alternative mm-box--rounded-full mm-box--border-color-border-muted box--border-style-solid box--border-width-1"
>
?
</div>
</div>
</div>
<div
class="mm-box multichain-token-list-item__container-cell--text-container mm-box--display-flex mm-box--flex-direction-column mm-box--width-full"
style="flex-grow: 1; overflow: hidden;"
>
<div
class="mm-box mm-box--display-flex mm-box--gap-1 mm-box--justify-content-space-between"
>
<div
class="mm-box mm-box--width-1/3"
>
<div>
<div
aria-describedby="tippy-tooltip-2"
class=""
data-original-title="null"
data-tooltipped=""
style="display: inline;"
tabindex="0"
>
<p
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--ellipsis mm-box--color-text-default"
>
Wrapped Bitcoin
</p>
</div>
</div>
</div>
<p
class="mm-box mm-text mm-text--body-md mm-text--font-weight-medium mm-text--text-align-end mm-box--width-2/3 mm-box--color-text-default"
>
$63,356.88 USD
</p>
</div>
<p
class="mm-box mm-text mm-text--body-md mm-box--color-text-alternative"
data-testid="multichain-token-list-item-value"
>
2.38
WBTC
</p>
</div>
</a>
</div>
</div>
<div
class="box box--margin-top-4 box--flex-direction-row"
>
<div
class="mm-box multichain-import-token-link mm-box--margin-4 mm-box--margin-bottom-2"
>
<div
class="mm-box mm-box--display-flex mm-box--align-items-center"
>
<button
class="mm-box mm-text mm-button-base mm-button-base--size-md mm-button-link mm-text--body-md-medium mm-box--padding-0 mm-box--padding-right-0 mm-box--padding-left-0 mm-box--display-inline-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-primary-default mm-box--background-color-transparent"
data-testid="import-token-button"
>
<span
class="mm-box mm-icon mm-icon--size-sm mm-box--margin-inline-end-1 mm-box--display-inline-block mm-box--color-inherit"
style="mask-image: url('./images/icons/add.svg');"
/>
Import tokens
</button>
</div>
<div
class="mm-box mm-box--padding-top-2 mm-box--display-flex mm-box--align-items-center"
>
<button
class="mm-box mm-text mm-button-base mm-button-base--size-md mm-button-link mm-text--body-md-medium mm-box--padding-0 mm-box--padding-right-0 mm-box--padding-left-0 mm-box--display-inline-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-primary-default mm-box--background-color-transparent"
data-testid="refresh-list-button"
>
<span
class="mm-box mm-icon mm-icon--size-sm mm-box--margin-inline-end-1 mm-box--display-inline-block mm-box--color-inherit"
style="mask-image: url('./images/icons/refresh.svg');"
/>
Refresh list
</button>
</div>
</div>
</div>
</div>
`;
Loading

0 comments on commit 9108e64

Please sign in to comment.