Skip to content

kirbycope/playwright-typescript

Repository files navigation

Playwright TypeScript

playwright-typescript

Playwright is an open-source automation library for browser testing and web scraping developed by Microsoft.
TypeScript extends JavaScript by adding types to the language.

Core Concepts

  • Fluent Interface is an object-oriented API whose design relies extensively on method chaining.
    • pageObect.someFunction()
    • pageOject.someElement().click()
  • Page Object Model is a Design Pattern which has become popular in test automation for enhancing test maintenance and reducing code duplication.
    • The "login" screen will have a "Login page object" that contains the selectors for elements on the page and functions that can be performed on that page.

Getting Started

  1. Install NodeJS LTS
  2. Open the root folder using VS Code
    • If you use GitHub Desktop, select the "Open in Visual Studio" button
  3. Open the integrated terminal
  4. Run npm install to install dependencies noted in package.json
  5. Run npx playwright install to install browsers
  6. In the root folder create a new file called .env
  7. Copy+Paste the following
    TEST_BASE_URL="https://the-internet.herokuapp.com"
    TEST_USER="tomsmith"
    TEST_PASS="SuperSecretPassword!"
    
  8. Save

Run Tests

Local Runs

Using VS Code Extension

  1. [One-Time Setup] Install Playwright Test for VSCode
  2. Select the "Testing" tab
  3. Click "Run Test"
  4. To view results, check the "TEST RESULTS" pane

Using VS Code Terminal

  1. In the integrated terminal run npx playwright test
  2. To view results run npx playwright show-report
    • Alternatively, in VS Code right-click playwright-report\index.html and select "Open with Live Server"

GitHub Runs

  1. [One-Time Setup] Open the /settings page for this repo.
    1. Select "Secrets and variables" > "Actions"
    2. Select "New repository secret"
    3. For "Name" enter TEST_BASE_URL and for "Secret" enter https://the-internet.herokuapp.com
    4. Select "New repository secret"
    5. For "Name" enter TEST_USER and for "Secret" enter tomsmith
    6. Select "New repository secret"
    7. For "Name" enter TEST_PASS and for "Secret" enter SuperSecretPassword!
  2. When code is commited the GHA will run, see Actions

About

An example test automation suite using Playwright and TypeScript.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published