Automation testing with Playwright

#playwright #testing #softwareengineering #qa

Why Playwright?

Cross-language: JavaScript, TypeScript, Python, .NET, Java
Cross-platform: Windows, Linux, macOS, and support headed and headless mode
Cross-browser: Chromium, Webkit, and Firefox
Auto-wait
Codegen: Record your actions and save them in your language
Trace Viewer: Capture all information to investigate the test failure
And many more...

Pre-requisites

Install Node.js 18 +
VScode(To have a better experience by using the playwright extension)
Basic programming skills

Installation

Open the terminal and run the below command

npm init playwright@latest

2.Choose JavaScript(default is TypeScript)

3.Choose where you want to save your tests and hit Enter

4.Add a GitHub Actions to easily run tests on CI( Select false)

5.Install Playwright browsers and hit Enter

6.Install Playwright operating system dependencies(No is a default) hit Enter

7.Congratulations you have successfully installed Playwright

Write the first test scripts

We are going to use the playwright's example and

Import test and expect arguments from playwright
Open playwright URL
Verify that the page title has Playwright
Click on Get Started
Verify that Installation text is visible

Code Snippet

/*Importing test which help you to write test cases */
/*Importing expect which help to validate expected result */
const { test, expect } = require('@playwright/test');

/* Open Playwright url*/
test('has title', async ({ page }) => {
  await page.goto('https://playwright.dev/');

  // Expect a title "to contain" a substring.
  await expect(page).toHaveTitle(/Playwright/);
});

test('get started link', async ({ page }) => {
  await page.goto('https://playwright.dev/');

  // Click the get started link.
  await page.getByRole('link', { name: 'Get started' }).click();

  // Expects page to have a heading with the name of Installation.
  await expect(page.getByRole('heading', { name: 'Installation' })).toBeVisible();
});

Code Screenshot for better visibility