Skip to content

Commit ef3970c

Browse files
Adamj1232lnbc1QWFyb24
Adamj1232
and
lnbc1QWFyb24
authored
[core, react, vue]: Enhancement - Add Sepolia testnet (#1604)
* Add sepolia test net * Update packages/core/src/utils.ts Co-authored-by: Aaron <[email protected]> --------- Co-authored-by: Aaron <[email protected]>
1 parent 55fdde1 commit ef3970c

File tree

10 files changed

+50
-26
lines changed

10 files changed

+50
-26
lines changed

‎docs/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@
5656
"dependencies": {
5757
"bnc-sdk": "^4.6.6",
5858
"@web3-onboard/coinbase": "^2.2.1-alpha.1",
59-
"@web3-onboard/core": "^2.15.6-alpha.3",
59+
"@web3-onboard/core": "^2.15.6-alpha.4",
6060
"@web3-onboard/dcent": "^2.2.4-alpha.1",
6161
"@web3-onboard/enkrypt": "^2.0.1-alpha.1",
6262
"@web3-onboard/fortmatic": "^2.0.16-alpha.1",

‎docs/src/lib/services/onboard.js‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -144,6 +144,12 @@ const intiOnboard = async (theme) => {
144144
label: 'Goerli',
145145
rpcUrl: `https://goerli.infura.io/v3/${INFURA_ID}`
146146
},
147+
{
148+
id: 11155111,
149+
token: 'ETH',
150+
label: 'Sepolia',
151+
rpcUrl: 'https://rpc.sepolia.org/'
152+
},
147153
{
148154
id: '0x13881',
149155
token: 'MATIC',

‎docs/src/routes/docs/[...3]modules/core.md‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -439,6 +439,12 @@ const onboard = Onboard({
439439
label: 'Goerli',
440440
rpcUrl: `https://goerli.infura.io/v3/${INFURA_ID}`
441441
},
442+
{
443+
id: 11155111,
444+
token: 'ETH',
445+
label: 'Sepolia',
446+
rpcUrl: 'https://rpc.sepolia.org/'
447+
},
442448
{
443449
id: '0x38',
444450
token: 'BNB',

‎packages/core/README.md‎

Lines changed: 19 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -82,11 +82,11 @@ An array of Chains that your app supports:
8282
type Chain = {
8383
id: ChainId // hex encoded string, eg '0x1' for Ethereum Mainnet
8484
namespace?: 'evm' // string indicating chain namespace. Defaults to 'evm' but will allow other chain namespaces in the future
85-
// PLEASE NOTE: Some wallets require an rpcUrl, label, and token for actions such as adding a new chain.
86-
// It is recommended to include rpcUrl, label, and token for full functionality.
85+
// PLEASE NOTE: Some wallets require an rpcUrl, label, and token for actions such as adding a new chain.
86+
// It is recommended to include rpcUrl, label, and token for full functionality.
8787
rpcUrl?: string // Recommended to include. Used for network requests (eg Alchemy or Infura end point).
88-
label?: string // Recommended to include. Used for display, eg Ethereum Mainnet.
89-
token?: TokenSymbol // Recommended to include. The native token symbol, eg ETH, BNB, MATIC.
88+
label?: string // Recommended to include. Used for display, eg Ethereum Mainnet.
89+
token?: TokenSymbol // Recommended to include. The native token symbol, eg ETH, BNB, MATIC.
9090
color?: string // the color used to represent the chain and will be used as a background for the icon
9191
icon?: string // the icon to represent the chain
9292
publicRpcUrl?: string // an optional public RPC used when adding a new chain config to the wallet
@@ -359,8 +359,7 @@ const injected = injectedModule()
359359

360360
// Only one RPC endpoint required per chain
361361
const ETH_MAINNET_RPC = `https://mainnet.infura.io/v3/${INFURA_KEY}` || `https://eth-mainnet.g.alchemy.com/v2/${ALCHEMY_KEY}`
362-
const ETH_ROPSTEN_RPC = `https://ropsten.infura.io/v3/${INFURA_ID}` || `https://eth-ropsten.g.alchemy.com/v2/${ALCHEMY_KEY}`
363-
const ETH_RINKEBY_RPC = `https://rinkeby.infura.io/v3/${INFURA_KEY}` || `https://eth-rinkeby.g.alchemy.com/v2/${ALCHEMY_KEY}`
362+
const ETH_GOERLI_RPC = `https://goerli.infura.io/v3/${INFURA_ID}` || `https://eth-goerli.g.alchemy.com/v2/${ALCHEMY_KEY}`
364363

365364
const onboard = Onboard({
366365
wallets: [injected],
@@ -372,16 +371,16 @@ const onboard = Onboard({
372371
rpcUrl: ETH_MAINNET_RPC
373372
},
374373
{
375-
id: '0x3',
376-
token: 'tROP',
377-
label: 'Ethereum Ropsten Testnet',
378-
rpcUrl: ETH_ROPSTEN_RPC
374+
id: 11155111,
375+
token: 'ETH',
376+
label: 'Sepolia',
377+
rpcUrl: 'https://rpc.sepolia.org/'
379378
},
380379
{
381-
id: '0x4',
382-
token: 'rETH',
383-
label: 'Ethereum Rinkeby Testnet',
384-
rpcUrl: ETH_RINKEBY_RPC
380+
id: '0x5',
381+
token: 'ETH',
382+
label: 'Goerli',
383+
rpcUrl: ETH_GOERLI_RPC
385384
},
386385
{
387386
id: '0x38',
@@ -1345,7 +1344,6 @@ export default config
13451344

13461345
Checkout a boilerplate example (here)[https://github.com/blocknative/web3-onboard/tree/develop/examples/with-sveltekit]
13471346

1348-
13491347
Add the following dev dependencies:
13501348

13511349
`yarn add rollup-plugin-polyfill-node -D`
@@ -1442,19 +1440,22 @@ export default config
14421440

14431441
If an error presents around `window` being undefined remove the `define.global` block.
14441442
Add this to your `app.html`
1443+
14451444
```html
14461445
<script>
1447-
var global = global || window
1446+
var global = global || window
14481447
</script>
14491448
```
14501449

14511450
##### Buffer polyfill
1451+
14521452
It seems some component or dependency requires Node's Buffer. To polyfill this, the simplest way I could find was to install the buffer package and include the following in web3-onboard.ts:
14531453

14541454
```javascript
14551455
import { Buffer } from 'buffer'
14561456
globalThis.Buffer = Buffer
14571457
```
1458+
14581459
See [this github issue](https://github.com/blocknative/web3-onboard/issues/1568#issuecomment-1463963462) for further troubleshooting
14591460

14601461
### Vite
@@ -1546,13 +1547,13 @@ Checkout a boilerplate example for NextJS v13 (here)[https://github.com/blocknat
15461547

15471548
Checkout a boilerplate example for NextJS (here)[https://github.com/blocknative/web3-onboard/tree/develop/examples/with-nextjs]
15481549

1549-
15501550
## Package Managers
15511551

15521552
### npm and yarn
15531553

15541554
Web3-Onboard will work out of the box with `npm` and `yarn` support.
15551555

15561556
### pnpm
1557+
15571558
We have had issues reported when using `pnpm` as the package manager when working with web3-onboard.
1558-
As we work to understand this new manager more and the issues around it we recommend using `npm` or `yarn` for now.
1559+
As we work to understand this new manager more and the issues around it we recommend using `npm` or `yarn` for now.

‎packages/core/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@web3-onboard/core",
3-
"version": "2.15.6-alpha.3",
3+
"version": "2.15.6-alpha.4",
44
"description": "Web3-Onboard makes it simple to connect Ethereum hardware and software wallets to your dapp. Features standardized spec compliant web3 providers for all supported wallets, framework agnostic modern javascript UI with code splitting, CSS customization, multi-chain and multi-account support, reactive wallet state subscriptions and real-time transaction state change notifications.",
55
"keywords": [
66
"Ethereum",

‎packages/core/src/utils.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -116,6 +116,7 @@ export const chainIdToLabel: Record<string, string> = {
116116
'0x3': 'Ropsten',
117117
'0x4': 'Rinkeby',
118118
'0x5': 'Goerli',
119+
'0xaa36a7': 'Sepolia',
119120
'0x2a': 'Kovan',
120121
'0x38': 'Binance',
121122
'0x89': 'Polygon',
@@ -164,6 +165,10 @@ export const chainStyles: Record<string, ChainStyle> = {
164165
icon: ethereumIcon,
165166
color: '#627EEA'
166167
},
168+
'0xaa36a7': {
169+
icon: ethereumIcon,
170+
color: '#627EEA'
171+
},
167172
'0x38': {
168173
icon: binanceIcon,
169174
color: '#F3BA2F'

‎packages/demo/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
"webpack-dev-server": "4.7.4"
2424
},
2525
"dependencies": {
26-
"@web3-onboard/core": "^2.15.6-alpha.3",
26+
"@web3-onboard/core": "^2.15.6-alpha.4",
2727
"@web3-onboard/coinbase": "^2.2.1-alpha.1",
2828
"@web3-onboard/transaction-preview": "^2.0.5-alpha.1",
2929
"@web3-onboard/dcent": "^2.2.4-alpha.1",

‎packages/demo/src/App.svelte‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -206,6 +206,12 @@
206206
label: 'Ethereum',
207207
rpcUrl: `https://mainnet.infura.io/v3/${infura_key}`
208208
},
209+
{
210+
id: 11155111,
211+
token: 'ETH',
212+
label: 'Sepolia',
213+
rpcUrl: 'https://rpc.sepolia.org/'
214+
},
209215
{
210216
id: '0x5',
211217
token: 'ETH',
@@ -304,7 +310,7 @@
304310
// type: 'hint',
305311
// message: 'Your in the pool, hope you brought a towel!',
306312
// autoDismiss: 0,
307-
// link: `https://ropsten.etherscan.io/tx/${transaction.hash}`
313+
// link: `https://goerli.etherscan.io/tx/${transaction.hash}`
308314
// }
309315
// }
310316
},

‎packages/react/package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@web3-onboard/react",
3-
"version": "2.6.7-alpha.3",
3+
"version": "2.6.7-alpha.4",
44
"description": "A collection of React hooks for integrating Web3-Onboard in to React and Next.js projects. Web3-Onboard makes it simple to connect Ethereum hardware and software wallets to your dapp. Features standardised spec compliant web3 providers for all supported wallets, modern javascript UI with code splitting, CSS customization, multi-chain and multi-account support, reactive wallet state subscriptions and real-time transaction state change notifications.",
55
"keywords": [
66
"Ethereum",
@@ -62,7 +62,7 @@
6262
"typescript": "^4.5.5"
6363
},
6464
"dependencies": {
65-
"@web3-onboard/core": "^2.15.6-alpha.3",
65+
"@web3-onboard/core": "^2.15.6-alpha.4",
6666
"@web3-onboard/common": "^2.2.4-alpha.1",
6767
"use-sync-external-store": "1.0.0"
6868
},

‎packages/vue/package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@web3-onboard/vue",
3-
"version": "2.5.7-alpha.3",
3+
"version": "2.5.7-alpha.4",
44
"description": "A collection of Vue Composables for integrating Web3-Onboard in to a Vue or Nuxt project. Web3-Onboard makes it simple to connect Ethereum hardware and software wallets to your dapp. Features standardized spec compliant web3 providers for all supported wallets, modern javascript UI with code splitting, CSS customization, multi-chain and multi-account support, reactive wallet state subscriptions and real-time transaction state change notifications.",
55
"keywords": [
66
"Ethereum",
@@ -63,7 +63,7 @@
6363
"@vueuse/core": "^8.4.2",
6464
"@vueuse/rxjs": "^8.2.0",
6565
"@web3-onboard/common": "^2.2.4-alpha.1",
66-
"@web3-onboard/core": "^2.15.6-alpha.3",
66+
"@web3-onboard/core": "^2.15.6-alpha.4",
6767
"vue-demi": "^0.12.4"
6868
},
6969
"peerDependencies": {

0 commit comments

Comments
 (0)