Getting Started with the Playwright Test Automation Framework

Posted Jul 29th, 2022

Image > Getting Started With Playwright

Choosing the right test automation framework for your organization can be daunting with so many choices on the market. This article provides a deep dive on Playwright, a newer framework that’s quickly gaining popularity with developers.

As shifting testing left in the software development lifecycle (SDLC) gains popularity, the number of testing frameworks is increasing. One of these is Playwright, which developers use for its fast and reliable ability to quickly write and execute end-to-end tests across multiple languages, mobile web applications, and platforms.

What is Playwright?

Playwright is an open-source, JavaScript-based test automation framework developed and maintained by Microsoft. The Playwright library, which is compatible with Windows, macOS, and Linux, provides cross-browser automation for testing Chromium (Google Chrome, Microsoft Edge), Mozilla Firefox, and WebKit (Apple Safari) through a single, high-level API. Playwright is useful for developers who need to work with multiple programming languages because of its testing compatibility with Python, C# .NET, Node.js, and Java, in addition to JavaScript. Playwright can handle both desktop and mobile testing and supports all major browsers.

Benefits of Playwright Testing

Although Playwright just debuted in 2020 and doesn’t yet offer as many integrations as some other automation platforms, it’s generally considered to be as developer-friendly as more mature frameworks like Selenium and Appium. Here are some reasons why:

  • Speed and coverage: Playwright can be used to test complex applications across multiple languages, mobile web apps, and platforms.

  • Scalability: Playwright can run tests at scale on a preconfigured infrastructure or locally on a container. 

  • Integrations: Playwright integrates with a range of continuous integration/continuous delivery (CI/CD) tools, including Jenkins, CircleCI, and GitLab. It also works well with JavaScript testing frameworks other than JavaScript, including Jest, Jasmine, and Mocha.

  • Enhanced test accuracy: Playwright includes an auto-wait function that repeats the relevant checks on elements and requested actions until they all become actionable.

  • Parallel testing: Playwright can run simultaneous, or parallel, tests for multiple web pages. This allows Playwright to create a browser context for each test—like creating new, individual browser profiles. Testing in parallel provides full test isolation of the individual web pages that can help scale up testing.

Getting Started with Playwright

As you prepare to use Playwright, it’s important to know that your test automation framework needs to be sufficiently robust to run each time code is committed and to provide tools for debugging. 

You can speed up testing and unify results with a containerized solution such as the Sauce Testrunner Toolkit, which has preconfigured container (Docker) images and virtual machines (VMs) for each framework – including Playwright. These can be leveraged to run tests locally or in the cloud at scale. No matter how you test, test assets are sent to the Sauce Cloud for easy debugging with screenshots, videos, logs, and historical insights.

Playwright for Python 

Python is by far the most utilized non-JavaScript programming language. According to the 2021 State of JavaScript survey of more than 16 thousand developers, the largest group of respondents among 20 programming languages, 24.8%, use Python. If you are a Python programmer, you can use the Playwright Pytest plugin to write end-to-end tests or use the library to manually write the testing infrastructure with a test runner like Sauce Testrunner. You can also use the library to manually write the testing infrastructure with the test runner. 

Running Playwright on Sauce Labs

You can use Playwright to test your web apps either locally in Docker or remotely on Sauce Labs Cloud using the saucectl CLI. This gives you the flexibility to run your tests in the environment that best suits your organization, while still benefiting from thousands of device/browser/OS combinations and Sauce Labs analytics. Additionally, saucectl relies on a YAML specification file to determine exactly which tests to run and how to run them. You can customize saucectl to run your Playwright tests by modifying the properties of the YAML file.  

Related resource: How to configure Playwright on Sauce Labs 

saucectl helps mitigate some of the issues that can occur when software teams use multiple test frameworks because it  orchestrates the relationship between your Playwright tests and the rich parallelization, test history filtering, and analytics of the Sauce Labs Continuous Testing Cloudsaucectl performs the underlying business logic to access the tests in Playwright, runs them (either in the Sauce Labs Cloud or locally in a Docker image), then securely transmits the test assets to the Sauce Labs platform, where you can review, share, and evaluate your test outcomes at scale. 

saucectl helps software teams incorporate their Playwright tests earlier in the SDLC to speed up delivery and increase product quality. By covering Playwright in this way, Sauce Labs makes automated testing more accessible and easier for different teams to deliver releases with more confidence in less time. 

To get started, use our Playwright Quickstart Guide to learn how to use saucectl to run Playwright tests directly from your existing Playwright project. If you don't have Playwright tests but want to try, the Playwright Demo Repo includes a sample project structure, working configuration file, and sample Playwright test so you can get up and running in less than 10 minutes.

Examples of Playwright Tests

Below are two examples of tests built using Playwright. These instances are from the playwright.dev documentation site.

Example of a Playwright test in JavaScript with built-in auto-wait functionality where conditions must be met before performing the requested action:

// @ts-check
const { test, expect } = require("@playwright/test");
test("homepage has Playwright in title and get started link linking to the intro page", async ({
page,
}) => {
await page.goto("
https://playwright.dev/"); // Expect a title "to contain" a substring.
await expect(page).toHaveTitle(/Playwright/); // create a locator
const getStarted = page.locator("text=Get Started"); // Expect an attribute "to be strictly equal" to the value.
await expect(getStarted).toHaveAttribute("href", "/docs/intro"); // Click the get started link.
await getStarted.click(); // Expects the URL to contain intro.
await expect(page).toHaveURL(/.*intro/);
});

Example of Playwright application test with Python: The file is created inside the current working directory or in a sub-directory with the code:

import re
from playwright.sync_api import Page, expect

def test_homepage_has_Playwright_in_title_and_get_started_link_linking_to_the_intro_page(
page: Page, foo
):
page.goto("https://playwright.dev/")

# Expect a title "to contain" a substring.
expect(page).to_have_title(re.compile("Playwright"))

# create a locator
get_started = page.locator("text=Get Started")

# Expect an attribute "to be strictly equal" to the value.
expect(get_started).to_have_attribute("href", "/docs/intro")

# Click the get started link.
get_started.click()

# Expects the URL to contain intro.
expect(page).to_have_url(re.compile(".*intro"))

Playwright on Sauce Labs Documentation

Playwright on Sauce Labs 

Using the saucectl CLI 

Playwright Quickstart on Sauce Labs



Written by

Sauce Labs


Topics

Automated TestingDev tools

Try it free