Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/AutomationPanda/awesome-web-testing-playwright
Awesome Web Testing with Playwright: The Automation Panda's Official Playwright Tutorial!
https://github.com/AutomationPanda/awesome-web-testing-playwright
List: awesome-web-testing-playwright
playwright test-automation tutorial typescript web-testing
Last synced: about 2 months ago
JSON representation
Awesome Web Testing with Playwright: The Automation Panda's Official Playwright Tutorial!
- Host: GitHub
- URL: https://github.com/AutomationPanda/awesome-web-testing-playwright
- Owner: AutomationPanda
- License: mit
- Created: 2023-07-20T20:42:57.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-01-30T06:54:01.000Z (about 1 year ago)
- Last Synced: 2024-05-23T01:09:33.486Z (8 months ago)
- Topics: playwright, test-automation, tutorial, typescript, web-testing
- Language: TypeScript
- Homepage: https://AutomationPanda.com
- Size: 9.03 MB
- Stars: 170
- Watchers: 8
- Forks: 32
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- stars - AutomationPanda/awesome-web-testing-playwright - Awesome Web Testing with Playwright: The Automation Panda's Official Playwright Tutorial! (TypeScript)
- stars - AutomationPanda/awesome-web-testing-playwright - Awesome Web Testing with Playwright: The Automation Panda's Official Playwright Tutorial! (TypeScript)
README
# Awesome Web Testing with Playwright
This repository contains the [Automation Panda](https://automationpanda.com/)'s official Playwright tutorial!
In this tutorial, you will progressively create and build a new test automation project using Playwright in TypeScript.
This GitHub repository provides all instructions for the tutorial.
It also provides example code for each chapter,
so you can compare your code to the example if you get stuck.
## Prerequisites
You will need the following tools:
1. A recent version of [Node.js](https://nodejs.org/).
2. A good editor like [Visual Studio Code](https://code.visualstudio.com/) with the [Playwright extension](https://playwright.dev/docs/getting-started-vscode).
3. A [GitHub](https://github.com/) account with a [Git](https://git-scm.com/) client.
## Tutorial setup
Before starting this tutorial, create the new project using the following commands:
```
mkdir awesome-playwright-tests
cd awesome-playwright-tests
npm init playwright@latest
```
Choose the default options for each prompt.
Choose YES to install the Playwright browsers.
This tutorial was created with Playwright 1.36.1,
but later versions of Playwright should be okay to use.
This tutorial also uses a local web app for testing.
This web app is located in a [separate project](https://github.com/filiphric/trelloapp-vue-vite-ts).
Put this project in a separate directory from `awesome-playwright-tests`.
Clone it from GitHub and install its dependencies using the following commands.
```
cd ..
git clone https://github.com/filiphric/trelloapp-vue-vite-ts.git
cd trelloapp-vue-vite-ts
npm install
```
*Warning:*
**Complete these steps *before* taking this tutorial as part of a live session** (like at a conference or a webinar).
The Playwright browsers are a few hundred MBs large,
and you could fall behind if you are stuck waiting for slow downloads over WiFi.
## Tutorial instructions
There are eight chapters in total:
1. Setting modern web testing goals
2. Exploring Playwright's features
3. Writing our first test
4. Refactoring interactions with page objects
5. Breaking down tests by behaviors
6. Scaling tests with parallel execution
7. Running tests with GitHub Actions
8. Learning and practicing more
Chapter-by-chapter tutorial instructions are provided under the `tutorial` folder.
This repository also contains a branch for each chapter's example code.
## Ready to get started?
Go to [Chapter 1](tutorial/01-testing-goals.md) to start the tutorial!