Implement Synpress support methods in your Web3 tests

Hello guys,

Today I am going to post a quick and easy to use snippet with Synpress MetaMask support methods in your Web3 E2E (end-to-end) Test Project.

Create a base class to get the Synpress methods and extend it to use across the project. Here are some examples of methods that you can have:

export default class MetaMaskSupport {
  getCurrentNetwork() {
    return cy.getNetwork();
  }

 isMetamaskWindowActive() {
      return cy.isMetamaskWindowActive();
  }

  getMetamaskWalletAddress() {
    return cy.fetchMetamaskWalletAddress();
  }

  acceptMetamaskAccessRequest() {
    cy.acceptMetamaskAccess();
  }
}

Then you can either extend the class:

import MetaMaskSupport from '../metaMaskSupport';

export default class HomePage extends MetaMaskSupport {
  constructor() {
    super();
  }

  visit() {
    cy.visit('/');
  }

  waitUntilLoggedIn() {
    cy.waitUntil(() => {
      const walletAddress = this.getWalletAddress();
      return walletAddress.should('exist');
    });
  }

  getLoggedInWalletAddress() {
    const walletAddress = this.getWalletAddress();
    return walletAddress.invoke('text');
  }
}

Or you can instantiate as an object:

import MetaMaskSupport from '../metaMaskSupport';

export default class HomePage {
  constructor() {
    super();
    this.metaMaskSupport = new MetaMaskSupport();
  }

  visit() {
    cy.visit('/');
  }

  waitUntilLoggedIn() {
    cy.waitUntil(() => {
      const walletAddress = this.metaMaskSupport.getWalletAddress();
      return walletAddress.should('exist');
    });
  }

  getLoggedInWalletAddress() {
    const walletAddress = this.metaMaskSupport.getWalletAddress();
    return walletAddress.invoke('text');
  }
}

Now, get yourself a drink, you deserve it 🤣

E2E Tests for Web3 Applications (TestJS Summit 2022)

It is out 🎉🎉

If you are curious to know about web3 and how can you test it, here are some ideas!

We will go through a brief explanation of what is Web3 and the architecture of a web3 application. Then we will talk about how to do end-to-end tests, its challenges, some test tools that are available, and 2 demos using Synpress and mocking the web3 layer.

The agenda is:

– What is Web3;

– The Architecture of a Web3 Application;

– Web3 E2E Tests Introduction;

– Web3 E2E Tests Challenges;

– E2E Test Tools;

Demo.

https://portal.gitnation.org/contents/e2e-tests-for-web3-applications

It took me ages to record this video, not going to deny, I am still improving my video editor/design skills… I even bought a new mic to help me and would love to have some feedback about the talk in general.

If you have literally 5 seconds, here is the link.

The big news is, we have created a Web3 Tests Community on Discord !

Yes, me and Jakub, one of the creators of Synpress, are on that and we are looking for contributors and members (of course) 🙂

  1. Yes, I know… We have too many places to create a community nowadays 😩, but this one is going to be one for all of our Web3 Testing people.
  2. Still in the beginning so bear with us while we build and share the content.
  3. Join and share 🤩