diff --git a/apps/laboratory/tests/basic-tests.spec.ts b/apps/laboratory/tests/basic-tests.spec.ts index eb5b82ab57..1c1c4d0a27 100644 --- a/apps/laboratory/tests/basic-tests.spec.ts +++ b/apps/laboratory/tests/basic-tests.spec.ts @@ -14,7 +14,7 @@ testM.describe('Modal only tests', () => { await expect(modalPage.page.getByTestId('all-wallets')).toBeVisible() }) - testM.only('Should show socials enabled by default', async ({ modalPage }) => { + testM('Should show socials enabled by default', async ({ modalPage }) => { const modalValidator = new ModalValidator(modalPage.page) await modalPage.page.getByTestId('connect-button').click() await modalValidator.expectSocialsVisible() diff --git a/apps/laboratory/tests/email.spec.ts b/apps/laboratory/tests/email.spec.ts index 124b2f246c..f364fcbe56 100644 --- a/apps/laboratory/tests/email.spec.ts +++ b/apps/laboratory/tests/email.spec.ts @@ -19,11 +19,11 @@ const emailTest = test.extend<{ library: string }>({ emailTest.describe.configure({ mode: 'serial' }) emailTest.beforeAll(async ({ browser, library }) => { - emailTest.setTimeout(180000) + emailTest.setTimeout(300000) context = await browser.newContext() browserPage = await context.newPage() - page = new ModalWalletPage(browserPage, library, 'email') + page = new ModalWalletPage(browserPage, library, 'default') validator = new ModalWalletValidator(browserPage) await page.load() @@ -80,10 +80,9 @@ emailTest('it should switch network and sign', async ({ library }) => { targetChain = 'Ethereum' await page.goToSettings() await page.switchNetwork(targetChain) - if (library === 'wagmi') { - // In wagmi, after switching network, it closes the modal - await page.goToSettings() - } + // After switching network, it closes the modal + await page.goToSettings() + await validator.expectSwitchedNetwork(targetChain) await page.closeModal() await page.sign() diff --git a/apps/laboratory/tests/shared/fixtures/w3m-fixture.ts b/apps/laboratory/tests/shared/fixtures/w3m-fixture.ts index 2ae08d7c79..886b56f0c5 100644 --- a/apps/laboratory/tests/shared/fixtures/w3m-fixture.ts +++ b/apps/laboratory/tests/shared/fixtures/w3m-fixture.ts @@ -27,7 +27,7 @@ export const testM = timingFixture.extend({ export const testMSiwe = timingFixture.extend({ library: ['wagmi', { option: true }], modalPage: async ({ page, library }, use) => { - const modalPage = new ModalPage(page, library, 'siwe') + const modalPage = new ModalPage(page, library, 'all') await modalPage.load() await use(modalPage) } diff --git a/apps/laboratory/tests/shared/fixtures/w3m-social-fixture.ts b/apps/laboratory/tests/shared/fixtures/w3m-social-fixture.ts index 0f2269a915..a545913764 100644 --- a/apps/laboratory/tests/shared/fixtures/w3m-social-fixture.ts +++ b/apps/laboratory/tests/shared/fixtures/w3m-social-fixture.ts @@ -10,7 +10,7 @@ export const testMSocial = timingFixture.extend< library: ['wagmi', { option: true }], social: ['github'], modalPage: async ({ page, library }, use) => { - const modalPage = new ModalPage(page, library, 'email') + const modalPage = new ModalPage(page, library, 'default') await modalPage.load() const socialMail = process.env['SOCIAL_TEST_EMAIL'] diff --git a/apps/laboratory/tests/shared/pages/ModalPage.ts b/apps/laboratory/tests/shared/pages/ModalPage.ts index f15f7c27ed..d371c97b58 100644 --- a/apps/laboratory/tests/shared/pages/ModalPage.ts +++ b/apps/laboratory/tests/shared/pages/ModalPage.ts @@ -14,9 +14,6 @@ const maliciousUrl = 'https://malicious-app-verify-simulation.vercel.app' export type ModalFlavor = | 'default' - | 'siwe' - | 'email' - | 'wallet' | 'external' | 'verify-valid' | 'verify-domain-mismatch' diff --git a/apps/laboratory/tests/shared/pages/ModalWalletPage.ts b/apps/laboratory/tests/shared/pages/ModalWalletPage.ts index 15c7f20339..d1b296d010 100644 --- a/apps/laboratory/tests/shared/pages/ModalWalletPage.ts +++ b/apps/laboratory/tests/shared/pages/ModalWalletPage.ts @@ -7,7 +7,7 @@ export class ModalWalletPage extends ModalPage { constructor( public override readonly page: Page, public override readonly library: string, - public override readonly flavor: 'email' | 'all' = 'email' + public override readonly flavor: 'default' | 'all' ) { super(page, library, flavor) } diff --git a/apps/laboratory/tests/shared/utils/project.ts b/apps/laboratory/tests/shared/utils/project.ts index b1f0d57cf1..f9eec13396 100644 --- a/apps/laboratory/tests/shared/utils/project.ts +++ b/apps/laboratory/tests/shared/utils/project.ts @@ -47,7 +47,16 @@ const SOLANA_DISABLED_TESTS = [ ] const WAGMI_DISABLED_TESTS = ['metamask.spec.ts', 'smart-account.spec.ts', 'verify.spec.ts'] const ETHERS_DISABLED_TESTS = ['metamask.spec.ts', 'verify.spec.ts'] -const ETHERS5_DISABLED_TESTS = ['metamask.spec.ts', 'verify.spec.ts', 'smart-account.spec.ts'] +const ETHERS5_DISABLED_TESTS = [ + 'metamask.spec.ts', + 'verify.spec.ts', + 'smart-account.spec.ts', + 'email.spec.ts', + 'smart-account.spec.ts', + 'wallet-features.spec.ts', + 'siwe-email.spec.ts', + 'siwe-sa.spec.ts' +] const ETHERS_EMAIL_BASED_REGEX = new RegExp(ETHERS_DISABLED_TESTS.join('|'), 'u') const ETHERS5_EMAIL_BASED_REGEX = new RegExp(ETHERS5_DISABLED_TESTS.join('|'), 'u') diff --git a/apps/laboratory/tests/siwe-email.spec.ts b/apps/laboratory/tests/siwe-email.spec.ts index fc85e3f867..55d72ee66c 100644 --- a/apps/laboratory/tests/siwe-email.spec.ts +++ b/apps/laboratory/tests/siwe-email.spec.ts @@ -18,7 +18,7 @@ const emailSiweTest = test.extend<{ library: string }>({ emailSiweTest.describe.configure({ mode: 'serial' }) emailSiweTest.beforeAll(async ({ browser, library }) => { - emailSiweTest.setTimeout(180000) + emailSiweTest.setTimeout(300000) context = await browser.newContext() const browserPage = await context.newPage() diff --git a/apps/laboratory/tests/siwe-sa.spec.ts b/apps/laboratory/tests/siwe-sa.spec.ts index a6bd41720c..ddb9bffff1 100644 --- a/apps/laboratory/tests/siwe-sa.spec.ts +++ b/apps/laboratory/tests/siwe-sa.spec.ts @@ -18,7 +18,7 @@ const smartAccountSiweTest = test.extend<{ library: string }>({ smartAccountSiweTest.describe.configure({ mode: 'serial' }) smartAccountSiweTest.beforeAll(async ({ browser, library }) => { - smartAccountSiweTest.setTimeout(180000) + smartAccountSiweTest.setTimeout(300000) context = await browser.newContext() const browserPage = await context.newPage() diff --git a/apps/laboratory/tests/siwe.spec.ts b/apps/laboratory/tests/siwe.spec.ts index 02772a7a7c..e2025b14a5 100644 --- a/apps/laboratory/tests/siwe.spec.ts +++ b/apps/laboratory/tests/siwe.spec.ts @@ -21,7 +21,7 @@ siweWalletTest.beforeAll(async ({ browser, library }) => { context = await browser.newContext() const browserPage = await context.newPage() - modalPage = new ModalPage(browserPage, library, 'siwe') + modalPage = new ModalPage(browserPage, library, 'all') walletPage = new WalletPage(await context.newPage()) modalValidator = new ModalValidator(browserPage) diff --git a/apps/laboratory/tests/smart-account.spec.ts b/apps/laboratory/tests/smart-account.spec.ts index b0485c4f9c..a63a044726 100644 --- a/apps/laboratory/tests/smart-account.spec.ts +++ b/apps/laboratory/tests/smart-account.spec.ts @@ -17,11 +17,11 @@ const smartAccountTest = test.extend<{ library: string }>({ smartAccountTest.describe.configure({ mode: 'serial' }) smartAccountTest.beforeAll(async ({ browser, library }) => { - smartAccountTest.setTimeout(180000) + smartAccountTest.setTimeout(300000) context = await browser.newContext() const browserPage = await context.newPage() - page = new ModalWalletPage(browserPage, library) + page = new ModalWalletPage(browserPage, library, 'default') validator = new ModalWalletValidator(browserPage) await page.load() diff --git a/apps/laboratory/tests/wallet-features.spec.ts b/apps/laboratory/tests/wallet-features.spec.ts index 88a2e746bb..834777f971 100644 --- a/apps/laboratory/tests/wallet-features.spec.ts +++ b/apps/laboratory/tests/wallet-features.spec.ts @@ -17,11 +17,11 @@ const walletFeaturesTest = test.extend<{ library: string }>({ walletFeaturesTest.describe.configure({ mode: 'serial' }) walletFeaturesTest.beforeAll(async ({ browser, library }) => { - walletFeaturesTest.setTimeout(180000) + walletFeaturesTest.setTimeout(300000) context = await browser.newContext() const browserPage = await context.newPage() - page = new ModalWalletPage(browserPage, library, 'email') + page = new ModalWalletPage(browserPage, library, 'default') validator = new ModalWalletValidator(browserPage) await page.load() diff --git a/dangerfile.ts b/dangerfile.ts index 915fef1aca..c0de08ef16 100644 --- a/dangerfile.ts +++ b/dangerfile.ts @@ -284,13 +284,15 @@ async function checkScaffoldHtmlPackage() { checkScaffoldHtmlPackage() // -- Client(s) Package Checks ---------------------------------------------------- + // -- Helper functions -const isRelativeImport = (addition: string | undefined) => { +function isRelativeImport(addition: string | undefined) { const sameDir = addition?.includes(RELATIVE_IMPORT_SAME_DIR) const parentDir = addition?.includes(RELATIVE_IMPORT_PARENT_DIR) + return sameDir || parentDir } -const containsRelativeImportWithoutJSExtension = (addition: string | undefined) => { +function containsRelativeImportWithoutJSExtension(addition: string | undefined) { const hasImportStatement = addition?.includes('import') const lacksJSExtension = !addition?.includes(RELATIVE_IMPORT_EXTENSION) const hasRelativePath = isRelativeImport(addition) @@ -352,6 +354,15 @@ async function checkLaboratory() { warn('Testing spec changed') } } + + // Check that no .only is present in tests + const test_files = lab_files.filter(f => f.includes('.spec.ts')) + for (const f of test_files) { + const fileContent = await danger.github.utils.fileContents(f) + if (fileContent.includes('.only')) { + fail(`${f} contains .only, please remove it`) + } + } } checkLaboratory() diff --git a/packages/base/adapters/evm/ethers/client.ts b/packages/base/adapters/evm/ethers/client.ts index 2e7c569da7..3b5a8f91a2 100644 --- a/packages/base/adapters/evm/ethers/client.ts +++ b/packages/base/adapters/evm/ethers/client.ts @@ -817,6 +817,7 @@ export class EVMEthersClient { EthersStoreUtil.setProvider(WalletConnectProvider as unknown as Provider) EthersStoreUtil.setStatus('connected') EthersStoreUtil.setIsConnected(true) + this.appKit?.setAllAccounts( WalletConnectProvider.accounts.map(address => ({ address, type: 'eoa' })), this.chain @@ -1336,7 +1337,6 @@ export class EVMEthersClient { } } else if (providerType === ConstantsUtil.WALLET_CONNECT_CONNECTOR_ID) { const provider = EthersStoreUtil.state.provider as unknown as EthereumProvider - if (provider.session) { this.appKit?.setConnectedWalletInfo( { @@ -1347,6 +1347,18 @@ export class EVMEthersClient { this.chain ) } + } else if (providerType === ConstantsUtil.COINBASE_SDK_CONNECTOR_ID) { + const connector = this.appKit + ?.getConnectors() + .find(c => c.id === ConstantsUtil.COINBASE_SDK_CONNECTOR_ID) + + this.appKit?.setConnectedWalletInfo( + { + name: 'Coinbase Wallet', + icon: this.appKit?.getConnectorImage(connector) + }, + this.chain + ) } else if (currentActiveWallet) { this.appKit?.setConnectedWalletInfo({ name: currentActiveWallet }, this.chain) } diff --git a/packages/base/adapters/evm/wagmi/client.ts b/packages/base/adapters/evm/wagmi/client.ts index 493dabc3a0..18a4da2719 100644 --- a/packages/base/adapters/evm/wagmi/client.ts +++ b/packages/base/adapters/evm/wagmi/client.ts @@ -624,8 +624,12 @@ export class EVMWagmiClient { ) } } else { + const wagmiConnector = this.appKit?.getConnectors().find(c => c.id === connector.id) this.appKit?.setConnectedWalletInfo( - { name: connector.name, icon: connector.icon }, + { + name: connector.name, + icon: connector.icon || this.appKit.getConnectorImage(wagmiConnector) + }, this.chain ) } diff --git a/packages/base/adapters/solana/web3js/client.ts b/packages/base/adapters/solana/web3js/client.ts index 9093fbd2da..8fe3946d26 100644 --- a/packages/base/adapters/solana/web3js/client.ts +++ b/packages/base/adapters/solana/web3js/client.ts @@ -301,6 +301,27 @@ export class SolanaWeb3JsClient { } // -- Private ----------------------------------------------------------------- + private syncConnectedWalletInfo() { + const currentActiveWallet = window?.localStorage.getItem(SolConstantsUtil.WALLET_ID) + const provider = SolStoreUtil.state.provider + + if (provider?.type === 'WALLET_CONNECT') { + const wcProvider = provider as WalletConnectProvider + if (wcProvider.session) { + this.appKit?.setConnectedWalletInfo( + { + ...wcProvider.session.peer.metadata, + name: wcProvider.session.peer.metadata.name, + icon: wcProvider.session.peer.metadata.icons?.[0] + }, + this.chain + ) + } + } else if (currentActiveWallet) { + this.appKit?.setConnectedWalletInfo({ name: currentActiveWallet }, this.chain) + } + } + private async syncAccount() { const address = SolStoreUtil.state.address const chainId = SolStoreUtil.state.currentChain?.chainId @@ -309,6 +330,7 @@ export class SolanaWeb3JsClient { const caipAddress: CaipAddress = `${ConstantsUtil.INJECTED_CONNECTOR_ID}:${chainId}:${address}` this.appKit?.setCaipAddress(caipAddress, this.chain) await this.syncBalance(address) + this.syncConnectedWalletInfo() this.hasSyncedConnectedAccount = true } else if (this.hasSyncedConnectedAccount) { diff --git a/packages/base/adapters/solana/web3js/providers/WalletConnectProvider.ts b/packages/base/adapters/solana/web3js/providers/WalletConnectProvider.ts index f0e6937941..5acbc03418 100644 --- a/packages/base/adapters/solana/web3js/providers/WalletConnectProvider.ts +++ b/packages/base/adapters/solana/web3js/providers/WalletConnectProvider.ts @@ -32,7 +32,7 @@ export class WalletConnectProvider extends ProviderEventEmitter implements Provi 'https://imagedelivery.net/_aTEfDRm7z3tKgu9JhfeKA/05338e12-4f75-4982-4e8a-83c67b826b00/md' private provider: UniversalProvider - private session?: SessionTypes.Struct + public session?: SessionTypes.Struct private readonly requestedChains: Chain[] private readonly getActiveChain: WalletConnectProviderConfig['getActiveChain'] diff --git a/packages/base/src/client.ts b/packages/base/src/client.ts index 84869be90f..8ee9965e94 100644 --- a/packages/base/src/client.ts +++ b/packages/base/src/client.ts @@ -23,7 +23,8 @@ import { RouterController, EnsController, OptionsController, - NetworkController + NetworkController, + AssetUtil } from '@web3modal/core' import { setColorTheme, setThemeVariables } from '@web3modal/ui' import { ConstantsUtil, type Chain } from '@web3modal/common' @@ -298,6 +299,9 @@ export class AppKit { BlockchainApiController.setClientId(clientId) } + public getConnectorImage: (typeof AssetUtil)['getConnectorImage'] = connector => + AssetUtil.getConnectorImage(connector) + // -- Private ------------------------------------------------------------------ private async initControllers(options: AppKitOptions) { OptionsController.setProjectId(options.projectId) diff --git a/packages/core/src/controllers/ConnectionController.ts b/packages/core/src/controllers/ConnectionController.ts index 381c94a32f..a58952057a 100644 --- a/packages/core/src/controllers/ConnectionController.ts +++ b/packages/core/src/controllers/ConnectionController.ts @@ -184,7 +184,6 @@ export const ConnectionController = { try { await client.disconnect() - StorageUtil.removeConnectedWalletImageUrl() this.resetWcConnection() } catch (error) { throw new Error('Failed to disconnect') diff --git a/packages/core/src/utils/StorageUtil.ts b/packages/core/src/utils/StorageUtil.ts index 61909674f4..537a5f8ae2 100644 --- a/packages/core/src/utils/StorageUtil.ts +++ b/packages/core/src/utils/StorageUtil.ts @@ -4,7 +4,6 @@ import type { WcWallet, ConnectorType, SocialProvider } from './TypeUtil.js' // -- Helpers ----------------------------------------------------------------- const WC_DEEPLINK = 'WALLETCONNECT_DEEPLINK_CHOICE' const W3M_RECENT = '@w3m/recent' -const W3M_CONNECTED_WALLET_IMAGE_URL = '@w3m/connected_wallet_image_url' const W3M_CONNECTED_CONNECTOR = '@w3m/connected_connector' const W3M_CONNECTED_SOCIAL = '@w3m/connected_social' const W3M_CONNECTED_SOCIAL_USERNAME = '@w3m-storage/SOCIAL_USERNAME' @@ -68,32 +67,6 @@ export const StorageUtil = { return [] }, - setConnectedWalletImageUrl(imageUrl: string) { - try { - localStorage.setItem(W3M_CONNECTED_WALLET_IMAGE_URL, imageUrl) - } catch { - console.info('Unable to set Connected Wallet Image Url') - } - }, - - removeConnectedWalletImageUrl() { - try { - localStorage.removeItem(W3M_CONNECTED_WALLET_IMAGE_URL) - } catch { - console.info('Unable to remove Connected Wallet Image Url') - } - }, - - getConnectedWalletImageUrl() { - try { - return localStorage.getItem(W3M_CONNECTED_WALLET_IMAGE_URL) - } catch { - console.info('Unable to set Connected Wallet Image Url') - } - - return undefined - }, - setConnectedConnector(connectorType: ConnectorType) { try { localStorage.setItem(W3M_CONNECTED_CONNECTOR, connectorType) diff --git a/packages/scaffold-ui/src/partials/w3m-connect-coinbase-widget/index.ts b/packages/scaffold-ui/src/partials/w3m-connect-coinbase-widget/index.ts index c25aaffb46..315fe9c935 100644 --- a/packages/scaffold-ui/src/partials/w3m-connect-coinbase-widget/index.ts +++ b/packages/scaffold-ui/src/partials/w3m-connect-coinbase-widget/index.ts @@ -6,8 +6,7 @@ import { EventsController, ModalController, OptionsController, - RouterController, - StorageUtil + RouterController } from '@web3modal/core' import { ConstantsUtil } from '@web3modal/scaffold-utils' import { customElement } from '@web3modal/ui' @@ -68,10 +67,6 @@ export class W3mConnectCoinbaseWidget extends LitElement { try { ConnectionController.setWcError(false) - if (connector.imageUrl) { - StorageUtil.setConnectedWalletImageUrl(connector.imageUrl) - } - await ConnectionController.connectExternal(connector, connector.chain) if (OptionsController.state.isSiweEnabled) { diff --git a/packages/scaffold-ui/src/views/w3m-connecting-external-view/index.ts b/packages/scaffold-ui/src/views/w3m-connecting-external-view/index.ts index b103bd2fcc..a965d422d7 100644 --- a/packages/scaffold-ui/src/views/w3m-connecting-external-view/index.ts +++ b/packages/scaffold-ui/src/views/w3m-connecting-external-view/index.ts @@ -4,8 +4,7 @@ import { EventsController, ModalController, OptionsController, - RouterController, - StorageUtil + RouterController } from '@web3modal/core' import { ConstantsUtil } from '@web3modal/scaffold-utils' import { customElement } from '@web3modal/ui' @@ -37,9 +36,6 @@ export class W3mConnectingExternalView extends W3mConnectingWidget { try { this.error = false if (this.connector) { - if (this.connector.imageUrl) { - StorageUtil.setConnectedWalletImageUrl(this.connector.imageUrl) - } /** * Coinbase SDK works with popups and popups requires user interaction to be opened since modern browsers block popups which triggered programmatically. * Instead of opening a popup in first render for `W3mConnectingWidget`, we need to trigger connection for Coinbase connector specifically when users select it. diff --git a/packages/scaffold-ui/src/views/w3m-connecting-wc-view/index.ts b/packages/scaffold-ui/src/views/w3m-connecting-wc-view/index.ts index 75c8cf2211..270ad271e6 100644 --- a/packages/scaffold-ui/src/views/w3m-connecting-wc-view/index.ts +++ b/packages/scaffold-ui/src/views/w3m-connecting-wc-view/index.ts @@ -1,8 +1,6 @@ import type { BaseError, Platform } from '@web3modal/core' import { - AssetUtil, ConnectionController, - ConnectorController, ConstantsUtil, CoreHelperUtil, EventsController, @@ -59,20 +57,6 @@ export class W3mConnectingWcView extends LitElement { try { const { wcPairingExpiry } = ConnectionController.state if (retry || CoreHelperUtil.isPairingExpired(wcPairingExpiry)) { - if (this.wallet) { - const url = AssetUtil.getWalletImage(this.wallet) - if (url) { - StorageUtil.setConnectedWalletImageUrl(url) - } - } else { - const connectors = ConnectorController.state.connectors - const connector = connectors.find(c => c.type === 'WALLET_CONNECT') - const url = AssetUtil.getConnectorImage(connector) - if (url) { - StorageUtil.setConnectedWalletImageUrl(url) - } - } - await ConnectionController.connectWalletConnect() this.finalizeConnection() if ( diff --git a/packages/siwe/scaffold/partials/w3m-connecting-siwe/index.ts b/packages/siwe/scaffold/partials/w3m-connecting-siwe/index.ts index ce12c33b56..9ee986596a 100644 --- a/packages/siwe/scaffold/partials/w3m-connecting-siwe/index.ts +++ b/packages/siwe/scaffold/partials/w3m-connecting-siwe/index.ts @@ -1,7 +1,7 @@ import { customElement } from '@web3modal/ui' import { LitElement, html } from 'lit' import styles from './styles.js' -import { OptionsController, StorageUtil } from '@web3modal/core' +import { AccountController, OptionsController } from '@web3modal/core' @customElement('w3m-connecting-siwe') export class W3mConnectingSiwe extends LitElement { @@ -10,7 +10,7 @@ export class W3mConnectingSiwe extends LitElement { // -- Members ------------------------------------------- // private readonly dappImageUrl = OptionsController.state.metadata?.icons - private readonly walletImageUrl = StorageUtil.getConnectedWalletImageUrl() + private readonly walletImageUrl = AccountController.state.connectedWalletInfo?.icon public override firstUpdated() { const visuals = this.shadowRoot?.querySelectorAll('wui-visual-thumbnail')