DEV Community

Jenni Juli
Jenni Juli

Posted on

How to Write Your First Playwright Test

#playwright #ai #programming #productivity

How to Write Your First Playwright Test

Getting started with test automation? 🚀 Playwright is a powerful open-source framework that helps developers and testers automate web browsers and test modern web applications.

If you are new to Playwright, writing your first test is a great way to understand how browser automation works.

What Is Playwright?

Playwright is a browser automation framework developed by Microsoft. It supports Chromium, Firefox, and WebKit and allows you to automate browser interactions, validate page content, and test application behavior.

Step 1: Install Playwright

First, create a project and install Playwright Test using npm:

npm init playwright@latest
Enter fullscreen mode Exit fullscreen mode

Follow the setup instructions and select JavaScript or TypeScript based on your preference.

Step 2: Write Your First Test

Create a test file named example.spec.js inside the tests folder.

const { test, expect } = require('@playwright/test');

test('verify page title', async ({ page }) => {
  await page.goto('https://example.com');

  await expect(page).toHaveTitle('Example Domain');
});
Enter fullscreen mode Exit fullscreen mode

Understanding the Code

  • test() defines an individual test case.
  • page.goto() navigates to the specified URL.
  • expect() checks whether the actual result matches the expected result.
  • toHaveTitle() verifies the webpage title.

Playwright automatically waits for supported assertions to pass until they succeed or time out.

Step 3: Run Your Test

Execute the following command in your terminal:

npx playwright test
Enter fullscreen mode Exit fullscreen mode

Playwright runs the test and reports whether it passed or failed.

To run the test in a visible browser, use:

npx playwright test --headed
Enter fullscreen mode Exit fullscreen mode

Why Start with Playwright?

✅ Automatic waiting for supported actions and assertions

✅ Cross-browser testing capabilities

✅ Parallel test execution

✅ Built-in debugging and reporting tools

✅ Support for modern web application testing

Final Thoughts

Writing your first Playwright test is the beginning of your automation testing journey. Once you understand navigation and assertions, you can explore locators, form handling, dropdowns, screenshots, API testing, and end-to-end testing.

Want to develop practical automation testing skills? Explore Playwright Automation Training in Chennai at Credo Systemz to learn core concepts, practice automation scripts, and work on real-world testing scenarios.

Top comments (0)