Playwright is an open-source automation library developed by Microsoft that allows you to write reliable end-to-end tests for web applications across different browsers. It provides a simple and powerful API for automating browser interactions, such as navigating to web pages, clicking elements, filling forms, and extracting data. Here’s a step-by-step tutorial on how to get started with Playwright.
Step 1: Installation
Install Node.js: If you haven’t already, download and install Node.js from nodejs.org. Node.js comes with npm (Node Package Manager), which you’ll use to install Playwright.
Install Playwright: Open your terminal or command prompt and run the following command to install Playwright globally:
npm install -g playwright
This command installs Playwright globally on your system, making it available from anywhere in your terminal.
Step 2: Set up a new project
Create a new directory: Create a new directory for your Playwright project.
Initialize a new Node.js project: Navigate to your project directory in the terminal and run the following command to initialize a new Node.js project:
npm init -y
Step 3: Writing Your First Script
Now, let’s create a simple script to automate browser interactions using Playwright.
Create a new JavaScript file: In your project directory, create a new JavaScript file (e.g.,
test.js).Write your script: Open
test.jsin your favorite code editor and write the following code to automate a basic interaction with a web page:
const { chromium } = require('playwright');
(async () => {
const browser = await chromium.launch();
const page = await browser.newPage();
await page.goto('https://example.com');
console.log(await page.title());
await browser.close();
})();
This script will:
- Launch a new Chromium browser instance.
- Open a new page and navigate to
https://example.com. - Print the title of the page to the console.
- Close the browser.
Step 4: Running Your Script
To run your script, execute the following command in your terminal:
node test.js
You should see the Chromium browser open, navigate to https://example.com, and then close. The title of the page will be printed to the console.
Step 5: Exploring Playwright API
Now that you have a basic script up and running, you can explore the Playwright API to perform more advanced interactions, such as clicking buttons, filling forms, and extracting data.
Refer to the Playwright documentation for detailed information on the API and its capabilities.
Step 6: Writing Tests
With Playwright, you can write tests to verify the behavior of your web application. Here’s a simple example of a test:
const { chromium } = require('playwright');
const { test, expect } = require('@playwright/test');
test('Basic test', async ({ page }) => {
await page.goto('https://example.com');
await expect(page).toHaveTitle('Example Domain');
});
This test navigates to https://example.com and verifies that the page title is “Example Domain”.
Conclusion
That’s it! You’ve now created a basic Playwright script and written a simple test. Playwright provides powerful features for automating browser interactions and writing reliable tests for your web applications. Experiment with different features and explore the documentation to unleash the full potential of Playwright in your testing workflows.