DEV Community

SIYAMALA G
SIYAMALA G

Posted on

download playwright & learn Test Case - JS

#automation #beginners #testing #tutorial

Download the playwright :

Step 1 : Install Node.js
1.Go to the Node.js website.
2.Download the LTS (Long-Term Support) version.
3.Install it.

After installation, verify it:

node -v / npm -v
Enter fullscreen mode Exit fullscreen mode

Both Command display version numbers.

Step 2 :Create a Project Folder
Open Command Prompt

1.mkdir PlaywrightProject
2.cd PlaywrightProject
Enter fullscreen mode Exit fullscreen mode

Step 3 : Initialize a Node.js Project

npm init -y
Enter fullscreen mode Exit fullscreen mode

This creates a package.json file.

Step 4 : Install Playwright

npm init playwright@latest
Enter fullscreen mode Exit fullscreen mode

During installation, you should Answer a few question :

✔ Do you want to use TypeScript or JavaScript?
> JavaScript

✔ Where to put your tests?
> tests

✔ Add a GitHub Actions workflow?
> No

✔ Install Playwright browsers?
> Yes
Enter fullscreen mode Exit fullscreen mode

Step 5: Verify the Installation

npx playwright test
Enter fullscreen mode Exit fullscreen mode

If everything is installed correctly, Playwright will execute the sample tests.

What Is Test Case ?

A test case is a set of steps used to verify whether a particular feature of an application works as expected.

For example,
1.Open the website.
2.Verify that the page loads successfully.
3.Check that the page title is correct.

Basic Test Case Structure

import { test, expect } from '@playwright/test' test('Open Google Homepage', async({ page }) =>{ 
   await page.goto('https://www.google.com');

await expect(page).toHaveTitle(/Google/);
});
Enter fullscreen mode Exit fullscreen mode

Understanding the Code

import { test, expect } from '@playwright/test';
Enter fullscreen mode Exit fullscreen mode

1.test is used to create a test case.
2.expect is used to verify the expected result.

test('Open Google Homepage', async ({ page }) => {
Enter fullscreen mode Exit fullscreen mode

1.test() defines a new test case.
2.'Open Google Homepage' is the name of the test.
3.page represents a browser tab where all browser actions are performed.

await page.goto('https://www.google.com');
Enter fullscreen mode Exit fullscreen mode

1.page.goto() navigates to the specified URL.
2.await waits until the page finishes loading before moving to the next step.

await expect(page).toHaveTitle(/Google/);
Enter fullscreen mode Exit fullscreen mode

This assertion checks whether the page title contains the word Google.

If the title matches, the test passes. Otherwise, it fails.

This assertion checks whether the page title contains the word Google.

If the title matches, the test passes. Otherwise, it fails.

Top comments (0)