Skip to content

Commit

Permalink
fix: update network settings (#194)
Browse files Browse the repository at this point in the history
* fix: update metwork settings

* fix: update metwork settings

* fix: update metwork settings

* fix: add blockExplorer

* fix: add swtich network

* fix: add swtich network

* fix: add swtich network
  • Loading branch information
Vorobeyko authored Oct 24, 2024
1 parent d738c05 commit a831bf0
Show file tree
Hide file tree
Showing 6 changed files with 164 additions and 64 deletions.
9 changes: 2 additions & 7 deletions packages/wallets/src/metamask/metamask.page.ts
Original file line number Diff line number Diff line change
Expand Up @@ -91,9 +91,7 @@ export class MetamaskPage implements WalletPage {
async switchNetwork(networkName = 'Linea Mainnet') {
await test.step(`Switch network to "${networkName}"`, async () => {
await this.navigate();
await this.header.networkListButton.click();
await this.networkList.clickToNetwork(networkName);
await this.popoverElements.gotItButton.click();
await this.header.networkSetting.switchNetwork(networkName);
await this.page.close();
});
}
Expand Down Expand Up @@ -129,16 +127,13 @@ export class MetamaskPage implements WalletPage {
blockExplorer = '',
) {
await test.step(`Add new network "${networkName}"`, async () => {
await this.settingsPage.openSettings();
await this.settingsPage.networksTabButton.click();
await this.settingsPage.addNetworkManually(
await this.header.networkSetting.addNetworkManually(
networkName,
networkUrl,
chainId,
tokenSymbol,
blockExplorer,
);
await this.popoverElements.switchToButton.click();
});
}

Expand Down
Original file line number Diff line number Diff line change
@@ -1,14 +1,17 @@
import { Locator, Page, test } from '@playwright/test';
import { NetworkSetting } from './networkSetting.element';

export class Header {
page: Page;
networkSetting: NetworkSetting;
accountMenuButton: Locator;
networkListButton: Locator;
optionsMenuButton: Locator;
appHeaderLogo: Locator;

constructor(page: Page) {
this.page = page;
this.networkSetting = new NetworkSetting(page);
this.accountMenuButton = this.page.getByTestId('account-menu-icon');
this.networkListButton = this.page.getByTestId('network-display');
this.optionsMenuButton = this.page.getByTestId(
Expand Down
156 changes: 156 additions & 0 deletions packages/wallets/src/metamask/pages/elements/networkSetting.element.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,156 @@
import { Locator, Page, test } from '@playwright/test';

export class NetworkSetting {
page: Page;
dialogSection: Locator;
networkListButton: Locator;
addCustomNetworkButton: Locator;
addRpcDropDown: Locator;
addRpcButton: Locator;
networkNameInput: Locator;
networkRpcUrlInput: Locator;
addUrlButton: Locator;
networkChainIdInput: Locator;
networkTickerInput: Locator;

networkExplorerDropDown: Locator;
addBlockExplorerButton: Locator;
addExplorerUrlButton: Locator;
networkExplorerUrlInput: Locator;

saveNewTokenButton: Locator;
editNetworkButton: Locator;

constructor(page: Page) {
this.page = page;
this.dialogSection = page.locator('section[role="dialog"]');
this.networkListButton = this.page.getByTestId('network-display');
this.addCustomNetworkButton = this.dialogSection
.getByRole('button')
.getByText('Add a custom network');
this.networkNameInput = this.page.getByTestId('network-form-network-name');

this.addRpcDropDown = this.page.getByTestId('test-add-rpc-drop-down');
this.addRpcButton = this.dialogSection
.getByRole('button')
.getByText('Add RPC URL');
this.addUrlButton = this.page.getByText('Add URL');
this.networkRpcUrlInput = this.page.getByTestId('rpc-url-input-test');
this.networkChainIdInput = this.page.getByTestId('network-form-chain-id');
this.networkTickerInput = this.page.getByTestId(
'network-form-ticker-input',
);

this.networkExplorerDropDown = this.page.getByTestId(
'test-explorer-drop-down',
);
this.addBlockExplorerButton = this.dialogSection
.getByRole('button')
.getByText('Add a block explorer URL');
this.addExplorerUrlButton = this.dialogSection
.getByRole('button')
.getByText('Add URL');

this.networkExplorerUrlInput = this.page.getByTestId('explorer-url-input');

this.saveNewTokenButton = this.page.getByText('Save');
this.editNetworkButton = this.page.getByTestId(
'network-list-item-options-edit',
);
}

async openNetworkSettings() {
return this.networkListButton.click();
}

async addRpcForExistNetwork(networkUrl, blockExplorer, chainId) {
await test.step('Add rpc url for exist network', async () => {
await this.dialogSection
.getByTestId(
`network-list-item-options-button-0x${chainId.toString(16)}`,
)
.click();

await this.editNetworkButton.click();

await this.addRpcDropDown.click();
await this.addRpcButton.click();
await this.networkRpcUrlInput.fill(networkUrl);
await this.addUrlButton.click();

if (blockExplorer != '') {
await this.networkExplorerDropDown.click();
await this.addBlockExplorerButton.click();
await this.networkExplorerUrlInput.fill(blockExplorer);
await this.addExplorerUrlButton.click();
}
});

await test.step('Save the new rpc url', async () => {
await this.saveNewTokenButton.click();
});
}

async addCustomNetwork(
networkName: string,
networkUrl: string,
chainId: number,
tokenSymbol: string,
blockExplorer = '',
) {
await test.step('Add custom network', async () => {
await this.addCustomNetworkButton.click();
});

await test.step('Fill the network fields', async () => {
await this.networkNameInput.fill(networkName);

await this.addRpcDropDown.click();
await this.addRpcButton.click();
await this.networkRpcUrlInput.fill(networkUrl);
await this.addUrlButton.click();

await this.networkChainIdInput.fill(String(chainId));
await this.networkTickerInput.fill(tokenSymbol);
if (blockExplorer != '') {
await this.networkExplorerDropDown.click();
await this.addBlockExplorerButton.click();
await this.networkExplorerUrlInput.fill(blockExplorer);
await this.addExplorerUrlButton.click();
}
});

await test.step('Save the new network', async () => {
await this.saveNewTokenButton.click();
});
}

async addNetworkManually(
networkName: string,
networkUrl: string,
chainId: number,
tokenSymbol: string,
blockExplorer = '',
) {
await test.step('Open the form to add network manually', async () => {
await this.networkListButton.click();
});

if (await this.dialogSection.getByText(networkName).isVisible()) {
await this.addRpcForExistNetwork(networkUrl, blockExplorer, chainId);
} else {
await this.addCustomNetwork(
networkName,
networkUrl,
chainId,
tokenSymbol,
blockExplorer,
);
}
}

async switchNetwork(networkName: string) {
await this.networkListButton.click();
await this.dialogSection.getByText(networkName).click();
}
}
56 changes: 1 addition & 55 deletions packages/wallets/src/metamask/pages/settings.page.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,16 +4,8 @@ import { WalletConfig } from '../../wallets.constants';
export class SettingsPage {
page: Page;
tabBarMenu: Locator;
networksTabButton: Locator;
experimentalTabButton: Locator;
addNetworkButton: Locator;
addNetworkManuallyButton: Locator;
networkNameInput: Locator;
networkRpcUrlInput: Locator;
networkChainIdInput: Locator;
networkTickerInput: Locator;
networkExplorerUrlInput: Locator;
saveNewTokenButton: Locator;

selectNetworksForEachSiteToggleState: Locator;
selectNetworksForEachSiteToggle: Locator;

Expand All @@ -24,32 +16,10 @@ export class SettingsPage {
) {
this.page = page;
this.tabBarMenu = this.page.locator('.tab-bar');
this.networksTabButton = this.tabBarMenu
.getByRole('button')
.getByText('Networks');
this.experimentalTabButton = this.tabBarMenu
.getByRole('button')
.getByText('Experimental');

// Networks page locators
this.addNetworkButton = this.page
.locator('.networks-tab__body')
.getByRole('button')
.getByText('Add a network');
this.addNetworkManuallyButton = this.page.getByTestId(
'add-network-manually',
);
this.networkNameInput = this.page.getByTestId('network-form-network-name');
this.networkRpcUrlInput = this.page.getByTestId('network-form-rpc-url');
this.networkChainIdInput = this.page.getByTestId('network-form-chain-id');
this.networkTickerInput = this.page.getByTestId(
'network-form-ticker-input',
);
this.networkExplorerUrlInput = this.page.getByTestId(
'network-form-block-explorer-url',
);
this.saveNewTokenButton = this.page.getByText('Save');

// Experimental page locators
this.selectNetworksForEachSiteToggleState = this.page
.getByTestId('experimental-setting-toggle-request-queue')
Expand Down Expand Up @@ -77,28 +47,4 @@ export class SettingsPage {
await this.selectNetworksForEachSiteToggle.click();
});
}

async addNetworkManually(
networkName: string,
networkUrl: string,
chainId: number,
tokenSymbol: string,
blockExplorer = '',
) {
await test.step('Open the form to add network manually', async () => {
await this.addNetworkButton.click();
await this.addNetworkManuallyButton.click();
});
await test.step('Fill the network fields', async () => {
await this.networkNameInput.fill(networkName);
await this.networkRpcUrlInput.fill(networkUrl);
await this.networkChainIdInput.fill(String(chainId));
await this.networkTickerInput.fill(tokenSymbol);
if (blockExplorer != '')
await this.networkExplorerUrlInput.fill(blockExplorer);
});
await test.step('Save the new network', async () => {
await this.saveNewTokenButton.click();
});
}
}
2 changes: 1 addition & 1 deletion packages/wallets/src/wallet.page.ts
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ export interface WalletPage {
assertReceiptAddress(page: Page, expectedAmount: string): Promise<void>;

getWalletAddress?(): Promise<string>;

switchNetwork?(networkName: string): Promise<void>;
setupNetwork?(standConfig: Record<string, any>): Promise<void>;

addNetwork(
Expand Down
2 changes: 1 addition & 1 deletion packages/widgets/src/ethereum/ethereum.constants.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ export const ETHEREUM_WIDGET_CONFIG: WidgetConfig = {
isDefaultNetwork: true,
stakeContract: '0xae7ab96520DE3A18E5e111B5EaAb095312D7fE84',
wrapContract: '0x7f39C581F595B53c5cb19bD0b3f8dA6c935E2Ca0',
chainName: 'Mainnet',
chainName: 'Ethereum Mainnet',
chainId: 1,
tokenSymbol: 'ETH',
};

0 comments on commit a831bf0

Please sign in to comment.