Playwright - Web Automation Made Easier

Introduction #

Playwright is an open-source web automation library based on node js, that is built on top of Puppeteer.

Microsoft hired the Puppeteer team and maintained and developed Playwright under its license. The repository is available on GitHub.

Playwright is getting popular day by day because of its various inbuilt features which will make life easier for any web automation tester.

The common challenges faced by web automation testers are slowness of execution, lots of wait time for the element to be actionable, various steps to achieve cross-browser and parallel execution, 4–5 lines of code to achieve switching between windows tabs, upload and download of files. The playwright solves them all by providing some super features.

The documentation provided by them is so detailed and explanatory that you can get started with it without any more references.

Features #

Below are some of the key features of Playwright (as mentioned at https://playwright.dev/java)

• Cross browser, cross platform, and cross language: It supports Chromium, Chrome, Firefox, WebKit (Safari). And when they say webkit, it means that even if you don’t have a Mac system you can still run your testcases on the Safari browser and verify them on your non-Mac system. Isn’t this amazing?!
• Auto-wait: Playwright waits for elements to be actionable prior to performing actions. It also has a rich set of introspection events. The combination of the two eliminates the need for artificial timeouts — the primary cause of flaky tests. In Selenium we must use implicitly wait and for some elements explicitly wait for such scenarios.
• Web-first assertions: Playwright assertions are created specifically for the dynamic web. Checks are automatically retried until the necessary conditions are met.
• Codegen: This enables you to generate tests by recording your actions. Save them in any language. You can copy the entire generated script and simply paste it into your editor, save it and run the test cases.
• Playwright inspector: Inspect page, generate selectors, step through the test execution, see click points, and explore execution logs.
• Trace Viewer: Capture all the information to investigate the test failure. Playwright trace contains test execution screencast, live DOM snapshots, action explorer, test source, and many more. This will be saved in a zip file.

First playwright script in Java #

Before proceeding, please make sure you should have the latest node js installed in your system. You can download it from its official website.

• Create a maven project in your editor and add the following dependency to the pom.xml

<dependency>
      <groupId>com.microsoft.playwright</groupId>
      <artifactId>playwright</artifactId>
      <version>1.23.0</version>
</dependency>

• Latest version is 1.23.0. Save the pom.xml and wait till all the dependencies are downloaded and available under Maven Dependencies.
• If your project is showing the Java version as JavaSE-1.5, update it to JavaSE-1.8.
• Now, you can start with your first testcase in Playwright.

public class PlayWrightTest {
 public static void main(String[] args) {      
  try (Playwright playwright = Playwright.create()) {              
   Browser browser = playwright.chromium().launch();         
   Page page = browser.newPage();         
   page.navigate("http://google.com");         
   System.out.println(page.title());     
   }   
  }
}

Playwright works on 3 main Interfaces – Browser, Browser Context, and Page.

• Playwright is an interface (just like WebDriver in Selenium) and provides a method to launch a browser instance.
• create() launches a new Playwright driver process and connects to it.
• Browser is an interface and it is used to create a browser via BrowserType.launch()
• BrowserContexts provide a way to operate multiple independent browser sessions. So, if you want to launch 2 chrome browsers or one chrome and another firefox, login with the same url and different logins you can achieve this with Playwright.
• Page provides methods to interact with a single tab in a Browser, or an extension background page in Chromium.
• newPage()Creates a new page in the browser context.
• navigate() Returns the main resource response. In selenium, we have the same method for driver object.

Autodownload of Playwright binaries #

In Selenium, to work on different browsers we have a concept called WebDriverManager. We need to add the maven dependency of it in pom.xml, save it, and then we can use it to create a different browser instance.

In playwright things are slightly different and much easier. It works on browser binaries, and it gets downloaded automatically when you run the above program.

So, when you run this program for the first time don’t be surprised if it takes more time, as Playwright is downloading the required binaries. Below code triggers to download the required binaries.

Playwright playwright = Playwright.create()

And once it is downloaded, it gets saved under OS-specific cache folders.

C:\Users\<UserName>\AppData\Local\ms-playwright ---- on Windows system.
~/Library/Caches/ms-playwright ---- on MacOS
~/.cache/ms-playwright ---- on Linux

And later you can see the program gets executed and results are displayed.

You won’t see the browser opening and the result will still be displayed as Playwright by default runs the testcases on headless mode.

Browser browser = playwright.chromium().launch();

To run the tescases on non-headless mode use the setHeadless method and set it to false.

Browser browser = playwright.chromium().launch(new BrowserType.LaunchOptions().setHeadless(false));

If ever, Playwright fails to download the required binaries, you can manually download them by following CLI commands.

• Running without arguments will install default browsers

mvn exec:java -e -Dexec.mainClass=com.microsoft.playwright.CLI -Dexec.args=”install”

• Install WebKit, where you may replace “webkit” with “chrome/chromium/firefox” to download the respective browser

mvn exec:java -e -Dexec.mainClass=com.microsoft.playwright.CLI -Dexec.args="install webkit"