E2E Testing with Puppeteer

Readme.md

End to End Testing techniques for Puppeteer in React

Get Element's details

.$eval is like running document.querySelector

eg:

// html file
<h1 class=".App-title">Hello</h1>

// test file
const html = await page.$eval('.App-title', e => e.innerHTML);
expect(html).toBe('Hello');

Check if element exists

page.waitForSelector('selector') waits for selector loading. It throws node error if not found. This is not valid test case.

I prefer

// test file
const element = await page.$('selector') ? true : false;
expect(element).toBe(true);

Mouse click

page.click('selector') clicks the selector

Keyboard types

await page.type('selector', data to be typed) types the data into selector input

More info

More details