Mocking transactions *within* cypress browser

[actuallymentor]

Hello team!

Thank you for the work on this plugin :)

My intention is to do e2e testing within the browser, not within the cypress declarations. I'm loading web3-mock into the browser by running:

cy.on( 'window:before:load', ( window ) => {

        mock( {
            blockchain,
            window,
            wallet: 'metamask',
            chainId,
            accounts: { return: [ collector_address ] },
            transaction: {
                chainId,
                to: issuer_address,
                from: collector_address,
                value: utils.parseEther( valid_sale.sale_price )
            }
        } )

    } )

Everything goes fine until I try to make a transaction, when I am confronted with:

Please mock the transaction to: 0x${issuer_address} // issuer_address shows the address

I tried using the anything variable for the transaction config but that didn't seem to work.

Is there any direction you can point me on how to get this to work?

[10xSebastian]

Hi Mentor and thanks for giving web3-mock a try.

First of all, the message Please mock the transaction indicates that web3-mock is indeed loaded, and intercepted the transaction.

Testing principles recommend to only write as little code as necessary, and I think the same goes with this framework, so start small, go from them there...

First start with as little mocking as necessary:

mock( { blockchain } )

This should still lead to: Please mock the transaction to: 0x${issuer_address}, now you extend the mock:

mock({
  blockchain,
  transaction: {
    to: issuer_address
  }
})

This should make the error: Please mock the transaction to: 0x${issuer_address} disappear and you can restrict the mock further from here:

mock({
  blockchain,
  transaction: {
    to: issuer_address,
    from: collector_address
  }
})

and so forth.

Regarding your example just two things I would like to follow up on:

1. chainId is not a supported attribute, neither in mock nor in transaction
2. Is it really a pure ether send transaction you're performing or are you indeed performing a smart contract call?

Best Sebastain

[10xSebastian]

btw. you will find a handful of examples of how we use web3-mock in cypress to e2e test our widgets here: https://github.com/DePayFi/widgets/tree/master/cypress/e2e which might be helpful

[10xSebastian]

Closing this issue for now. Feel free to reopen if you still have issues.

[actuallymentor]

Thanks for the details! With less mocking instructions it looks to work. I appreciate the work you guys put into maintaining a library like this. web3 needs it :)