Skip to content

Commit 715dc8c

Browse files
ljagielaljagiela
authored
test(extension): [LW-8666] add e2e tests for staking empty states & start staking (#681)
1 parent 6e9495b commit 715dc8c

File tree

12 files changed

+357
-20
lines changed

12 files changed

+357
-20
lines changed

‎packages/e2e-tests/src/assert/multidelegation/MultidelegationPageAssert.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,13 @@ class MultidelegationPageAssert {
3131
expect(await MultidelegationPage.title.getText()).to.equal(await t('staking.sectionTitle'));
3232
};
3333

34+
assertSeeTabs = async () => {
35+
await MultidelegationPage.overviewTab.waitForDisplayed();
36+
expect(await MultidelegationPage.overviewTab.getText()).to.equal(await t('root.nav.overviewTitle', 'staking'));
37+
await MultidelegationPage.browseTab.waitForDisplayed();
38+
expect(await MultidelegationPage.browseTab.getText()).to.equal(await t('root.nav.browsePoolsTitle', 'staking'));
39+
};
40+
3441
assertSeeDelegationCardDetailsInfo = async () => {
3542
expect(await MultidelegationPage.delegationCardBalanceLabel.getText()).to.equal(
3643
await t('overview.delegationCard.label.balance', 'staking')

‎packages/e2e-tests/src/assert/multidelegation/StartStakingPageAssert.ts

Lines changed: 109 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,109 @@
1+
import { expect } from 'chai';
2+
import { t } from '../../utils/translationService';
3+
import StartStakingPage from '../../elements/multidelegation/StartStakingPage';
4+
import extensionUtils from '../../utils/utils';
5+
import MultidelegationPageAssert from './MultidelegationPageAssert';
6+
7+
const maxPools = '10';
8+
9+
class StartStakingPageAssert {
10+
assertSeeStartStakingBanner = async (expectedAdaBalance: string) => {
11+
await StartStakingPage.bannerContainer.waitForDisplayed();
12+
13+
await StartStakingPage.bannerTitle.waitForDisplayed();
14+
expect(await StartStakingPage.bannerTitle.getText()).to.equal(await t('overview.noStaking.title', 'staking'));
15+
await StartStakingPage.bannerDescription.waitForDisplayed();
16+
expect(await StartStakingPage.bannerDescription.getText()).to.equal(
17+
(await t('overview.noStaking.description', 'staking')).replace('{{maxPools}}', maxPools)
18+
);
19+
await StartStakingPage.bannerBalanceTitle.waitForDisplayed();
20+
expect(await StartStakingPage.bannerBalanceTitle.getText()).to.equal(
21+
await t('overview.noStaking.balanceTitle', 'staking')
22+
);
23+
24+
await StartStakingPage.bannerBalanceValue.waitForDisplayed();
25+
expect(await StartStakingPage.bannerBalanceValue.getText()).to.equal(expectedAdaBalance);
26+
27+
await StartStakingPage.bannerBalanceSymbol.waitForDisplayed();
28+
expect(await StartStakingPage.bannerBalanceSymbol.getText()).to.equal(extensionUtils.isMainnet() ? 'ADA' : 'tADA');
29+
};
30+
31+
assertSeeStartStakingSteps = async () => {
32+
await StartStakingPage.getStartedTitle.waitForDisplayed();
33+
expect(await StartStakingPage.getStartedTitle.getText()).to.equal(
34+
await t('overview.noStaking.getStarted', 'staking')
35+
);
36+
await StartStakingPage.getStartedDescription.waitForDisplayed();
37+
expect(await StartStakingPage.getStartedDescription.getText()).to.equal(
38+
await t('overview.noStaking.followSteps', 'staking')
39+
);
40+
41+
await StartStakingPage.getStartedStep1Title.waitForDisplayed();
42+
expect(await StartStakingPage.getStartedStep1Title.getText()).to.equal(
43+
await t('overview.noStaking.searchForPoolTitle', 'staking')
44+
);
45+
await StartStakingPage.getStartedStep1Description.waitForDisplayed();
46+
expect(await StartStakingPage.getStartedStep1Description.getText()).to.equal(
47+
(await t('overview.noStaking.searchForPoolDescription', 'staking')).replace('<Link>', '').replace('</Link>', '')
48+
);
49+
50+
await StartStakingPage.getStartedStep2Title.waitForDisplayed();
51+
expect(await StartStakingPage.getStartedStep2Title.getText()).to.equal(
52+
await t('overview.noStaking.selectPoolsTitle', 'staking')
53+
);
54+
await StartStakingPage.getStartedStep2Description.waitForDisplayed();
55+
expect(await StartStakingPage.getStartedStep2Description.getText()).to.equal(
56+
(await t('overview.noStaking.selectPoolsDescription', 'staking'))
57+
.replace('<Link>', '')
58+
.replace('</Link>', '')
59+
.replace('{{maxPools}}', maxPools)
60+
);
61+
};
62+
63+
assertDoNotSeeStartStakingSteps = async () => {
64+
await StartStakingPage.getStartedTitle.waitForDisplayed({ reverse: true });
65+
await StartStakingPage.getStartedDescription.waitForDisplayed({ reverse: true });
66+
await StartStakingPage.getStartedStep1Title.waitForDisplayed({ reverse: true });
67+
await StartStakingPage.getStartedStep1Description.waitForDisplayed({ reverse: true });
68+
await StartStakingPage.getStartedStep2Title.waitForDisplayed({ reverse: true });
69+
await StartStakingPage.getStartedStep2Description.waitForDisplayed({ reverse: true });
70+
};
71+
72+
assertSeeExpandedViewBanner = async () => {
73+
await StartStakingPage.expandedViewBannerContainer.waitForDisplayed();
74+
await StartStakingPage.expandedViewBannerTitle.waitForDisplayed();
75+
expect(await StartStakingPage.expandedViewBannerTitle.getText()).to.equal(
76+
await t('popup.expandBanner.title', 'staking')
77+
);
78+
await StartStakingPage.expandedViewBannerDescription.waitForDisplayed();
79+
expect(await StartStakingPage.expandedViewBannerDescription.getText()).to.equal(
80+
await t('popup.expandBanner.description', 'staking')
81+
);
82+
await StartStakingPage.expandedViewBannerButton.waitForDisplayed();
83+
expect(await StartStakingPage.expandedViewBannerButton.getText()).to.equal(
84+
await t('popup.expandBanner.button', 'staking')
85+
);
86+
};
87+
88+
assertDoNotSeeExpandedViewBanner = async () => {
89+
await StartStakingPage.expandedViewBannerContainer.waitForDisplayed({ reverse: true });
90+
await StartStakingPage.expandedViewBannerTitle.waitForDisplayed({ reverse: true });
91+
await StartStakingPage.expandedViewBannerDescription.waitForDisplayed({ reverse: true });
92+
await StartStakingPage.expandedViewBannerButton.waitForDisplayed({ reverse: true });
93+
};
94+
95+
assertSeeStartStakingPage = async (expectedAdaBalance: string, mode: 'extended' | 'popup') => {
96+
await MultidelegationPageAssert.assertSeeTitle();
97+
await this.assertSeeStartStakingBanner(expectedAdaBalance);
98+
if (mode === 'extended') {
99+
await MultidelegationPageAssert.assertSeeTabs();
100+
await this.assertSeeStartStakingSteps();
101+
await this.assertDoNotSeeExpandedViewBanner();
102+
} else {
103+
await this.assertDoNotSeeStartStakingSteps();
104+
await this.assertSeeExpandedViewBanner();
105+
}
106+
};
107+
}
108+
109+
export default new StartStakingPageAssert();

‎packages/e2e-tests/src/elements/multidelegation/StartStakingPage.ts

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
class StartStakingPage {
2+
private BANNER_CONTAINER = '[data-testid="stake-funds-banner-container"]';
3+
private BANNER_TITLE = '[data-testid="stake-funds-banner-title"]';
4+
private BANNER_DESCRIPTION = '[data-testid="stake-funds-banner-description"]';
5+
private BANNER_BALANCE_TITLE = '[data-testid="stake-funds-banner-balance-title"]';
6+
private BANNER_BALANCE_VALUE = '[data-testid="stake-funds-banner-balance-value"]';
7+
private BANNER_BALANCE_SYMBOL = '[data-testid="stake-funds-banner-balance-symbol"]';
8+
private GET_STARTED_TITLE = '[data-testid="get-started-title"]';
9+
private GET_STARTED_DESCRIPTION = '[data-testid="get-started-description"]';
10+
private GET_STARTED_STEP_1_TITLE = '[data-testid="get-started-step1-title"]';
11+
private GET_STARTED_STEP_1_DESCRIPTION = '[data-testid="get-started-step1-description"]';
12+
private GET_STARTED_STEP_1_LINK = '[data-testid="get-started-step1-link"]';
13+
private GET_STARTED_STEP_2_TITLE = '[data-testid="get-started-step2-title"]';
14+
private GET_STARTED_STEP_2_DESCRIPTION = '[data-testid="get-started-step2-description"]';
15+
private GET_STARTED_STEP_2_LINK = '[data-testid="get-started-step2-link"]';
16+
private EXPANDED_VIEW_BANNER_CONTAINER = '[data-testid="expanded-view-banner-container"]';
17+
private EXPANDED_VIEW_BANNER_TITLE = '[data-testid="expanded-view-banner-title"]';
18+
private EXPANDED_VIEW_BANNER_DESCRIPTION = '[data-testid="expanded-view-banner-description"]';
19+
private EXPANDED_VIEW_BANNER_BUTTON = '[data-testid="expanded-view-banner-button"]';
20+
21+
get bannerContainer() {
22+
return $(this.BANNER_CONTAINER);
23+
}
24+
25+
get bannerTitle() {
26+
return $(this.BANNER_TITLE);
27+
}
28+
29+
get bannerDescription() {
30+
return $(this.BANNER_DESCRIPTION);
31+
}
32+
33+
get bannerBalanceTitle() {
34+
return $(this.BANNER_BALANCE_TITLE);
35+
}
36+
37+
get bannerBalanceValue() {
38+
return $(this.BANNER_BALANCE_VALUE);
39+
}
40+
41+
get bannerBalanceSymbol() {
42+
return $(this.BANNER_BALANCE_SYMBOL);
43+
}
44+
45+
get getStartedTitle() {
46+
return $(this.GET_STARTED_TITLE);
47+
}
48+
49+
get getStartedDescription() {
50+
return $(this.GET_STARTED_DESCRIPTION);
51+
}
52+
53+
get getStartedStep1Title() {
54+
return $(this.GET_STARTED_STEP_1_TITLE);
55+
}
56+
57+
get getStartedStep1Description() {
58+
return $(this.GET_STARTED_STEP_1_DESCRIPTION);
59+
}
60+
61+
get getStartedStep1Link() {
62+
return $(this.GET_STARTED_STEP_1_LINK);
63+
}
64+
65+
get getStartedStep2Title() {
66+
return $(this.GET_STARTED_STEP_2_TITLE);
67+
}
68+
69+
get getStartedStep2Description() {
70+
return $(this.GET_STARTED_STEP_2_DESCRIPTION);
71+
}
72+
73+
get getStartedStep2Link() {
74+
return $(this.GET_STARTED_STEP_2_LINK);
75+
}
76+
77+
get expandedViewBannerContainer() {
78+
return $(this.EXPANDED_VIEW_BANNER_CONTAINER);
79+
}
80+
81+
get expandedViewBannerTitle() {
82+
return $(this.EXPANDED_VIEW_BANNER_TITLE);
83+
}
84+
85+
get expandedViewBannerDescription() {
86+
return $(this.EXPANDED_VIEW_BANNER_DESCRIPTION);
87+
}
88+
89+
get expandedViewBannerButton() {
90+
return $(this.EXPANDED_VIEW_BANNER_BUTTON);
91+
}
92+
93+
async clickGetStartedStep1Link() {
94+
await this.getStartedStep1Link.click();
95+
}
96+
97+
async clickGetStartedStep2Link() {
98+
await this.getStartedStep2Link.click();
99+
}
100+
101+
async clickExpandedViewBannerButton() {
102+
await this.expandedViewBannerButton.click();
103+
}
104+
}
105+
106+
export default new StartStakingPage();

‎packages/e2e-tests/src/features/EmptyStatesExtended.feature

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ Feature: Empty states
2727
When I click "Copy" button on empty state banner
2828
Then I see a toast with message: "general.clipboard.copiedToClipboard"
2929

30-
@LW-4446
30+
@LW-8447
3131
Scenario: Extended View - Staking empty state
3232
When I disable showing Multidelegation beta banner
3333
And I navigate to Staking extended page

‎packages/e2e-tests/src/features/EmptyStatesPopup.feature

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ Feature: Empty states
2626
When I click "Copy" button on empty state banner
2727
Then I see a toast with message: "general.clipboard.copiedToClipboard"
2828

29-
@LW-4449
29+
@LW-8470
3030
Scenario: Popup View - Staking empty state
3131
When I disable showing Multidelegation beta banner
3232
And I navigate to Staking popup page

‎packages/e2e-tests/src/features/MultiDelegationPageExtended.feature

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,23 @@ Feature: Staking Page - Extended View
44
Background:
55
Given Lace is ready for test
66

7+
@LW-8931 @Testnet
8+
Scenario: Extended View - Start Staking component
9+
Given I save token: "Cardano" balance
10+
And I disable showing Multidelegation beta banner
11+
When I navigate to Staking extended page
12+
Then I see Start Staking page in extended mode
13+
14+
@LW-8932 @Testnet
15+
Scenario Outline: Extended View - Start staking - step link <link_number> click
16+
Given I am on Start Staking page in extended mode
17+
When I click "Get Started" step <link_number> link
18+
Then <expected_step>
19+
Examples:
20+
| link_number | expected_step |
21+
| 1 | I see the stake pool search control with appropriate content |
22+
| 2 | New tab with url containing "lace.io/faq?question=what-are-staking-and-delegation" is opened |
23+
724
@LW-8449 @Testnet @Mainnet
825
Scenario: Extended View - Staking search control is displayed with appropriate content
926
Given I disable showing Multidelegation beta banner

‎packages/e2e-tests/src/features/MultiDelegationPagePopup.feature

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
@Staking-NonDelegatedFunds-Popup
2+
Feature: Staking Page - Popup View
3+
4+
Background:
5+
Given Lace is ready for test
6+
7+
@LW-8933 @Testnet
8+
Scenario: Popup View - Start Staking component
9+
Given I save token: "Cardano" balance
10+
And I disable showing Multidelegation beta banner
11+
When I navigate to Staking popup page
12+
Then I see Start Staking page in popup mode
13+
14+
@LLW-8934 @Testnet
15+
Scenario: Popup View - Start Staking - "Expanded view" button click
16+
Given I am on Start Staking page in popup mode
17+
When I click "Expand view" on Start Staking page
18+
And I switch to last window
19+
Then I see Lace extension main page in extended mode
20+

‎packages/e2e-tests/src/hooks/beforeTagHooks.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -107,6 +107,11 @@ Before(
107107
async () => await extendedViewWalletInitialization(TestWalletName.TAWalletNonDelegatedFunds)
108108
);
109109

110+
Before(
111+
{ tags: '@Staking-NonDelegatedFunds-Popup' },
112+
async () => await popupViewWalletInitialization(TestWalletName.TAWalletNonDelegatedFunds)
113+
);
114+
110115
Before(
111116
{ tags: '@Staking-SwitchingPools-Extended-E2E' },
112117
async () => await extendedViewWalletInitialization(TestWalletName.WalletSwitchPoolsE2E)

‎packages/e2e-tests/src/steps/multidelegationSteps.ts

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,11 @@ import transactionDetailsAssert from '../assert/transactionDetailsAssert';
1919
import StakingPasswordDrawerAssert from '../assert/multidelegation/StakingPasswordDrawerAssert';
2020
import StakingConfirmationDrawerAssert from '../assert/multidelegation/StakingConfirmationDrawerAssert';
2121
import StakingManageDrawerAssert from '../assert/multidelegation/StakingManageDrawerAssert';
22+
import StartStakingPageAssert from '../assert/multidelegation/StartStakingPageAssert';
23+
import TokensPageObject from '../pageobject/tokensPageObject';
24+
import localStorageInitializer from '../fixture/localStorageInitializer';
25+
import mainMenuPageObject from '../pageobject/mainMenuPageObject';
26+
import StartStakingPage from '../elements/multidelegation/StartStakingPage';
2227

2328
Given(/^I click (Overview|Browse pools) tab$/, async (tabToClick: 'Overview' | 'Browse pools') => {
2429
await MultidelegationPage.clickOnTab(tabToClick);
@@ -254,3 +259,27 @@ When(/^I'm on a delegation flow "([^"]*)"$/, async (delegationStep: string) => {
254259
break;
255260
}
256261
});
262+
263+
Then(/^I see Start Staking page in (extended|popup) mode$/, async (mode: 'extended' | 'popup') => {
264+
const cardanoBalance = String(await TokensPageObject.loadTokenBalance('Cardano'));
265+
await StartStakingPageAssert.assertSeeStartStakingPage(cardanoBalance, mode);
266+
});
267+
268+
Given(/^I am on Start Staking page in (extended|popup) mode$/, async (mode: 'extended' | 'popup') => {
269+
await TokensPageObject.waitUntilCardanoTokenLoaded();
270+
await TokensPageObject.saveTokenBalance('Cardano');
271+
await localStorageInitializer.disableShowingMultidelegationBetaBanner();
272+
await mainMenuPageObject.navigateToSection('Staking', mode);
273+
const cardanoBalance = String(await TokensPageObject.loadTokenBalance('Cardano'));
274+
await StartStakingPageAssert.assertSeeStartStakingPage(cardanoBalance, mode);
275+
});
276+
277+
Then(/^I click "Get Started" step (1|2) link$/, async (linkNumber: '1' | '2') => {
278+
await (linkNumber === '1'
279+
? StartStakingPage.clickGetStartedStep1Link()
280+
: StartStakingPage.clickGetStartedStep2Link());
281+
});
282+
283+
Given(/^I click "Expand view" on Start Staking page$/, async () => {
284+
await StartStakingPage.clickExpandedViewBannerButton();
285+
});

‎packages/staking/src/features/overview/ExpandViewBanner.tsx

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -12,10 +12,20 @@ export const ExpandViewBanner = (): React.ReactElement => {
1212

1313
return (
1414
<div className={styles.wrapper}>
15-
<div className={styles.container}>
16-
<div className={styles.title}>{t('popup.expandBanner.title')}</div>
17-
<div className={styles.description}>{t('popup.expandBanner.description')}</div>
18-
<Button onClick={expandStakingView} className={styles.button} size="large" color="gradient">
15+
<div className={styles.container} data-testid="expanded-view-banner-container">
16+
<div className={styles.title} data-testid="expanded-view-banner-title">
17+
{t('popup.expandBanner.title')}
18+
</div>
19+
<div className={styles.description} data-testid="expanded-view-banner-description">
20+
{t('popup.expandBanner.description')}
21+
</div>
22+
<Button
23+
onClick={expandStakingView}
24+
className={styles.button}
25+
size="large"
26+
color="gradient"
27+
data-testid="expanded-view-banner-button"
28+
>
1929
<Icon component={ExpandIcon} className={styles.icon} />
2030
{t('popup.expandBanner.button')}
2131
</Button>

0 commit comments

Comments
 (0)