diff --git a/packages/product-components/src/components/SelectAssetModal/AssetItem.tsx b/packages/product-components/src/components/SelectAssetModal/AssetItem.tsx
index de53bf25259..4f95ae2f18f 100644
--- a/packages/product-components/src/components/SelectAssetModal/AssetItem.tsx
+++ b/packages/product-components/src/components/SelectAssetModal/AssetItem.tsx
@@ -30,6 +30,7 @@ const BadgeWrapper = styled.div`
interface AssetItemProps extends AssetOptionBaseProps {
handleClick: (selectedAsset: AssetOptionBaseProps) => void;
+ 'data-testid'?: string;
}
export const AssetItem = ({
@@ -41,6 +42,7 @@ export const AssetItem = ({
shouldTryToFetch,
contractAddress,
handleClick,
+ 'data-testid': dataTestId,
}: AssetItemProps) => {
const getCoinLogo = () =>
isCoinSymbol(symbol) ? : null;
@@ -58,7 +60,7 @@ export const AssetItem = ({
})
}
>
-
+
{coingeckoId ? (
void;
networkCount: number;
+ 'data-testid'?: string;
}
-export const NetworkTabs = ({ tabs, activeTab, setActiveTab, networkCount }: NetworkTabsProps) => {
+export const NetworkTabs = ({
+ tabs,
+ activeTab,
+ setActiveTab,
+ networkCount,
+ 'data-testid': dataTestId,
+}: NetworkTabsProps) => {
const { elevation } = useElevation();
// TODO: FormattedMessage - resolve messages sharing https://github.com/trezor/trezor-suite/issues/5325}
@@ -47,6 +54,7 @@ export const NetworkTabs = ({ tabs, activeTab, setActiveTab, networkCount }: Net
{
@@ -71,6 +79,7 @@ export const NetworkTabs = ({ tabs, activeTab, setActiveTab, networkCount }: Net
{tabs.map(network => (
void;
+ 'data-testid'?: string;
}
-export const SearchAsset = ({ searchPlaceholder, search, setSearch }: SearchAssetProps) => (
+export const SearchAsset = ({
+ searchPlaceholder,
+ search,
+ setSearch,
+ 'data-testid': dataTestId,
+}: SearchAssetProps) => (
setSearch(event.target.value)}
diff --git a/packages/product-components/src/components/SelectAssetModal/SelectAssetModal.tsx b/packages/product-components/src/components/SelectAssetModal/SelectAssetModal.tsx
index 131b1c58edf..920074e563e 100644
--- a/packages/product-components/src/components/SelectAssetModal/SelectAssetModal.tsx
+++ b/packages/product-components/src/components/SelectAssetModal/SelectAssetModal.tsx
@@ -33,6 +33,7 @@ export interface SelectAssetModalProps {
searchInput?: ReactNode;
filterTabs?: ReactNode;
noItemsAvailablePlaceholder: { heading: ReactNode; body?: ReactNode };
+ 'data-testid'?: string;
}
export const SelectAssetModal = ({
@@ -42,6 +43,7 @@ export const SelectAssetModal = ({
filterTabs,
searchInput,
noItemsAvailablePlaceholder,
+ 'data-testid': dataTestId,
}: SelectAssetModalProps) => {
const intl = useIntl();
@@ -90,6 +92,7 @@ export const SelectAssetModal = ({
shouldTryToFetch,
}: AssetProps) => (
{
return labelWithFlag.substring(labelWithFlag.indexOf(' ') + 1);
};
+type paymentMethods =
+ | 'googlePay'
+ | 'applePay'
+ | 'creditCard'
+ | 'paypal'
+ | 'bankTransfer'
+ | 'revolutPay';
+
export class MarketActions {
readonly offerSpinner: Locator;
readonly section: Locator;
readonly form: Locator;
readonly bestOfferProvider: Locator;
- readonly bestOfferYouGet: Locator;
+ readonly bestOfferSection: Locator;
readonly bestOfferAmount: Locator;
readonly buyBestOfferButton: Locator;
readonly youPayInput: Locator;
readonly youPayCurrencyDropdown: Locator;
readonly youPayCurrencyOption = (currency: FiatCurrencyCode) =>
this.page.getByTestId(`@coinmarket/form/fiat-currency-select/option/${currency}`);
+ readonly youPayFiatCryptoSwitchButton: Locator;
+ readonly youPayFractionButton = (amount: '10%' | '25%' | '50%' | 'Max') =>
+ this.page.getByRole('button', { name: amount });
+ readonly feeButton = (fee: 'economy' | 'normal' | 'high' | 'custom') =>
+ this.page.getByTestId(`select-bar/${fee}`);
+ readonly customFeeInput: Locator;
readonly countryOfResidenceDropdown: Locator;
readonly countryOfResidenceOption = (countryCode: string) =>
this.page.getByTestId(`@coinmarket/form/country-select/option/${countryCode}`);
+ readonly accountDropdown: Locator;
+ readonly accountSearchInput: Locator;
+ readonly accountTabFilter = (tab: 'all-networks' | 'eth' | 'pol' | 'bsc' | 'sol') =>
+ this.page.getByTestId(`@coinmarket/form/select-crypto/network-tab/${tab}`);
+ readonly accountOption = (cryptoName: string, symbol: NetworkSymbol) =>
+ this.page.getByTestId(`@coinmarket/form/select-crypto/option/${cryptoName}-${symbol}`);
+ readonly paymentMethodDropdown: Locator;
+ readonly paymentMethodOption = (method: paymentMethods) =>
+ this.page.getByTestId(`@coinmarket/form/payment-method-select/option/${method}`);
readonly buyOffersPage: Locator;
readonly compareButton: Locator;
readonly quotes: Locator;
@@ -37,6 +61,7 @@ export class MarketActions {
this.page.getByTestId(`@coinmarket/offers/quote-${provider}`);
readonly quoteProvider: Locator;
readonly quoteAmount: Locator;
+ readonly refreshTime: Locator;
readonly selectThisQuoteButton: Locator;
readonly modal: Locator;
readonly buyTermsConfirmButton: Locator;
@@ -53,21 +78,33 @@ export class MarketActions {
this.section = this.page.getByTestId('@coinmarket');
this.form = this.page.getByTestId('@coinmarket/form');
this.bestOfferProvider = this.page.getByTestId('@coinmarket/offers/quote/provider');
- this.bestOfferYouGet = this.page.getByTestId('@coinmarket/best-offer/amount');
- this.bestOfferAmount = this.page.getByTestId('@coinmarket/form/offer/crypto-amount');
+ this.bestOfferSection = this.page.getByTestId('@coinmarket/best-offer');
+ this.bestOfferAmount = this.page.getByTestId('@coinmarket/best-offer/amount');
this.buyBestOfferButton = this.page.getByTestId('@coinmarket/form/buy-button');
this.youPayInput = this.page.getByTestId('@coinmarket/form/fiat-input');
this.youPayCurrencyDropdown = this.page.getByTestId(
'@coinmarket/form/fiat-currency-select/input',
);
+ this.youPayFiatCryptoSwitchButton = this.page.getByTestId(
+ '@coinmarket/form/switch-crypto-fiat',
+ );
+ this.customFeeInput = this.page.getByTestId('feePerUnit');
this.countryOfResidenceDropdown = this.page.getByTestId(
'@coinmarket/form/country-select/input',
);
+ this.accountDropdown = this.page.getByTestId('@coinmarket/form/select-crypto/input');
+ this.accountSearchInput = this.page.getByTestId(
+ '@coinmarket/form/select-crypto/search-input',
+ );
+ this.paymentMethodDropdown = this.page.getByTestId(
+ '@coinmarket/form/payment-method-select/input',
+ );
this.buyOffersPage = this.page.getByTestId('@coinmarket/buy-offers');
this.compareButton = this.page.getByTestId('@coinmarket/form/compare-button');
this.quotes = this.page.getByTestId('@coinmarket/offers/quote');
this.quoteProvider = this.page.getByTestId('@coinmarket/offers/quote/provider');
this.quoteAmount = this.page.getByTestId('@coinmarket/offers/quote/crypto-amount');
+ this.refreshTime = this.page.getByTestId('@coinmarket/refresh-time');
this.selectThisQuoteButton = this.page.getByTestId(
'@coinmarket/offers/get-this-deal-button',
);
@@ -120,6 +157,19 @@ export class MarketActions {
await this.youPayCurrencyOption(currencyCode).click();
}
+ @step()
+ async selectAccount(cryptoName: string, symbol: NetworkSymbol) {
+ await this.accountDropdown.click();
+ await this.accountSearchInput.fill(cryptoName);
+ await this.accountOption(cryptoName, symbol).click();
+ }
+
+ @step()
+ async selectPaymentMethod(method: paymentMethods) {
+ await this.paymentMethodDropdown.click();
+ await this.paymentMethodOption(method).click();
+ }
+
@step()
async setYouPayAmount(
amount: string,
diff --git a/packages/suite-desktop-core/e2e/tests/coin-market/buy-coins.test.ts b/packages/suite-desktop-core/e2e/tests/coin-market/buy-coins.test.ts
index 77c6a892061..2c300223f95 100644
--- a/packages/suite-desktop-core/e2e/tests/coin-market/buy-coins.test.ts
+++ b/packages/suite-desktop-core/e2e/tests/coin-market/buy-coins.test.ts
@@ -14,7 +14,7 @@ test.describe('Coin market buy', { tag: ['@group=other'] }, () => {
await test.step('Fill input amount and opens offer comparison', async () => {
await marketPage.setYouPayAmount('1234');
await expect(marketPage.section).toHaveScreenshot('buy-coins-layout.png', {
- mask: [marketPage.bestOfferYouGet, marketPage.bestOfferProvider],
+ mask: [marketPage.bestOfferSection, marketPage.bestOfferProvider],
});
await marketPage.compareButton.click();
});
diff --git a/packages/suite-desktop-core/e2e/tests/coin-market/exchange-coins.test.ts b/packages/suite-desktop-core/e2e/tests/coin-market/exchange-coins.test.ts
index bc277635864..b70ebf9f97e 100644
--- a/packages/suite-desktop-core/e2e/tests/coin-market/exchange-coins.test.ts
+++ b/packages/suite-desktop-core/e2e/tests/coin-market/exchange-coins.test.ts
@@ -33,10 +33,10 @@ test.describe('Coinmarket Exchange', { tag: ['@group=other'] }, () => {
});
await page
- .getByTestId('@coinmarket/form/select-account/input')
+ .getByTestId('@coinmarket/form/select-crypto/input')
.getByRole('combobox')
.fill('ETH');
- await page.getByTestId('@coinmarket/form/select-account/option/ethereum').first().click();
+ await page.getByTestId('@coinmarket/form/select-crypto/option/ethereum').first().click();
await page.getByTestId('@coinmarket/form/crypto-input').fill('0.005');
await expect(page.getByText('Not enough funds')).toBeVisible();
diff --git a/packages/suite-desktop-core/eslint.config.mjs b/packages/suite-desktop-core/eslint.config.mjs
index 716b17d4eec..9a1b13fefeb 100644
--- a/packages/suite-desktop-core/eslint.config.mjs
+++ b/packages/suite-desktop-core/eslint.config.mjs
@@ -18,6 +18,6 @@ export default [
},
},
{
- ignores: ['**/playwright-report/'],
+ ignores: ['**/playwright-report/', '**/test-results/'],
},
];
diff --git a/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormInput/CoinmarketFormInputAccount.tsx b/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormInput/CoinmarketFormInputAccount.tsx
index 5e8ba0a1aa6..5c956c5c446 100644
--- a/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormInput/CoinmarketFormInputAccount.tsx
+++ b/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormInput/CoinmarketFormInputAccount.tsx
@@ -87,7 +87,7 @@ export const CoinmarketFormInputAccount = <
isSelected={context === 'value'}
/>
)}
- data-testid="@coinmarket/form/select-account"
+ data-testid="@coinmarket/form/select-crypto"
isClearable={false}
isSearchable
bottomText={
diff --git a/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormInput/CoinmarketFormInputCryptoSelect.tsx b/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormInput/CoinmarketFormInputCryptoSelect.tsx
index 0a2168c45ee..48865b02003 100644
--- a/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormInput/CoinmarketFormInputCryptoSelect.tsx
+++ b/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormInput/CoinmarketFormInputCryptoSelect.tsx
@@ -201,11 +201,13 @@ export const CoinmarketFormInputCryptoSelect = <
<>
{isModalActive && (
setIsModalActive(false)}
searchInput={
(
{
toggleAmountInCrypto();
diff --git a/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormOffer.tsx b/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormOffer.tsx
index 745774d7dfd..9b0b7439647 100644
--- a/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormOffer.tsx
+++ b/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormOffer.tsx
@@ -79,7 +79,7 @@ export const CoinmarketFormOffer = () => {
return (
-
+
{shouldDisplayFiatAmount ? (
diff --git a/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormOfferFiatAmount.tsx b/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormOfferFiatAmount.tsx
index 46dbffe3704..ce384bb7479 100644
--- a/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormOfferFiatAmount.tsx
+++ b/packages/suite/src/views/wallet/coinmarket/common/CoinmarketForm/CoinmarketFormOfferFiatAmount.tsx
@@ -15,7 +15,11 @@ export const CoinmarketFormOfferFiatAmount = ({ amount }: CoinmarketFormOfferFia
return (
-
+
{formattedAmount}
diff --git a/packages/suite/src/views/wallet/coinmarket/common/CoinmarketRefreshTime.tsx b/packages/suite/src/views/wallet/coinmarket/common/CoinmarketRefreshTime.tsx
index 8ba3df3f2c5..df1c4eb2a28 100644
--- a/packages/suite/src/views/wallet/coinmarket/common/CoinmarketRefreshTime.tsx
+++ b/packages/suite/src/views/wallet/coinmarket/common/CoinmarketRefreshTime.tsx
@@ -63,7 +63,7 @@ export const CoinmarketRefreshTime = ({
-
+
{label}
{`0:${remaining < 10 ? '0' : ''}${remaining}`}
diff --git a/packages/suite/src/views/wallet/coinmarket/common/CoinmarketSelectedOffer/CoinmarketVerify/CoinmarketVerifyOptions.tsx b/packages/suite/src/views/wallet/coinmarket/common/CoinmarketSelectedOffer/CoinmarketVerify/CoinmarketVerifyOptions.tsx
index 50a9f6e5e86..c5ee6355eff 100644
--- a/packages/suite/src/views/wallet/coinmarket/common/CoinmarketSelectedOffer/CoinmarketVerify/CoinmarketVerifyOptions.tsx
+++ b/packages/suite/src/views/wallet/coinmarket/common/CoinmarketSelectedOffer/CoinmarketVerify/CoinmarketVerifyOptions.tsx
@@ -28,6 +28,7 @@ export const CoinmarketVerifyOptions = ({
return (