Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

test: [POM] Migrate Snap Account Settings to page object model #27302

Merged
merged 20 commits into from
Sep 25, 2024

Conversation

devin-ai-integration[bot]
Copy link
Contributor

@devin-ai-integration devin-ai-integration bot commented Sep 20, 2024

Description

This pull request migrate snap account settings test to page object model(POM) pattern, enhancing code maintainability, and improving test reliability.
Also improved the implementation of login methods so we query directly ganache, and there's no need to pass any balance manually.

Description

Open in GitHub Codespaces

Related issues

Fixes: #27343

Manual testing steps

Check code readability, make sure tests pass.

Screenshots/Recordings

Before

After

Pre-merge author checklist

Pre-merge reviewer checklist

  • I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
  • I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

Copy link
Contributor

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

@chloeYue chloeYue self-assigned this Sep 20, 2024
@chloeYue chloeYue added team-extension-platform team-ai AI team (for the Devin AI bot) labels Sep 20, 2024
@chloeYue chloeYue changed the title [POM] Migrate Snap Account Settings to POM test: [POM] Migrate Snap Account Settings to POM Sep 20, 2024
@chloeYue chloeYue changed the title test: [POM] Migrate Snap Account Settings to POM test: [POM] Migrate Snap Account Settings to page object model Sep 20, 2024
@metamaskbot
Copy link
Collaborator

Builds ready [df51f72]
Page Load Metrics (1861 ± 101 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint29425351714502241
domContentLoaded16012522183520599
load160425541861211101
domInteractive1493392110
Bundle size diffs
  • background: 0 Bytes (0.00%)
  • ui: 0 Bytes (0.00%)
  • common: 0 Bytes (0.00%)

@metamaskbot
Copy link
Collaborator

Builds ready [409d6be]
Page Load Metrics (1813 ± 67 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint15822227180914268
domContentLoaded15592209177013967
load15832227181314067
domInteractive1710033199
Bundle size diffs
  • background: 0 Bytes (0.00%)
  • ui: 0 Bytes (0.00%)
  • common: 0 Bytes (0.00%)

@chloeYue chloeYue marked this pull request as ready for review September 24, 2024 10:04
@chloeYue chloeYue requested a review from a team as a code owner September 24, 2024 10:04
Comment on lines 57 to 58
this.closeAccountModalButton = 'button[aria-label="Close"]';
this.closeEditLabelButton = 'button[aria-label="Close"]';
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

these two selectors are the same, I'm thinking if we can find a better selector for both, maybe using a test-id (if it's not too complex to add)

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

oh, nice catch, thanks! I found that the close button for modals on the account list is the same, and since we don't have case where multiple modals are open on the account list, I will keep only one selector for the close button on different modals in account list.

@@ -103,16 +111,30 @@ class AccountListPage {
await this.driver.clickElement(this.closeEditLabelButton);
}

async closeAccountModal(): Promise<void> {
console.log(`Open add account modal in account list`);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe the log should say "Close" ?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nice catch, corrected, thanks !

title: this.test?.fullTitle(),
},
async ({ driver }: { driver: Driver }) => {
await loginWithBalanceValidation(driver);
await loginWithBalanceValidation(driver, '0');
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

mmm I think we might want to tweak this function. Instead of having to pass manually the balance, we could use the same approach for the other loginWithBalanceValidation function we have, where we query directly ganache, so there's no need to pass any balance manually.
What do you think?

const logInWithBalanceValidation = async (driver, ganacheServer) => {
  await unlockWallet(driver);
  // Wait for balance to load
  await locateAccountBalanceDOM(driver, ganacheServer);
};

and here the implementation of locate balance using ganache:


const locateAccountBalanceDOM = async (
  driver,
  ganacheServer,
  address = null,
) => {
  const balanceSelector = '[data-testid="eth-overview__primary-currency"]';
  if (ganacheServer) {
    const balance = await ganacheServer.getBalance(address);
    await driver.waitForSelector({
      css: balanceSelector,
      text: `${balance} ETH`,
    });
  } else {
    await driver.findElement(balanceSelector);
  }
};
``

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

make sense, i made the changes in this commit: 74f6504

Copy link
Contributor

@seaona seaona left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

overall looks good @chloeYue Added a couple of suggestions

Copy link

sonarcloud bot commented Sep 25, 2024

@metamaskbot
Copy link
Collaborator

Builds ready [74f6504]
Page Load Metrics (1776 ± 81 ms)
PlatformPageMetricMin (ms)Max (ms)Average (ms)StandardDeviation (ms)MarginOfError (ms)
ChromeHomefirstPaint27920961614451217
domContentLoaded15312094174915374
load15412128177616881
domInteractive136739168
Bundle size diffs
  • background: 0 Bytes (0.00%)
  • ui: 0 Bytes (0.00%)
  • common: 0 Bytes (0.00%)

await loginWithoutBalanceValidation(driver, password);
// Verify the expected balance on the homepage
if (ganacheServer) {
await new HomePage(driver).check_ganacheBalanceIsDisplayed(ganacheServer);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nice!

@chloeYue chloeYue merged commit 7054c16 into develop Sep 25, 2024
80 checks passed
@chloeYue chloeYue deleted the feature/migrate-snap-account-settings-to-pom branch September 25, 2024 13:33
@github-actions github-actions bot locked and limited conversation to collaborators Sep 25, 2024
@metamaskbot metamaskbot added release-12.6.0 Issue or pull request that will be included in release 12.6.0 release-12.5.0 Issue or pull request that will be included in release 12.5.0 and removed release-12.6.0 Issue or pull request that will be included in release 12.6.0 labels Sep 25, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
release-12.5.0 Issue or pull request that will be included in release 12.5.0 team-ai AI team (for the Devin AI bot) team-extension-platform
Projects
Archived in project
Development

Successfully merging this pull request may close these issues.

[POM][Devin] Create page classes for settings page and provide more tests migration examples
3 participants