
The ElementHandle is an object of the identified element. This method yields a Promise with the ElementHandle. These objects refer to an element or tag in a page. The ElementHandle objects are created by the methods - page.$, page.$$ and page.$x. To get the property of an element uniquely we need to inspect it (right-click on the element then select the option Inspect). Once we navigate to a webpage, we have to interact with the webelements available on the page like clicking a link/button, entering text within an edit box, and so on to complete our automation test case.įor this, our first job is to identify the element.

We can handle elements on page with Puppeteer. Here, the actual automation code is developed by the end-user using JavaScript. Puppeteer − This is actually a package based on the node module.Īutomation test code − This is also known as the Nodejs level. The browsers - Microsoft Edge and Chrome utilise Chromium as browser engine. This is done by following the protocols of DevTools.īrowser(with/without headless mode) − The browser performs the actions to be executed on the browser engine.Ĭhromium Development Project or CDP − The Chromium is the real place where all the operations are executed. Puppeteer utilises the Node library that gives a top-class API for managing Chromium or Chrome browsers.

If we follow the npm trends for Puppeteer download for the last few years, we shall observe an upward trend towards the use of Puppeteer (available from the below link) − Puppeteer is like a development tool as it is capable of performing a majority of tasks performed by a developer like handling requests and responses, locating elements, network traffic and performance, and so on. We can open DevTools in the Chrome browser, by pressing F12 or Command+Option+C(in MacOS). It is mostly used to manage the internal features of the Chromium browser.

Puppeteer is not considered as an automation tool like Selenium, Cypress, Protractor, and so on. The actions like web page crawling and scraping can be performed with Puppeteer. It can be used to test applications developed in Angular and Angularjs. Puppeteer can be used for the automating majority of UI testing, keyboards, mouse movements, and so on. However, it can also be used for non-headless execution on browsers like Chrome/Chromium/Edge/Firefox. Puppeteer contains APIs to interact and manage Chrome browser in headless mode or Chromium (following the protocols in DevTools). Puppeteer is based on the Node.js library and is open-source. Puppeteer is used for automation and streamlining of the frontend development and testing respectively.
