Playwright is a versatile and efficient testing framework designed to automate the testing of web applications. It is available as an open-source tool, meaning that developers can use it without paying any licensing fees. Playwright can run tests on multiple browsers, including popular ones like Chrome, Firefox, and Safari. This allows developers to test their applications across a wide range of browsers and ensure that they function correctly regardless of the browser being used.
The framework provides an intuitive and straightforward API, which makes it easy to interact with web pages and their elements. This includes buttons, links, forms, and other essential components of web pages
Contents
What is Playwright?
Playwright by Microsoft is a versatile and powerful testing framework for automating the testing of web applications. It is the newest addition to the Headless Browser Testing frameworks that are currently popular among developers. It is NodeJS-based, easy to use, and designed to work with multiple browsers. Its powerful API, network interception and modification, and video recording capabilities make it an essential tool for developers who want to ensure that their web applications function correctly across a range of browsers and network conditions.
Features of Playwright
- The Playwright framework enhances reliability and ease of maintenance by conducting multiple checks on elements for their actionability prior to executing specific actions. As a result, the testing framework can concentrate on other aspects of the script instead of handling waiting times through code, leading to simpler and less prone error tests. This approach can be referred to as “Auto-Waits”
- By simulating file uploads and downloads, handling diverse authentication methods, intercepting network requests, and mocking out request responses, test scripts can be utilized to tailor the conditions under which an application is tested. This approach, known as Network Control, promotes more precise testing, ensuring that software operates correctly across multiple scenarios.
- Playwright incorporates browser context testing, which accurately simulates multi-page scenarios and incognito sessions at high speed. This feature is ideal for testing persistent sessions across tabs and validating the proper functionality of websites in incognito mode.
- Playwright offers support for various permissions such as notifications, geolocation, and user settings, including options to modify the color scheme and print settings. This feature enables your website to leverage the latest browser technologies to their fullest potential.
- Playwright offers a convenient solution for accessing a REST API directly from Node.js, without the need to load a page and run JavaScript code in it. This approach can be particularly useful for sending requests directly to your application’s server.
Playwright is more than just a browser control tool. It has transformed into a comprehensive test runner that offers a wide range of features to effectively organize, run, and manage hundreds of tests. Let’s explore this in more detail!
1. Visual regression testing
It is a built-in feature of the Playwright. With Playwright, all you need to do is find an element and use the toHaveScreenshot assertion with it.
This assertion captures a snapshot of the visual component and compares it with the base image in subsequent test runs. If the visual appearance of the component changes, the snapshot will not match the previously saved one, and the test will fail.
Moreover, Playwright generates a visual comparison and includes it in your test reports, making it easier for you to identify changes that may have occurred in the component’s appearance. Overall, this is an excellent feature provided by the Playwright team.
2. Web-first assertions
In Playwright’s documentation, you may come across the term “web-first assertions,” which might seem confusing since you’re running a headless browser to test the functionality of your website. However, these assertions are specifically designed for web-based testing scenarios and provide more functionality than the typical isEqual or is greater than methods found in other testing libraries.
With Playwright’s web-first assertions, you can use methods like to have class, is hidden, to be visible, and to be focused, which are all tailored to interact with the DOM and make UI testing more accessible.
Moreover, Playwright’s custom assertions are asynchronous “matches” that wait for a specific condition to be met. If the condition isn’t satisfied within the timeout limit, an error is thrown. Although this may not seem like a significant feature at first, it eliminates the need for multiple waitFor statements. Each assertion represents a condition within a specific time range, making it more dynamic and flexible.
3. Web performance metrics
Web performance metrics are essential for measuring the speed and efficiency of web applications. Playwright’s testing framework provides several built-in metrics, including page load time, time to first byte (TTFB), and time to interactive (TTI). These metrics help you understand how your web application performs under different conditions and identify any areas for improvement.
However, there may be instances where you need to evaluate a custom metric that is not available within Playwright’s testing framework. In such cases, you can use this “page.evaluate” method to inject custom JavaScript into the tested page and evaluate your custom metric.
By using “page.evaluate”, you can evaluate custom metrics that are not included in Playwright’s testing framework. This makes Playwright a powerful tool for testing web applications and gathering web performance metrics. With these metrics, you can identify any performance bottlenecks and make data-driven decisions to improve the overall speed and efficiency of your web application.
4. Blocking any unnecessary requests
Blocking unnecessary requests is an important step in optimizing the efficiency and speed of your test suite. As your test suite grows, it can become increasingly challenging to ensure that your tests are only targeting the necessary resources on a page.
One common example of unnecessary requests is loading resources such as images, fonts, or advertisements that may not be essential to test the functionality of a page. These resources can significantly slow down your tests, leading to longer test times and reduced productivity.
Fortunately, Playwright provides a straightforward solution to this problem. With the page.route method, you can intercept and modify network requests made by a page during a test. This allows you to block any requests that may slow down your tests and ensure that only necessary resources are loaded.
To use page.route, you can define a callback function that will be executed for each network request made by the page.
Within this function, you can check the request’s URL, method, headers, and other properties to determine whether it should be blocked or modified. For example, you can use the request.abort method to cancel a request or modify its response using the request.fulfill method.
By blocking unnecessary requests, you can significantly reduce the time it takes for your tests to run, making your test suite more efficient and productive.
5. Hidden functionalities
Playwright has evolved into a full-fledged test runner that provides comprehensive functionalities to the group, run, and controls hundreds of tests. While the use of describe block and beforeEach and afterEach methods is standard in most testing frameworks, the test object in Playwright comes with hidden functionalities that are worth exploring.
For example, you can use “test.only()” to run a specific test, “test.fixme()” to skip a test and mark it as broken, “test.slow()” to mark a test as slow and triple the default timeout, and “test.step()” to add an additional level of grouping in your test reports. These methods make debugging easier and help you keep an overview when your test suite expands and you potentially run hundreds of tests.
Limitations of the Playwright testing framework:
- Lack of official support for older browsers like Internet Explorer, though specific browsers can still be used if downloaded locally.
- Incompatibility with some programming languages like Ruby, although this is expected to change as Playwright was designed to support bindings for any language.
- Simulated testing of mobile devices through desktop browsers, rather than real mobile devices.
LambdaTest is a cloud-based cross-browser testing platform that provides a wide range of browser versions, including older ones like Internet Explorer, that can be used for testing Playwright scripts.
LambdaTest’s cloud-based automation testing infrastructure provides the ability to scale testing quickly and easily, which can help with testing large and complex applications. By integrating LambdaTest with Playwright, users can leverage the strengths of both platforms and achieve more comprehensive and reliable testing outcomes.
Conclusion
Following the above tips helps write effective Playwright scripts. It is recommended to plan the tests thoroughly, use Page Objects to make the tests more organized and maintainable, avoid hardcoding values and instead use variables or constants, use wait conditions to ensure reliable tests, use descriptive names for tests and functions, organize the tests into logical groups, and use a version control system to manage test scripts and collaborate effectively with team members.
