cucumber-playwright

A starter repo for writing E2E tests based on Cucumber(7) with Playwright using Typescript.

Kudos

This repository is based on the Cucumber-typescript-starter repo.

What's inside

Typescript setup for writing steps with eslint/typescript and prettier
Launching of Playwright browser before running all tests
Launching new context and page for each scenario
Running feature with video recording option
Report generated with last good image attached
Utilies function to help you with writing steps
VScode configuration to debug a single feature or an only scenario (run when located on the feature file)

Usage

Create a repo based on this template and start writing your tests.

To run your tests

npm run test or npx cucumber-js runs all tests npm run test <feature name> or npx cucumber-js <feature name> run the single feature

Browser selection

By default we will use chromium. You can define an envrionment variable called BROWSER and set the name of the browser. Available options: chromium, firefox, webkit

On Linux and Mac you can write:

BROWSER=firefox npm run test or BROWSER=firefox npx cucumber-js runs all tests using Firefox

One Windows you need to write

set BROWSER=firefox
npm run test

Working with Page Objects

I am not fond of the Page Object Model (POM) for testing. It feels like a leftover from Java world, and I do not think it fits the Javascript world. However, you can check this PR to see POM implementation.

Debugging Features

From CLI

npm run debug - headful mode with APIs enables both APIs and debug options
npm run api - headless mode with debug apis
npm run video - headless mode vith video

In Visual Studio Code

Open the feature
Select the debug options in the VSCode debugger
Set breakpoints in the code

To stop the feature, you can add the Then debug step inside your feature. It will stop your debugger.

To choose a reporter

The last reporter/formatter found on the cucumber-js command-line wins:

--format summary --format @cucumber/pretty-formatter --format cucumber-console-formatter

In cucumber.js file, modify the options.

To ignore a scenario

tag the scenario with @ignore

To check for typescript, linting and gherkin errors

run the command npm run build.

To view the steps usage

run the command npm run steps-usage.

To view the html report of the last run

run the command npm run report.

vitorleite / testrail-cucumber-playwright Goto Github PK

testrail-cucumber-playwright's Introduction