Prerequisites for Installing Playwright | Day 1 | Playwright with JavaScript in 30 Days Challenge | Tech Bharat
Prerequisites for Installing Playwright
To get started with Playwright, you need:
Node.js environment
Visual Studio Code (VS Code) editor
1. Install Node.js
Follow these steps to install Node.js:
Download the installer
Run the downloaded file and complete the installation
2. Verify Node.js Installation
Open your terminal and run:
node -v
or
node --version
3. Verify npm Installation
When you install Node.js, npm (Node Package Manager) is installed by default.
Check the npm version using:
npm -v
or
npm --version
👉 npm is used to install Playwright and other dependencies.
4. Set up Project in VS Code
Create a project folder anywhere on your system
Open the folder in VS Code
Open the terminal inside VS Code
5. Install Playwright
Run the following command:
npm init playwright@latest
6. Configuration Options During Install ation
You will be prompted with the following options:
Choose language: JavaScript or TypeScript
Test folder location: e.g., tests
Add GitHub Actions workflow: Yes/No
Install Playwright browsers: Yes (recommended)
7. Alternative Ways to Install Playwright
Using the VS Code terminal
Using Mac/Windows command prompt
Using VS Code extensions
8. Project Structure Overview
After installation:
node_modules/ → Contains all installed dependencies
tests/ → Contains your test cases
playwright.config.js → Configuration file (parallel execution, browser settings, etc.)
package.json → Lists all dependencies (similar to pom.xml in Maven)
9. Common Playwright Commands
Run Tests ( run all tests on all browsers in headless mode)
npx playwright test
Run Tests in UI Mode
npx playwright test --ui
Run Tests in Specific Browser (Chromium)
npx playwright test --project=chromium
Run Specific Test File
npx playwright test example
Run Tests in Debug Mode
npx playwright test --debug
Generate Tests Automatically
npx playwright codegen
10. Run Tests in Different Modes
Headless Mode (Default)
npx playwright test
Headed Mode
npx playwright test --headed
11. View HTML Report
npx playwright show-report
12. Check Playwright Version
npx playwright --version
13. Using VS Code Extension
Install Playwright Test for VS Code extension from extension tab of vs studio code
Open your project folder
Go to View → Command Palette
Search for Playwright and use available options
- Join our Telegram channel: https://t.me/thetechbharat
- Join our WhatsApp Group: https://chat.whatsapp.com/BBu2ZXxqASr7AHilRfSUzh?mode=gi_t
- Follow us for more info: www.linkedin.com/in/rajat-bhatti
- Subscribe to our YouTube channel: https://www.youtube.com/@Techbharat12
Post a Comment