jacekdaa/coinbase-wallet-sdk

An open protocol that lets users connect their mobile wallets to your DApp

Coinbase Wallet SDK

If you'd like to build a dapp for Coinbase smart wallet using our latest beta, check out our step by step instructions to build a dapp for Coinbase smart wallet using Coinbase Wallet SDK v4 beta and wagmi.

Coinbase Wallet SDK lets developers connect their dapps to Coinbase Wallet in the following ways:

1. Coinbase smart wallet (v4 only)

   • EIP-4337 account abstraction using passkeys
     • No passwords or PIN
     • No seed phrase management
     • No extension or app downloads
   • Near instant onboarding
   • Spend with Coinbase balance
   • Gas sponsorship via paymasters
   • Batch transactions
   • Desktop and mobile compatible

2. Coinbase Wallet mobile for Android and iOS

   • Desktop: Users can connect to your dapp by scanning a QR code
   • Mobile: Users can connect to your mobile dapp through a deeplink to the dapp browser

3. Coinbase Wallet extension for Chrome and Brave

   • Desktop: Users can connect by clicking the connect with extension option.

Installing and Upgrading

Migrating from v3 to v4? Please see our v4 migration guide for a full list of breaking changes.

• This readme contains brief instructions to get up and running.
• Visit our public developer docs for more detail, including samples for integrating Coinbase Wallet using libraries like web3-react, web3modal, Web3-Onboard, and wagmi.

Installing Wallet SDK

1. Check available versions:

     # yarn
     yarn info @coinbase/wallet-sdk versions
   
     # npm
     npm view @coinbase/wallet-sdk versions

2. Install latest version:

   # yarn
   yarn add @coinbase/wallet-sdk
   
   # npm
   npm install @coinbase/wallet-sdk

3. Check installed version:

   # yarn
   yarn list @coinbase/wallet-sdk
   
   # npm
   npm list @coinbase/wallet-sdk

Upgrading Wallet SDK

Upgrade Coinbase Wallet SDK using yarn or npm.

yarn/npm

1. Compare installed version with latest:

   # yarn
   yarn outdated @coinbase/wallet-sdk
   
   # npm
   npm outdated @coinbase/wallet-sdk

2. Update to latest:

   # yarn
   yarn upgrade @coinbase/wallet-sdk --latest
   
   # npm
   npm update @coinbase/wallet-sdk

Basic Usage

1. Initialize SDK

   const sdk = new CoinbaseWalletSDK({
     appName: 'SDK Playground',
   });

2. Make web3 Provider

   const provider = sdk.makeWeb3Provider();

3. Request accounts to initialize connection to wallet

   const addresses = provider.request('eth_requestAccounts');

4. Make more requests

   provider.request('personal_sign', [
     `0x${Buffer.from('test message', 'utf8').toString('hex')}`,
     addresses[0],
   ]);

   See more example methods in apps/testapp/src/components/RpcMethods/method

5. Handle provider events

   provider.on('connect', (info) => {
     setConnect(info);
   });
   
   provider.on('disconnect', (error) => {
     setDisconnect({ code: error.code, message: error.message });
   });
   
   provider.on('accountsChanged', (accounts) => {
     setAccountsChanged(accounts);
   });
   
   provider.on('chainChanged', (chainId) => {
     setChainChanged(chainId);
   });
   
   provider.on('message', (message) => {
     setMessage(message);
   });

Developing locally and running the test dapp

• The Coinbase Wallet SDK test dapp can be viewed here https://coinbase.github.io/coinbase-wallet-sdk/.

• To run it locally follow these steps:

  1. Fork this repo and clone it
  2. From the root dir run yarn install
  3. cd apps/testapp && yarn install to install testapp dependencies
  4. From the root dir run yarn dev
  • starts two dev servers in parallel:
    • @coinbase/wallet-sdk-testapp
    • @coinbase/wallet-sdk
  1. Visit localhost:3001 in your browser to view the testapp

Attributions

• eth-rpc-errors under the MIT license