Free AI web copilot to create summaries, insights and extended knowledge, download it at here

Abstract

a">Tests will be run on all 3 browsers, chromium, firefox, and webkit using 3 workers. In default headless mode, no browser will open up when running the tests. The results of the tests and test logs will be shown in the terminal.</p><figure id="ea54"><img src="https://cdn-images-1.readmedium.com/v2/resize:fit:800/1*e1hi36VgNdsBKcNaokbZMQ.png"><figcaption></figcaption></figure><h1 id="091e">To see the browser in action, run</h1><div id="cc8d"><pre>npx playwright <span class="hljs-built_in">test</span> --project=chromium --headed</pre></div><h1 id="90f6">To interact with the test browser</h1><p id="624c">Add <code>await page.pause();</code> to where you feel like stopping it. Then the Playwright Inspector will pop up and the paused step during the execution.</p><figure id="0c27"><img src="https://cdn-images-1.readmedium.com/v2/resi

Options

ze:fit:800/1*HTBb387oTNa0Mrnf90iqWA.png"><figcaption></figcaption></figure><h1 id="e342">In the inspector</h1><p id="b280">There are two great buttons/features that you really want to know to save yourself from staring at HTML elements and writing boilerplates</p><ul><li><b>Record</b> (which records your actions and translates into lines of code)</li><li><b>Explore</b> (which allows you to hover over the page to find elements)</li></ul><p id="2d96">For more info and specific example, feel free to visit <a href="https://playwright.dev/docs/intro">the offical doc here</a></p><p id="a6cf">If you find the guide helpful, feel free to clap and follow me. Join medium via <a href="https://medium.com/@caodanju/membership">this link</a> to access all premium articles from me and all other awesome writers here on medium.</p></article></body>

A Step-by-Step Guide on Playwright to Increase Testing Automation

This article aims to guide you step-by-step on setting up and running Playwright for user e2e testing. It is completely capable of replacing any manual testing process for your web app.

Get into the project folder and install dependencies

mkdir playwright-test && cd playwright-test
npm init playwright@latest

Run test in the default setup

npx playwright test

Tests will be run on all 3 browsers, chromium, firefox, and webkit using 3 workers. In default headless mode, no browser will open up when running the tests. The results of the tests and test logs will be shown in the terminal.

To see the browser in action, run

npx playwright test --project=chromium --headed

To interact with the test browser

Add await page.pause(); to where you feel like stopping it. Then the Playwright Inspector will pop up and the paused step during the execution.

In the inspector

There are two great buttons/features that you really want to know to save yourself from staring at HTML elements and writing boilerplates

Record (which records your actions and translates into lines of code)
Explore (which allows you to hover over the page to find elements)

For more info and specific example, feel free to visit the offical doc here

If you find the guide helpful, feel free to clap and follow me. Join medium via this link to access all premium articles from me and all other awesome writers here on medium.