imaun / playwright-demo

Some basic ui testing examples using Playwright & TypeScript

Playwright TypeScript UI Testing Demo

This repository is a demonstration of simple UI testing examples using Playwright and TypeScript.
It’s intended as a learning project and reference for setting up automated browser tests, including interaction, validation, and reporting.

---

✨ Features

• Automated browser tests with Playwright
• TypeScript support
• HTML reports and test traces
• GitHub Actions CI workflow

---

📦 Installation

1. Clone the repository:

git clone https://github.com/imaun/playwright-demo
cd playwright-demo

2. Install dependencies:

npm install

3. Install Playwright browsers:

npx playwright install

🚀 Running the tests

To run all tests:

npx playwright test

📊 Viewing test output

• Terminal summary: You’ll see pass/fail results directly in the terminal.
• HTML report: After running the tests, generate and open the interactive HTML report:

npx playwright show-report

• Trace viewer (if enabled in the tests): Playwright can capture detailed traces. To view a trace, open it with:

npx playwright show-trace trace.zip

⚙️ GitHub Actions CI

This project includes a ready-to-use GitHub Actions workflow (.github/workflows/playwright.yml) to automatically run tests on every push and pull request to the main branch.

The Playwright HTML report is uploaded as an artifact and can be downloaded from the GitHub Actions run page.