Introduction to Playwright

Mohamed Yaseen
Nerd For Tech
Published in
3 min readSep 7, 2021

The playwright is an open-source, on top of Puppeteer, Web Automation library. It is created by the authors of Puppeteer and maintained by Microsoft.

At some point in our careers, most of us have worked on web automation. Testing time, inconsistent wait conditions, writing a lot of boiler-plate code for browser setup, and running simultaneously, etc are the main problems with automatics. The most common issues we face. The playwright strives to solve these problems and makes it readable, quick, and confident to write the test. Let’s explore how in the next parts we may do this.

Installation: One reason Playwright is used is that it is easy to set up. The playwright may get binaries for all 3 supported browsers after you run the code line indicated below. The configuration is ready for web automation with one simple command.

npm i playwright

3 Principles: The playwright uses the 3 key elements Browser, Context, and Page as the premise.

  • Browser: To launch a browser, we must first perform tests. The playwright uses the Browser class object, which is just a Chrome, Firefox, and Webkit instance.
  • Context: Paralleling via browser contexts is achieved by Playwright. The word ‘Browser Context is an isolated session in an incognito similar to that of a browser’.
  • Page: Page is a new tab in the context or pop-up window. This object will carry out every operation during the test.

Cross-browser support: The most widely used 3 browser engines are supported by Playwright: Chromium, Firefox and Webkit. Therefore, testing may be done once and without or with a small setup across all browsers.

Auto-waiting and reliable execution: One advantage of Playwright is that before acting, you automatically expect UI components to be present. This facilitates the creation of the test and prevents the addition of explicit waiting phases.

The playwright carries out inspections to determine if a selector may accept events and if they are stable, visible, or linked to DOM. These tests are passed, after all, only then does the selection click action. If wait fails after a 30-sec default timeout, the playwright will throw away the timeout error. You may have to wait for a certain period of time if a page has animation or dynamic content. Under such circumstances, WaitForTimeout can be utilized.

Custom waits: The playwright offers customized waiting for scenarios like sluggish page loading, where tests may wait until a selection is ready. Likewise, some network circumstances can be waited for.

Authentication: Authentication in web frameworks is a popular feature. Playwright enables the login of cookies inside a context once and retains the session data. Once saved, it may be used in all tests and avoids several logins from being needed.

Selectors: In addition, Playwright may also rely on more robust selectors such as text content and accessibilities for locating items in addition to conventional selectors such as identification, XPath, CSS, class name, etc provided by other frameworks like Selenium.

Conclusion

The playwright is a great platform to explore. It’s a node.js library and developed for a highly reactive modern online application, which makes tests done using this framework, quicker, competent, and reliable. Exploring this tool and learning was a wonderful experience!

--

--

Mohamed Yaseen
Nerd For Tech

Experienced QA Automation Lead with expertise in test automation, frameworks, and tools. Ensures quality software with attention to detail and analytical skills