refactor: migrate network tests, closes #3707

tests/fixtures/fixtures.ts

@@ -1,6 +1,7 @@
 import { BrowserContext, test as base, chromium } from '@playwright/test';
 import { GlobalPage } from '@tests/page-object-models/global.page';
 import { HomePage } from '@tests/page-object-models/home.page';
+import { NetworkPage } from '@tests/page-object-models/network.page';
 import { OnboardingPage } from '@tests/page-object-models/onboarding.page';
 import { SendPage } from '@tests/page-object-models/send.page';
 import { SwapPage } from '@tests/page-object-models/swap.page';
@@ -14,6 +15,7 @@ interface TestFixtures {
   onboardingPage: OnboardingPage;
   sendPage: SendPage;
   swapPage: SwapPage;
+  networkPage: NetworkPage;
 }
 
 /**
@@ -60,4 +62,7 @@ export const test = base.extend<TestFixtures>({
   swapPage: async ({ page }, use) => {
     await use(new SwapPage(page));
   },
+  networkPage: async ({ page }, use) => {
+    await use(new NetworkPage(page));
+  },
 });

tests/page-object-models/network.page.ts

@@ -0,0 +1,40 @@
+import { Page } from '@playwright/test';
+import { NetworkSelectors } from '@tests/selectors/network.selectors';
+import { createTestSelector } from '@tests/utils';
+
+export class NetworkPage {
+  readonly networkNameSelector = createTestSelector(NetworkSelectors.NetworkName);
+  readonly networkAddressSelector = createTestSelector(NetworkSelectors.NetworkAddress);
+  readonly networkKeySelector = createTestSelector(NetworkSelectors.NetworkKey);
+  readonly btnAddNetworkSelector = createTestSelector(NetworkSelectors.BtnAddNetwork);
+  readonly errorTextSelector = createTestSelector(NetworkSelectors.ErrorText);
+
+  constructor(readonly page: Page) {}
+
+  async inputNetworkNameField(input: string) {
+    const field = this.page.locator(this.networkNameSelector);
+    await field?.type(input);
+  }
+
+  async inputNetworkAddressField(input: string) {
+    const field = this.page.locator(this.networkAddressSelector);
+    await field?.type(input);
+  }
+
+  async inputNetworkKeyField(input: string) {
+    const field = this.page.locator(this.networkKeySelector);
+    await field?.type(input);
+  }
+
+  async waitForErrorMessage() {
+    await this.page.waitForSelector(this.errorTextSelector);
+  }
+
+  async getErrorMessage() {
+    return this.page.locator(this.errorTextSelector);
+  }
+
+  async clickAddNetwork() {
+    await this.page.locator(this.btnAddNetworkSelector).click();
+  }
+}

tests/selectors/network.selectors.ts

@@ -0,0 +1,9 @@
+export enum NetworkSelectors {
+  NetworkName = 'network-name',
+  NetworkAddress = 'network-address',
+  NetworkKey = 'network-key',
+  BtnAddNetwork = 'btn-add-network',
+  ErrorText = 'error-text',
+  EmptyAddressError = 'Enter a valid URL',
+  NoNodeFetch = 'Unable to fetch info from node.',
+}

tests/specs/network/add-network.spec.ts

@@ -0,0 +1,33 @@
+import { NetworkSelectors } from '@tests/selectors/network.selectors';
+import { SettingsSelectors } from '@tests/selectors/settings.selectors';
+
+import { test } from '../../fixtures/fixtures';
+
+test.describe('Networks tests', () => {
+  test.beforeEach(async ({ extensionId, globalPage, onboardingPage, homePage, page }) => {
+    await globalPage.setupAndUseApiCalls(extensionId);
+    await onboardingPage.signInWithTestAccount(extensionId);
+    await homePage.clickSettingsButton();
+    await page.getByTestId(SettingsSelectors.ChangeNetworkAction).click();
+    await page.getByTestId(SettingsSelectors.BtnAddNetwork).click();
+  });
+
+  test('validation error when address is empty', async ({ page, networkPage }) => {
+    await networkPage.clickAddNetwork();
+    await networkPage.waitForErrorMessage();
+
+    const errorMsgElement = await networkPage.getErrorMessage();
+    const errorMessage = await errorMsgElement.innerText();
+    test.expect(errorMessage).toEqual(NetworkSelectors.EmptyAddressError);
+  });
+
+  test('unable to fetch info from node', async ({ networkPage }) => {
+    await networkPage.inputNetworkAddressField('https://www.google.com/');
+    await networkPage.inputNetworkKeyField('test-network');
+    await networkPage.clickAddNetwork();
+    await networkPage.waitForErrorMessage();
+    const errorMsgElement = await networkPage.getErrorMessage();
+    const errorMessage = await errorMsgElement.innerText();
+    test.expect(errorMessage).toEqual(NetworkSelectors.NoNodeFetch);
+  });
+});