Merge pull request #6409 from remix-project-org/removeWeb3

remove web3js dependency

Author: Aniket-Engg

apps/debugger/src/app/debugger.ts

@@ -23,7 +23,7 @@ export class DebuggerClientApi extends DebuggerApiMixin(PluginClient) {
   fetchContractAndCompile: (address: string, currentReceipt: TransactionReceipt) => Promise<CompilerAbstract>
   getFile: (path: string) => Promise<string>
   setFile: (path: string, content: string) => Promise<void>
-  getDebugWeb3: () => any // returns an instance of web3.js, if applicable (mainet, goerli, ...) it returns a reference to a node from devops (so we are sure debug endpoint is available)
+  getDebugProvider: () => any // returns an instance of web3.js, if applicable (mainnet, goerli, ...) it returns a reference to a node from devops (so we are sure debug endpoint is available)
   web3: () => any // returns an instance of web3.js
   onStartDebugging: (debuggerBackend: any) => void // called when debug starts
   onStopDebugging: () => void // called when debug stops

apps/remix-dapp/src/actions/index.ts

@@ -1,6 +1,5 @@
 import axios from 'axios';
-import Web3 from 'web3';
-import { AbiCoder } from 'ethers';
+import { AbiCoder, parseUnits } from 'ethers';
 import BN from 'bn.js';
 import { execution } from '@remix-project/remix-lib';
 import { toBytes, addHexPrefix } from '@ethereumjs/util';
@@ -126,7 +125,7 @@ export const runTransactions = async (payload: any) => {
   console.log(payload);
   const { sendValue, sendUnit, gasLimit, selectedAccount } = state.settings;
   const { address, decodedResponse, name } = state.instance;
-  const value = Web3.utils.toWei(sendValue, sendUnit);
+  const value = parseUnits(sendValue, sendUnit);
 
   const tx = {
     to: address,

apps/remix-dapp/src/utils/txRunner.ts

@@ -1,16 +1,9 @@
-import Web3, {
-  FMT_NUMBER,
-  type EthExecutionAPI,
-  type SupportedProviders,
-  FMT_BYTES,
-  type Bytes,
-} from 'web3';
 import { addHexPrefix, toBytes } from '@ethereumjs/util';
 import { execution } from '@remix-project/remix-lib';
-import { toBigInt } from 'web3-utils';
 import { saveSettings } from '../actions';
+import { BrowserProvider, ethers, formatUnits, toNumber, TransactionReceipt, TransactionResponse } from 'ethers'
 
-const web3 = new Web3();
+const provider = ethers.getDefaultProvider()
 
 export const shortenAddress = (address: string, etherBalance?: string) => {
   const len = address.length;
@@ -29,12 +22,9 @@ async function pause() {
   });
 }
 
-async function tryTillReceiptAvailable(txhash: Bytes) {
+async function tryTillReceiptAvailable(txhash) {
   try {
-    const receipt = await web3.eth.getTransactionReceipt(txhash, {
-      number: FMT_NUMBER.NUMBER,
-      bytes: FMT_BYTES.HEX,
-    });
+    const receipt: TransactionReceipt = await provider.getTransactionReceipt(txhash);
     if (receipt) {
       if (!receipt.to && !receipt.contractAddress) {
         // this is a contract creation and the receipt doesn't contain a contract address. we have to keep polling...
@@ -52,12 +42,9 @@ async function tryTillReceiptAvailable(txhash: Bytes) {
   return await tryTillReceiptAvailable(txhash);
 }
 
-async function tryTillTxAvailable(txhash: Bytes) {
+async function tryTillTxAvailable(txhash) {
   try {
-    const tx = await web3.eth.getTransaction(txhash, {
-      number: FMT_NUMBER.NUMBER,
-      bytes: FMT_BYTES.HEX,
-    });
+    const tx: TransactionResponse = await provider.getTransaction(txhash, );
     if (tx?.blockHash) return tx;
     return tx;
   } catch (e) {
@@ -90,16 +77,13 @@ export class TxRunner {
     }, 30000);
   }
 
-  setProvider(
-    provider: string | SupportedProviders<EthExecutionAPI> | undefined
-  ) {
-    web3.setProvider(provider);
+  setProvider(provider) {
+    new ethers.BrowserProvider(provider)
   }
 
   getAccounts() {
     saveSettings({ isRequesting: true });
-    void web3.eth
-      .getAccounts()
+    (provider as any).send("eth_requestAccounts", [])
       .then(async (accounts) => {
         const loadedAccounts: any = {};
         for (const account of accounts) {
@@ -115,17 +99,18 @@ export class TxRunner {
   }
 
   async getBalanceInEther(address: string) {
-    const balance = await web3.eth.getBalance(address);
-    return Web3.utils.fromWei(balance.toString(10), 'ether');
+    const balance = await provider.getBalance(address);
+    return formatUnits(balance.toString(10), 'ether');
   }
 
   async getGasPrice() {
-    return await web3.eth.getGasPrice();
+    const { gasPrice } = await provider.getFeeData()
+    return gasPrice;
   }
 
   async runTx(tx: any, gasLimit: any, useCall: boolean) {
     if (useCall) {
-      const returnValue = await web3.eth.call({ ...tx, gas: gasLimit });
+      const returnValue = await provider.call({ ...tx, gasLimit });
 
       return toBytes(addHexPrefix(returnValue));
     }
@@ -147,8 +132,8 @@ export class TxRunner {
         txCopy.maxFeePerGas = Math.ceil(
           Number(
             (
-              toBigInt(network.lastBlock.baseFeePerGas) +
-              toBigInt(network.lastBlock.baseFeePerGas) / BigInt(3)
+              BigInt(network.lastBlock.baseFeePerGas) +
+              BigInt(network.lastBlock.baseFeePerGas) / BigInt(3)
             ).toString()
           )
         );
@@ -159,8 +144,8 @@ export class TxRunner {
     }
 
     try {
-      const gasEstimation = await web3.eth.estimateGas(txCopy);
-      tx.gas = !gasEstimation ? gasLimit : gasEstimation;
+      const gasEstimation = await provider.estimateGas(txCopy);
+      tx.gasLimit = !gasEstimation ? gasLimit : gasEstimation;
       return await this._executeTx(tx, network);
     } catch (error) {
       console.log(error);
@@ -169,7 +154,8 @@ export class TxRunner {
   }
 
   async detectNetwork() {
-    const id = Number(await web3.eth.net.getId());
+    const { chainId } = await provider.getNetwork()
+    const id = Number(chainId)
     let name = '';
     if (id === 1) name = 'Main';
     else if (id === 3) name = 'Ropsten';
@@ -180,7 +166,7 @@ export class TxRunner {
     else name = 'Custom';
 
     if (id === 1) {
-      const block = await web3.eth.getBlock(0);
+      const block = await provider.getBlock(0);
       if (block && block.hash !== this.mainNetGenesisHash) name = 'Custom';
       return {
         id,
@@ -205,18 +191,18 @@ export class TxRunner {
 
   async _updateChainContext() {
     try {
-      const block = await web3.eth.getBlock('latest');
+      const block = await provider.getBlock('latest');
       // we can't use the blockGasLimit cause the next blocks could have a lower limit : https://github.com/ethereum/remix/issues/506
       this.blockGasLimit = block?.gasLimit
         ? Math.floor(
-          Number(web3.utils.toNumber(block.gasLimit)) -
-              (5 * Number(web3.utils.toNumber(block.gasLimit))) / 1024
+          Number(toNumber(block.gasLimit)) -
+              (5 * Number(toNumber(block.gasLimit))) / 1024
         )
-        : web3.utils.toNumber(this.blockGasLimitDefault);
+        : toNumber(this.blockGasLimitDefault);
       this.lastBlock = block;
       try {
         this.currentFork = execution.forkAt(
-          await web3.eth.net.getId(),
+          (await provider.getNetwork()).chainId,
           block.number
         );
       } catch (e) {
@@ -247,19 +233,16 @@ export class TxRunner {
 
     let currentDateTime = new Date();
     try {
-      const { transactionHash } = await web3.eth.sendTransaction(
-        tx,
-        undefined,
-        { checkRevertBeforeSending: false, ignoreGasPricing: true }
-      );
-      const receipt = await tryTillReceiptAvailable(transactionHash);
-      tx = await tryTillTxAvailable(transactionHash);
+      const signer = await (provider as BrowserProvider).getSigner(tx.from || 0);
+      const { hash } = await signer.sendTransaction(tx);
+      const receipt = await tryTillReceiptAvailable(hash);
+      tx = await tryTillTxAvailable(hash);
 
       currentDateTime = new Date();
       return {
         receipt,
         tx,
-        transactionHash: receipt ? receipt.transactionHash : null,
+        transactionHash: receipt ? receipt.hash : null,
       };
     } catch (error: any) {
       console.log(

apps/remix-ide-e2e/src/tests/ballot.test.ts

@@ -34,7 +34,7 @@ module.exports = {
       .clickFunction('delegate - transact (not payable)', { types: 'address to', values: '"0x4b0897b0513fdc7c541b6d9d7e929c4e5364d2db"' })
       .testFunction('last',
         {
-          status: '0x1 Transaction mined and execution succeed',
+          status: '1 Transaction mined and execution succeed',
           'decoded input': { 'address to': '0x4B0897b0513fdC7C541B6d9D7E929C4e5364D2dB' }
         })
   },
@@ -87,7 +87,7 @@ module.exports = {
       .clickFunction('delegate - transact (not payable)', { types: 'address to', values: '"0x4b0897b0513fdc7c541b6d9d7e929c4e5364d2db"' })
       .testFunction('last',
         {
-          status: '0x0 Transaction mined but execution failed',
+          status: '0 Transaction mined but execution failed',
           'decoded input': { 'address to': '0x4B0897b0513fdC7C541B6d9D7E929C4e5364D2dB' }
         })
   },

apps/remix-ide-e2e/src/tests/ballot_0_4_14.test.ts

@@ -43,7 +43,7 @@ module.exports = {
       .clickFunction('delegate - transact (not payable)', { types: 'address to', values: '"0x4b0897b0513fdc7c541b6d9d7e929c4e5364d2db"' })
       .testFunction('last',
         {
-          status: '0x1 Transaction mined and execution succeed',
+          status: '1 Transaction mined and execution succeed',
           'decoded input': { 'address to': '0x4B0897b0513fdC7C541B6d9D7E929C4e5364D2dB' }
         })
   },
@@ -82,7 +82,7 @@ module.exports = {
       .clickFunction('delegate - transact (not payable)', { types: 'address to', values: '"0x4b0897b0513fdc7c541b6d9d7e929c4e5364d2db"' })
       .testFunction('last',
         {
-          status: '0x1 Transaction mined and execution succeed',
+          status: '1 Transaction mined and execution succeed',
           'decoded input': { 'address to': '0x4B0897b0513fdC7C541B6d9D7E929C4e5364D2dB' }
         })
   },

apps/remix-ide-e2e/src/tests/compile_run_widget.test.ts

@@ -22,7 +22,7 @@ module.exports = {
 
   'Run script using the widget #group2': function (browser: NightwatchBrowser) {
     browser
-      .openFile('scripts/deploy_with_web3.ts')
+      .openFile('scripts/deploy_with_ethers.ts')
       .click('[data-id="compile-action"]')
       .waitForElementVisible('[data-id="compile_group"] i.fa-check', 10000)
   },

apps/remix-ide-e2e/src/tests/eip1153.test.ts

@@ -25,7 +25,7 @@ module.exports = {
       .clickFunction('useTransientStorage - transact (not payable)')
       .testFunction('last',
         {
-          status: '0x1 Transaction mined and execution succeed',
+          status: '1 Transaction mined and execution succeed',
           'decoded output': {
             0: 'uint256: out1 14',
             1: 'uint256: out2 15'

apps/remix-ide-e2e/src/tests/environment-account.test.ts

@@ -33,7 +33,7 @@ module.exports = {
       .assert.containsText({
         selector: '[data-id^="txOriginSelectAccountItem-"]',
         index: 0
-      }, '100 ETH')
+      }, '100.0 ETH')
       .end()
   }
 }

apps/remix-ide-e2e/src/tests/erc721.test.ts

@@ -42,7 +42,7 @@ module.exports = {
       .createContract('')
       .testFunction('last',
         {
-          status: '0x1 Transaction mined and execution succeed',
+          status: '1 Transaction mined and execution succeed',
           'decoded input': {}
         }).end()
   }

apps/remix-ide-e2e/src/tests/metamask.test.ts

@@ -207,7 +207,7 @@ const tests = {
 
       .testFunction('last',
         {
-          status: '0x1 Transaction mined and execution succeed',
+          status: '1 Transaction mined and execution succeed',
           'decoded input': { 'address to': '0x4B0897b0513fdC7C541B6d9D7E929C4e5364D2dB' }
         })
   },