Skip to content
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
42 changes: 42 additions & 0 deletions .github/workflows/cucumber-report.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
name: Cucumber Report

on:
pull_request:
branches: ["main", "master"]
workflow_dispatch:

jobs:
test-and-upload-report:
runs-on: ubuntu-latest
env:
FORCE_JAVASCRIPT_ACTIONS_TO_NODE24: "true"
steps:
- name: Checkout
uses: actions/checkout@v4

- name: Setup Node.js
uses: actions/setup-node@v4
with:
node-version: 24
cache: npm

- name: Install dependencies
run: npm ci

- name: Install Playwright browsers
run: npx playwright install --with-deps

- name: Run cucumber tests
env:
CI: "true"
run: npm test

- name: Upload cucumber report
if: success()
uses: actions/upload-artifact@v4
with:
name: cucumber-report
path: |
cucumber_report.html
report.json

4 changes: 3 additions & 1 deletion .github/workflows/dispatch-to-grader.yml
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,8 @@ on:
jobs:
notify-grader:
runs-on: ubuntu-latest
env:
FORCE_JAVASCRIPT_ACTIONS_TO_NODE24: "true"
steps:
- name: Verify token can access private grader repo
run: |
Expand All @@ -21,7 +23,7 @@ jobs:
echo "HTTP $code"; test "$code" = "200"

- name: Send repository_dispatch to grader
uses: peter-evans/repository-dispatch@v3
uses: peter-evans/repository-dispatch@v4
with:
token: ${{ secrets.GRADER_REPO_PAT }}
repository: automationExamples/Playwright-Cucumber-Exercise-Eval
Expand Down
3 changes: 0 additions & 3 deletions cucumber.js

This file was deleted.

16 changes: 16 additions & 0 deletions features/cart.feature
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
Feature: Shopping cart

Background:
Given I open the "https://www.saucedemo.com/" page

Scenario: Add item, open cart, remove item, and continue shopping
When [Login page] I will login as 'standard_user'
When [Products page] I click 'Add to Cart' for 'Sauce Labs Backpack' item
When [Products page] I click the cart icon
Then [Cart] page should be open
And [Cart] 'Sauce Labs Backpack' should be present
When [Cart] I click 'Remove' for 'Sauce Labs Backpack' item
Then [Cart] 'Sauce Labs Backpack' should not be present
When [Cart] I click 'Continue shopping'
Then [Products page] page should be open

17 changes: 12 additions & 5 deletions features/login.feature
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,17 @@ Feature: Login Feature
Background:
Given I open the "https://www.saucedemo.com/" page

# The actual title is "Swag Labs" (not "Labs Swag"). Step [Login page] clarifies which page title is checked.
Scenario: Validate the login page title
# TODO: Fix this failing scenario
Then I should see the title "Labs Swag"
Then [Login page] "Swag Labs" title should be present

Scenario: Validate login error message
Then I will login as 'locked_out_user'
# TODO: Add a step to validate the error message received
Scenario Outline: Validate login error message
When [Login page] I login with UserName "<userName>" and Password "<passwordType>"
Then [Login page] I should see the error message "<errorMessage>"
Examples:
| userName | passwordType | errorMessage |
| standard_user | invalid | Epic sadface: Username and password do not match any user in this service |
| Invalid_user | valid | Epic sadface: Username and password do not match any user in this service |
| locked_out_user | | Epic sadface: Password is required |
| | valid | Epic sadface: Username is required |
| | | Epic sadface: Username is required |
83 changes: 74 additions & 9 deletions features/product.feature
Original file line number Diff line number Diff line change
@@ -1,13 +1,78 @@
Feature: Product Feature
Feature: Product Feature

Background:
Given I open the "https://www.saucedemo.com/" page

# Create a datatable to validate the Price (high to low) and Price (low to high) sort options (top-right) using a Scenario Outline
Scenario Outline: Validate product sort by price <sort>
Then I will login as 'standard_user'
# TODO: Sort the items by <sort>
# TODO: Validate all 6 items are sorted correctly by price
Examples:
# TODO: extend the datatable to paramterize this test
| sort |
Scenario Outline: Validate product sort by price <sort>
When [Login page] I will login as 'standard_user'
Then [Products page] Page should be opened
And [Products page] '6' Products should be present on the page
When [Products page] I click on 'Sort' dropdown button
Then [Products page] 'Sort' dropdown menu should be present with next options:
| Options |
| Name (A to Z) |
| Name (Z to A) |
| Price (low to high) |
| Price (high to low) |
When [Products page] I click on '<sort>' option
Then [Products page] 'Sort' dropdown menu should be closed
And [Products page] '<sort>' value should be present in the 'Sort' dropdown field
And [Products page] Products should be sorted with the next values:
| Name | Price |
| <productName1> | <productPrice1> |
| <productName2> | <productPrice2> |
| <productName3> | <productPrice3> |
| <productName4> | <productPrice4> |
| <productName5> | <productPrice5> |
| <productName6> | <productPrice6> |

Examples:
| sort | productName1 | productPrice1 | productName2 | productPrice2 | productName3 | productPrice3 | productName4 | productPrice4 | productName5 | productPrice5 | productName6 | productPrice6 |
| Price (low to high) | Sauce Labs Onesie | $7.99 | Sauce Labs Bike Light | $9.99 | Sauce Labs Bolt T-Shirt | $15.99 | Test.allTheThings() T-Shirt (Red) | $15.99 | Sauce Labs Backpack | $29.99 | Sauce Labs Fleece Jacket | $49.99 |
| Price (high to low) | Sauce Labs Fleece Jacket | $49.99 | Sauce Labs Backpack | $29.99 | Sauce Labs Bolt T-Shirt | $15.99 | Test.allTheThings() T-Shirt (Red) | $15.99 | Sauce Labs Bike Light | $9.99 | Sauce Labs Onesie | $7.99 |

Scenario: Add item then remove it from products page
When [Login page] I will login as 'standard_user'
Then [Products page] Page should be opened
When [Products page] I click 'Add to Cart' for 'Sauce Labs Backpack' item
Then [Products page] I should see '1' in the cart badge
When [Products page] I click 'Remove' for 'Sauce Labs Backpack' item
When [Products page] I click the cart icon
Then [Cart] 'Sauce Labs Backpack' should not be present

Scenario: Open product details page and add/remove item
When [Login page] I will login as 'standard_user'
Then [Products page] Page should be opened
When [Products page] I click image for 'Sauce Labs Bike Light' item
Then [Product details page] should be open
And [Product details page] should show expected content:
| Name | Description | Price |
| Sauce Labs Bike Light | A red light isn't the desired state in testing but it sure helps when riding your bike at night. Water-resistant with 3 lighting modes, 1 AAA battery included. | $9.99 |
When [Product details page] I click 'Add to Cart' button
Then [Products page] I should see '1' in the cart badge
When [Product details page] I click 'Remove' button
Then [Products page] cart badge should be removed
When [Product details page] I click 'Back to products' button
Then [Products page] page should be open

Scenario: Verify navigation menu open and close
When [Login page] I will login as 'standard_user'
Then [Products page] Page should be opened
When [Products page] I click navigation bar button
Then [Navigation] should be open
And [Navigation] options should be present with next options:
| Options |
| All Items |
| About |
| Logout |
| Reset App State |
When [Navigation] I click close
Then [Navigation] should be closed

Scenario: Logout from navigation
When [Login page] I will login as 'standard_user'
Then [Products page] Page should be opened
When [Products page] I click navigation bar button
When [Navigation] I click logout
Then [Login page] "Swag Labs" title should be present

123 changes: 113 additions & 10 deletions features/purchase.feature
Original file line number Diff line number Diff line change
@@ -1,14 +1,117 @@
Feature: Purchase Feature
Feature: Purchase Feature

Background:
Given I open the "https://www.saucedemo.com/" page

Scenario: Validate successful purchase text
Then I will login as 'standard_user'
Then I will add the backpack to the cart
# TODO: Select the cart (top-right)
# TODO: Select Checkout
# TODO: Fill in the First Name, Last Name, and Zip/Postal Code
# TODO: Select Continue
# TODO: Select Finish
# TODO: Validate the text 'Thank you for your order!'
Scenario: Validate successful purchase text
# this step log in with user for me is more list when Step due to it just user action and not validation
When [Login page] I will login as 'standard_user'
# this step log in with user for me is more list when Step due to it just user action and not validation
# When [Products page] I will add the backpack to the cart
When [Products page] I click 'Add to Cart' for 'Sauce Labs Backpack' item
Then [Products page] I should see '1' in the cart badge
When [Products page] I click the cart icon
Then [Cart] page should be open
And [Cart] 'Sauce Labs Backpack' should be present
When [Cart] I click 'Checkout'
Then [Checkout] page should be open
When [Checkout] I fill the checkout page with next value:
| First Name | Last Name | Zip code |
| Standard | Standrad Last | 000000 |
Then [Checkout] I click on 'Continue' button
And [Checkout] 'Payment Information' section should be present
And [Checkout] 'Shipping Information:' section should be present
And [Checkout] 'Price Total' should be present with next values:
| Item total | Tax | Total |
| $29.99 | $2.40 | $32.39 |
When [Checkout] I click on 'Finish' button
Then [Checkout] I should see 'Thank you for your order!' text
# add Back home page step to make sure that the user can navigate back to home page after purchase
When [Checkout] I click on 'Back Home' button
Then [Products page] page should be open

Scenario: Multi-item cart, continue shopping, and checkout totals
When [Login page] I will login as 'standard_user'
When [Products page] I click 'Add to Cart' for 'Sauce Labs Backpack' item
When [Products page] I click 'Add to Cart' for 'Sauce Labs Bike Light' item
Then [Products page] I should see '2' in the cart badge
When [Products page] I click the cart icon
Then [Cart] page should be open
And [Cart] the following items should be in the cart:
| Item |
| Sauce Labs Backpack |
| Sauce Labs Bike Light |
When [Cart] I click 'Continue shopping'
When [Products page] I click 'Add to Cart' for 'Sauce Labs Bolt T-Shirt' item
Then [Products page] I should see '3' in the cart badge
When [Products page] I click the cart icon
Then [Cart] the following items should be in the cart:
| Item |
| Sauce Labs Backpack |
| Sauce Labs Bike Light |
| Sauce Labs Bolt T-Shirt |
When [Cart] I click 'Checkout'
Then [Checkout] page should be open
When [Checkout] I fill the checkout page with next value:
| First Name | Last Name | Zip code |
| Multi | Buyer | 90210 |
When [Checkout] I click on 'Continue' button
Then [Checkout] 'Payment Information' section should be present
And [Checkout] 'Shipping Information:' section should be present
And [Checkout] order summary should list products:
| Product |
| Sauce Labs Backpack |
| Sauce Labs Bike Light |
| Sauce Labs Bolt T-Shirt |
And [Checkout] 'Price Total' should be present with next values:
| Item total | Tax | Total |
| $55.97 | $4.48 | $60.45 |

Scenario: Checkout overview then cancel returns to products
When [Login page] I will login as 'standard_user'
When [Products page] I click 'Add to Cart' for 'Sauce Labs Backpack' item
When [Products page] I click 'Add to Cart' for 'Sauce Labs Bike Light' item
Then [Products page] I should see '2' in the cart badge
When [Products page] I click the cart icon
Then [Cart] page should be open
And [Cart] the following items should be in the cart:
| Item |
| Sauce Labs Backpack |
| Sauce Labs Bike Light |
When [Cart] I click 'Checkout'
Then [Checkout] page should be open
When [Checkout] I fill the checkout page with next value:
| First Name | Last Name | Zip code |
| Cancel | Flow | 10001 |
When [Checkout] I click on 'Continue' button
Then [Checkout] 'Payment Information' section should be present
And [Checkout] 'Shipping Information:' section should be present
And [Checkout] order summary should list products:
| Product |
| Sauce Labs Backpack |
| Sauce Labs Bike Light |
And [Checkout] 'Price Total' should be present with next values:
| Item total | Tax | Total |
| $39.98 | $3.20 | $43.18 |
When [Checkout] I click on 'Cancel' button
Then [Products page] page should be open

Scenario Outline: Verify checkout page errors
When [Login page] I will login as 'standard_user'
When [Products page] I click 'Add to Cart' for 'Sauce Labs Backpack' item
When [Products page] I click the cart icon
Then [Cart] page should be open
When [Cart] I click 'Checkout'
Then [Checkout] page should be open
When [Checkout] I fill the checkout page with next value:
| First Name | Last Name | Zip code |
| <firstName> | <lastName> | <zipCode> |
When [Checkout] I click on 'Continue' button
Then [Checkout] I should see error message "<errorMessage>"

Examples:
| firstName | lastName | zipCode | errorMessage |
| | | | Error: First Name is required |
| John | | | Error: Last Name is required |
| John | Doe | | Error: Postal Code is required |

3 changes: 2 additions & 1 deletion generate-report.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,8 @@ const options = {
output: 'cucumber_report.html',
reportSuiteAsScenarios: true,
scenarioTimestamp: true,
launchReport: true,
// In CI we don't want to open a browser/tab automatically.
launchReport: false,
metadata: {}
};

Expand Down
3 changes: 2 additions & 1 deletion package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"scripts": {
"test": "cucumber-js --format json:report.json --exit",
"test": "cucumber-js --require-module ts-node/register --require ./steps/**/*.ts --require ./hooks/**/*.ts --format json:report.json --exit && npm run report",
"report": "node generate-report.js"
},
"devDependencies": {
Expand Down
Loading
Loading