diff --git a/packages/core/src/providers/LocalMulticallProvider.tsx b/packages/core/src/providers/LocalMulticallProvider.tsx index 2b29e0313..0f93d6d3c 100644 --- a/packages/core/src/providers/LocalMulticallProvider.tsx +++ b/packages/core/src/providers/LocalMulticallProvider.tsx @@ -73,7 +73,7 @@ export function LocalMulticallProvider({ children }: LocalMulticallProps) { } void checkDeployed() } - }, [library, chainId]) + }, [library, chainId, getCurrent]) const awaitingMulticallBlock = multicallBlockNumber && blockNumber && blockNumber < multicallBlockNumber diff --git a/packages/docs/playwright/with-metamask.test.ts b/packages/docs/playwright/with-metamask.test.ts index 3dcb5e657..be16a897f 100644 --- a/packages/docs/playwright/with-metamask.test.ts +++ b/packages/docs/playwright/with-metamask.test.ts @@ -80,12 +80,12 @@ describe(`Browser: ${browserType.name()} with Metamask`, () => { }) const popupPromise = waitForPopup(context) - await page.click(XPath.text('button', 'Switch to Goerli')) + await page.click(XPath.text('button', 'Switch to Sepolia')) const popupPage = await popupPromise await popupPage.click(XPath.text('button', 'Switch network')) await waitForExpect(async () => { - expect(await page.isVisible(`//*[text()='Current chain: ' and text()='5']`)).to.be.true + expect(await page.isVisible(`//*[text()='Current chain: ' and text()='11155111']`)).to.be.true }) }) @@ -93,7 +93,7 @@ describe(`Browser: ${browserType.name()} with Metamask`, () => { await page.goto(`${baseUrl}Guides/Transactions/Switching%20Networks`) await waitForExpect(async () => { - expect(await page.isVisible(`//*[text()='Current chain: ' and text()='5']`)).to.be.true + expect(await page.isVisible(`//*[text()='Current chain: ' and text()='11155111']`)).to.be.true }) const popupPromise = waitForPopup(context) @@ -145,7 +145,7 @@ describe(`Browser: ${browserType.name()} with Metamask`, () => { let popupPage = await popupPromise await popupPage.click(XPath.text('button', 'Sign')) await waitForExpect(async () => { - expect(await page.isVisible(`//*[text()='ChainId: ' and text()='5']`)).to.be.true + expect(await page.isVisible(`//*[text()='ChainId: ' and text()='11155111']`)).to.be.true }) await metamask.switchToNetwork('Ethereum Mainnet') @@ -163,10 +163,10 @@ describe(`Browser: ${browserType.name()} with Metamask`, () => { expect(await page.isVisible(`//*[text()='Not logged in']`)).to.be.true }) - await metamask.switchToNetwork('Goerli Test Network') + await metamask.switchToNetwork('Sepolia') await waitForExpect(async () => { - expect(await page.isVisible(`//*[text()='ChainId: ' and text()='5']`)).to.be.true + expect(await page.isVisible(`//*[text()='ChainId: ' and text()='11155111']`)).to.be.true }) }) }) diff --git a/packages/docs/src/examples/Siwe.tsx b/packages/docs/src/examples/Siwe.tsx index 8479594a3..18381b68e 100644 --- a/packages/docs/src/examples/Siwe.tsx +++ b/packages/docs/src/examples/Siwe.tsx @@ -1,6 +1,6 @@ import React from 'react' import ReactDOM from 'react-dom' -import { Mainnet, DAppProvider, useEthers, Config, Goerli } from '@usedapp/core' +import { Mainnet, DAppProvider, useEthers, Config, Sepolia } from '@usedapp/core' import { getDefaultProvider } from 'ethers' import { SiweProvider, useSiwe } from '@usedapp/siwe' @@ -12,7 +12,7 @@ const config: Config = { readOnlyChainId: Mainnet.chainId, readOnlyUrls: { [Mainnet.chainId]: getDefaultProvider('mainnet'), - [Goerli.chainId]: getDefaultProvider('goerli'), + [Sepolia.chainId]: 'https://rpc2.sepolia.org', }, } diff --git a/packages/docs/src/examples/SwitchingNetworks.tsx b/packages/docs/src/examples/SwitchingNetworks.tsx index 5562404a4..934cff1da 100644 --- a/packages/docs/src/examples/SwitchingNetworks.tsx +++ b/packages/docs/src/examples/SwitchingNetworks.tsx @@ -1,6 +1,6 @@ import React from 'react' import ReactDOM from 'react-dom' -import { DAppProvider, useSendTransaction, useEthers, Config, Goerli, Mainnet, Optimism } from '@usedapp/core' +import { DAppProvider, useSendTransaction, useEthers, Config, Sepolia, Mainnet, Optimism } from '@usedapp/core' import { getDefaultProvider } from 'ethers' const config: Config = { @@ -8,7 +8,7 @@ const config: Config = { readOnlyUrls: { [Mainnet.chainId]: getDefaultProvider('mainnet'), [Optimism.chainId]: getDefaultProvider('optimism'), - [Goerli.chainId]: getDefaultProvider('goerli'), + [Sepolia.chainId]: 'https://rpc2.sepolia.org', }, } @@ -45,8 +45,8 @@ export function App() { }{' '} { - } diff --git a/packages/example/playwright/with-metamask.ts b/packages/example/playwright/with-metamask.ts index 0bd914148..6fe86a38a 100644 --- a/packages/example/playwright/with-metamask.ts +++ b/packages/example/playwright/with-metamask.ts @@ -83,7 +83,7 @@ export const withMetamaskTest = (baseUrl: string) => { log('Adding an account with some funds to be able to deploy multicall contract...') await metamask.addAccount(defaultAccounts[0].secretKey, [page]) - log('Swtiching to local network to deploy multicall...') + log('Switching to local network to deploy multicall...') const txConfirmPagePromise = waitForPopup(context) await metamask.switchToNetwork('Localhost 8545') @@ -235,7 +235,7 @@ export const withMetamaskTest = (baseUrl: string) => { await page.goto(`${baseUrl}send`) await page.fill(XPath.id('input', 'EthInput'), '1') - await page.fill(XPath.id('input', 'AddressInput'), wallet.address) + await page.fill('#AddressInput', wallet.address) await page.click(XPath.text('button', 'Send')) await waitForExpect(() => { diff --git a/packages/example/src/entrypoint.tsx b/packages/example/src/entrypoint.tsx index 3c70f7d24..0ed0caeec 100644 --- a/packages/example/src/entrypoint.tsx +++ b/packages/example/src/entrypoint.tsx @@ -17,6 +17,7 @@ import { getDefaultProvider } from '@ethersproject/providers' const readOnlyUrls: Config['readOnlyUrls'] = { [Mainnet.chainId]: process.env.MAINNET_URL || getDefaultProvider('mainnet'), [Optimism.chainId]: 'https://mainnet.optimism.io', + [Localhost.chainId]: 'http://localhost:8545', } if (process.env.LOCALHOST_URL) { diff --git a/packages/playwright/src/metamask/MetaMask.ts b/packages/playwright/src/metamask/MetaMask.ts index e228dc0e8..f58087d79 100644 --- a/packages/playwright/src/metamask/MetaMask.ts +++ b/packages/playwright/src/metamask/MetaMask.ts @@ -5,10 +5,13 @@ import { XPath } from '../xpath' export const log = debug('usedapp:playwright') +const sleep = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms)) + export class MetaMask { constructor(private page: Page) {} private extensionId: string | undefined = undefined + private noLocalhostYet = true async getExtensionId() { if (this.extensionId) return this.extensionId @@ -33,11 +36,17 @@ export class MetaMask { async addAccount(privateKey: string, pages: Page[] = []) { log('Adding MetaMask account...') await this.gotoMetamask() - await this.page.click('.account-menu__icon') // Top right menu with accounts. - await this.page.click(XPath.text('div', 'Import Account')) + + await sleep(1000) + if (await this.page.getByTestId('popover-close').isVisible()) { + await this.page.getByTestId('popover-close').click() + } + + await this.page.getByTestId('account-menu-icon').click() // Top right menu with accounts. + await this.page.getByRole('button', { name: 'Add account or hardware wallet' }).click() + await this.page.getByRole('button', { name: 'Import account' }).click() await this.page.fill('#private-key-box', privateKey) - await this.page.click(XPath.text('button', 'Import')) - await this.page.waitForSelector('.account-menu__icon') + await this.page.getByTestId('import-account-confirm-button').click() log('MetaMask account added.') if (!pages.length) return @@ -65,44 +74,59 @@ export class MetaMask { log('Metamask account connected to pages.') } - async switchToNetwork(network: 'Ethereum Mainnet' | 'Localhost 8545' | 'Goerli Test Network') { + async switchToNetwork(network: 'Ethereum Mainnet' | 'Localhost 8545' | 'Sepolia') { + if (network === 'Localhost 8545' && this.noLocalhostYet) { + this.noLocalhostYet = false + await this.page.goto( + 'chrome-extension://' + (await this.getExtensionId()) + '//home.html#settings/networks/add-network' + ) + await this.page.getByLabel('Network name').fill('Localhost 8545') + await this.page.getByLabel('New RPC URL').fill('http://localhost:8545') + await this.page.getByLabel('Chain ID').fill('1337') + await this.page.getByTestId('network-form-ticker-input').fill('ETH') + await this.page.getByRole('button', { name: 'Save' }).click() + } + log('Switching network...') await this.gotoMetamask() - await this.page.click('.network-display--clickable') // Network popup menu on the top right. - // See if testnets are visible. - if (!(await this.page.isVisible(XPath.text('span', network)))) { - log('Making testnet visible in settings...') - await this.page.click('.network-display--clickable') // Un-click it. - await this.page.goto('chrome-extension://' + (await this.getExtensionId()) + '//home.html' + '#settings/advanced') + await sleep(1000) + const popoverClose = this.page.getByTestId('popover-close') + if (await popoverClose.isVisible()) { + await popoverClose.click() + } - // 4th checkbox relates to "Show test networks" - // Could not find a better way to click this. - await this.page.click('(//div[contains(@class, "toggle-button--off")])[4]//div') + await this.page.getByTestId('network-display').click() // Network popup menu on the top right. - await this.page.click('.network-display--clickable') // Open it up again. + await sleep(1000) + if (await this.page.isVisible('.toggle-button--off')) { + await this.page.check('.toggle-button--off') } - await this.page.click(XPath.text('span', network)) + + await this.page.getByTestId(network).click() log(`Network switched to "${network}"`) } async activate() { log('Activating Metamask...') await this.gotoMetamask() - await this.page.click(XPath.text('button', 'Get Started')) - await this.page.click(XPath.text('button', 'Create a Wallet')) - await this.page.click(XPath.text('button', 'No Thanks')) // Telemetry. - - await this.page.fill('#create-password', 'qwerty123') - await this.page.fill('#confirm-password', 'qwerty123') - await this.page.check('//div[@role="checkbox"]') - await this.page.click(XPath.text('button', 'Create')) - await this.page.click(XPath.text('button', 'Next')) - await this.page.click(XPath.text('button', 'Remind me later')) // Recovery phrase. - - await this.page.waitForSelector('//h2[contains(text(), "What\'s new")]', { state: 'visible' }) + await this.page.getByRole('checkbox').click() + await this.page.getByRole('button', { name: 'Create a new wallet' }).click() + await this.page.getByRole('button', { name: 'No thanks' }).click() // Telemetry. + + await this.page.getByTestId('create-password-new').fill('qwerty123') + await this.page.getByTestId('create-password-confirm').fill('qwerty123') + await this.page.getByRole('checkbox').click() + + await this.page.getByRole('button', { name: 'Create a new wallet' }).click() + await this.page.getByRole('button', { name: 'Remind me later (not recommended)' }).click() + await this.page.getByRole('checkbox').click() + await this.page.getByRole('button', { name: 'Skip' }).click() + await this.page.getByRole('button', { name: 'Got it' }).click() + await this.page.getByRole('button', { name: 'Next' }).click() + await this.page.getByRole('button', { name: 'Done' }).click() + await this.page.getByRole('button', { name: 'No thanks' }).click() - await this.page.click('//button[@title="Close"]') // Close "What's new" section. log('Metamask activated.') }