1

I faced Uncaught (in promise) DOMException error like below when I was developing Nuxt web app with Metamask(chrome) and truffle Ganache.

Uncaught (in promise) DOMException: Failed to execute 'postMessage' on 'Window': function (error, response) {
              _this2.removeAllListeners(payload.id);
              if (!error) {
 ...<omitted>... } could not be cloned.

What I tried to do is send transactions to local blockchain(Ganache).

    async sendTransaction(obj) {
      const web3 = await getWeb3();
      // get account
      const accounts = await web3.eth.getAccounts();
      const roomFactory = await getRoomFactory();

      // *ERROR OCCURS HERE*
      const result = await roomFactory.methods
        .createNewRoom(obj._roomId)
        .send({ from: accounts[0] });
      console.log("result", result);
    },

function getWeb3() and getRoomFactory() are following:

// getWeb()

const getWeb3 = () =>
  new Promise(async (resolve, reject) => {
    // Modern dapp browsers...
    if (window.ethereum) {
      const web3 = new Web3(window.ethereum);
      try {
        // Request account access if needed
        await window.ethereum.enable();
        // Acccounts now exposed
        resolve(web3);
      } catch (error) {
        reject(error);
      }
    }
    // Legacy dapp browsers...
    else if (window.web3) {
      try {
        // Use Mist/MetaMask's provider.
        const web3 = new Web3(window.web3.currentProvider);
        console.log("Injected web3 detected.");
        resolve(web3);
      } catch (error) {
        reject(error);
      }
    }
    // Fallback to localhost; use dev console port by default...
    else {
      try {
        const provider = new Web3.providers.HttpProvider(
          "http://127.0.0.1:8545"
        );
        const web3 = new Web3(provider);
        console.log("No web3 instance injected, using Local web3.");
        resolve(web3);
      } catch (error) {
        reject(error);
      }
    }
  });
import getWeb3 from "~/plugins/web3.js";
import RoomFactory from "./build/contracts/RoomFactory.json"; // which is build by truffle

const getRoomFactory = async () => {
  const web3 = await getWeb3();

  const abi = RoomFactory.abi;
  const networks = RoomFactory.networks["5781"];
  return web3.eth.Contract(abi, networks.address);
};

What I can do:

  • get accounts (web3.eth.getAccounts()) from metamask provider
  • get balance (web3.eth.getBalance(accounts[0]))

What I cannot do:

  • send transaction to other contracts (Mycontract.methods.myfunction().send())
  • call (Mycontract.methods.myfunction().call())

screenshot_1

Versions:

  • Web3: 1.0.0-beta.36
  • Metamask: 5.3.2
  • truffle: 5.0.1

Similar problem is on the issue of metamask-extension.

I'd appreciate it if you could help me with some tips. Thank you.

-1

I solved this problem by installing 1.0.0-beta.37.

  • Why would you vote this down? I'm having this exact issue. – M H Feb 6 at 19:23

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.