Automated Software Testing with Puppeteer & amp; Jest

WHAT IS PUPPETEER?

Puppeteer is a Node.js library developed by Google that lets you control headless Chrome through the DevTools Protocol. It is a tool for automating testing in your application using headless Chrome or Chromebit devices without requiring browser extensions like Selenium Webdriver or PhantomJS.

WHAT IS JEST?

Jest is a delightful JavaScript Testing Framework with a focus on simplicity. It works with projects using: Babel, TypeScript, Node, React, Angular, Vue, and more!

 

Jest Puppeteer UI Automation Architecture

Illustrates the overall Puppeteer architecture.

 

Puppeteer Features

PREREQUISITES

  • Basic understanding of Node.js
  • Basic understanding of Puppeteer
  • A suitable IDE such as VS Code

PUPPETEER SETUP AND LIBRARIES INSTALLATION

Jest-Puppeteer Installation slide 1

 

Jest-Puppeteer Installation slide 2

Once the above setup is done, the jest.config.js file should be created at the root in the project.

Open that file and make a few changes as follows:

  1. set bail: 5,
  2. set preset: "jest-puppeteer",
Create two files at the root

1] babel.cofig.js

babel.config.js file

2] jest-puppeteer.config.js

Jest Puppeteer Configuration

TEST CASES IMPLEMENTATION

Once you finish the above installation and code set up, we are good to go for test case automation!

Now, create a folder in your project at the root with name tests

Then create one file for writing test cases in the tests folder with the name example.test.js

Test Cases Implementation

EXECUTION AND EXPLANATION

To run above written test cases, you need to create a script in the package.json file

Go to the package.json file and update the code in the script section as follows:

Node Script to run tests

Once you added Script to test case, open your terminal and type npm run test and press enter

TEST RESULT

Output of Test Execution

 

SOURCE CODE LINK

https://drive.google.com/drive/folders/1wsul8BX71JmG6xSJo493YM12gnOI9UJf?usp=share_link

 

CONCLUSION

I hope going through this blog gives you an insight into puppeteer and helps you familiarize yourself with the tool and its capabilities.

I think it’s one of the best libraries to automate trivial tasks with an easy-to-use API; if you also feel so, go ahead and automate the tedious tasks in your day-to-day life with Puppeteer.

If you have any queries or feedback, please let me know in the comment section,

Thank You!

FOUND THIS USEFUL? SHARE IT

Leave a Reply

Your email address will not be published. Required fields are marked *