Demo Web Shop Automation Testing Documentation

Overview

This document outlines the automation tests for the "Demo Web Shop" homepage using
Cypress. The purpose of these tests is to ensure the proper functionality, performance, and
reliability of various features and user interactions on the homepage.

Homepage Navigation: The tests verify that the homepage loads correctly and that all
critical elements, such as product categories, are visible and displayed properly.

Product Search: The search functionality is tested for various product queries to ensure that
it works as expected. Additionally, the accuracy and relevance of search results are verified.

Product Details: The tests ensure that product detail pages display accurate information
about the products. This includes validating product descriptions, prices, and other details.
The functionality of the 'Add to Cart' button is also tested to confirm that it works correctly.

Cart Management: Tests are conducted to check if items can be added to and removed from
the cart effectively. Additionally, the calculations for the cart total are verified to ensure
correctness.

User Registration: The user registration process is tested with both valid and invalid inputs.
This includes checking for successful registration and verifying email confirmation
processes.

User Login/Logout: The login functionality is tested with valid and invalid credentials to
ensure that users can log in and that the system handles incorrect credentials appropriately.
Logout functionality is also tested to ensure users can successfully log out.

Checkout Process: The checkout process is tested using valid payment information to
confirm that it functions correctly. Additionally, the order confirmation and summary are
verified to ensure that orders are processed and displayed accurately.

Test Suite: Demo Web Shop Automation Testing

1. Homepage Navigation

1.1 Homepage Navigation Tests

• Objective: Verify that the homepage of the Demo Web Shop loads correctly and
contains all required elements.
• Steps:
1. Load Time Measurement:
▪ Start a timer when initiating the visit to the homepage.
▪ Use cy.visit to navigate to the homepage URL
(https://demowebshop.tricentis.com).
▪ Measure the time taken for the page to fully load by capturing the
difference between the start time and the time when the page window is
available.
 ▪ Log the load time and ensure it is less than 10 seconds.
2. Homepage Element Visibility Checks:
▪ Verify that the homepage banner image with the alt text "Tricentis Demo
Web Shop" is visible.
▪ Check that the URL of the page is correct and contains the term
'demowebshop'.
▪ Ensure that the login button is visible.
▪ Confirm the visibility of the header menu.
▪ Verify that the search button and input box are visible.
• Assertions:
o The page load time should be less than 10,000 milliseconds (10 seconds).
o The banner image should be visible.
o The URL should be https://demowebshop.tricentis.com/ and contain
'demowebshop'.
o The login button, header menu, search button, and search input box should all be
visible.

Output:

1.2 Product Categories Display Check

• Objective: Verify that the product categories are displayed correctly on the homepage.
• Steps:
1. Visit Homepage:
▪ Navigate to the homepage using cy.visit.
2. Category Visibility Checks:
▪ Verify that the header menu is visible.
 ▪ Check that exactly 7 product categories are displayed under the category
navigation block.
▪ Confirm that the category title within the category navigation block is
visible.
▪ Scroll the page to ensure that the element with class 'center-3' and the
'simple computer' product image are visible.
• Assertions:
o The header menu should be visible.
o There should be exactly 7 product categories displayed.
o The category title should be visible.
o The element with class 'center-3' and the 'simple computer' product image
should be visible after scrolling.

Output

Test Suite: Product Search

1. Setup

before Each Hook

• Objective: Ensure the homepage is visited before each test case.

• Implementation:
o Use cy.visit('https://demowebshop.tricentis.com/') to navigate to the homepage
before executing each test.

2. Product Search Tests

2.1 Search and Verify Results

• Objective: Test the search functionality by querying different products and verify that
search results are displayed.
• Steps:
1. Search for "Digital SLR Camera 12.2 Mpixel":
▪ Enter the search term into the search input field with the ID #small-
searchterms.
▪ Submit the search by simulating the Enter key ({enter}).
▪ Verify that the search results are visible by checking the presence of
elements with the class .item-box.
2. Navigate Back and Search for "3rd Album":
▪ Navigate back to the previous page using cy.go('back').
▪ Enter the new search term "3rd Album" into the search input field and
submit the search.
▪ Verify that the search results are visible by checking for elements with
the class .item-box.
3. Navigate Back and Search for "Diamond Pave Earrings":
▪ Navigate back to the previous page using cy.go('back').
▪ Enter the search term "Diamond Pave Earrings" into the search input
field and submit the search.
▪ Verify that the search results are visible by checking for elements with
the class .item-box.
• Assertions:
o For each search term, the search results should be visible as indicated by the
presence of elements with the class .item-box.

Output
2.2 Verify Search Results

• Objective: Ensure that the search results page displays detailed information about a
product.
• Steps:
1. Search for "Digital SLR Camera 12.2 Mpixel":
▪ Enter the search term into the search input field and submit the search.
2. Click on the First Item:
▪ Click on the first item in the search results list to navigate to the product
detail page.
3. Verify Product Details:
▪ Check that the product image is visible by verifying elements with the
class .picture.
▪ Ensure that the product overview section is visible by checking elements
with the class .overview.
▪ Confirm that the product description is visible by verifying the presence
of p tags.
▪ Verify that the product price is visible by checking for elements with the
class .price-value-18.
• Assertions:
o The product image, overview, description, and price should all be visible on the
product detail page.

Output
Test Suite: Product Details

1. Setup

before Each Hook

• Objective: Ensure the homepage is visited before each test case.

• Implementation:
o Use cy.visit('https://demowebshop.tricentis.com/') to navigate to the homepage
before executing each test.

2. Product Details Tests

2.1 Verify Product Details and Specifications

• Objective: Validate that product details and specifications are displayed correctly for
different products.
• Steps:
1. Search for "Smartphone":
▪ Enter the search term "Smartphone" into the search input field with the
ID #small-search terms.
▪ Submit the search by simulating the Enter key ({enter}).
▪ Click on the first product image in the search results.
2. Verify Details for "Smartphone":
▪ Check that the product name on the detail page contains "Smartphone"
by verifying the text in the h1 tag with the itemprop='name' attribute.
▪ Verify that the product price is "$100.00" by checking the text in the
element with the class .price-value-43.
▪ Confirm that the product specification includes "Battery life 8h in power
use" by verifying the content in the .full-description > :nth-child(3)
element.
3. Navigate Back and Search for "14.1-inch Laptop":
▪ Navigate back two pages using cy.go(-2).
▪ Enter the search term "14.1-inch Laptop" into the search input field and
submit the search.
▪ Click on the product image for "14.1-inch Laptop" in the search results.
4. Verify Details for "14.1-inch Laptop":
▪ Check that the product name on the detail page contains "14.1-inch
Laptop" by verifying the text in the h1 tag with the itemprop='name'
attribute.
▪ Verify that the product price is "$1590.00" by checking the text in the
element with the class .price-value-31.
▪ Confirm that the product size specification contains "14.1" by verifying
the text in the tbody tr:nth-child(1) td:nth-child(2) element.
▪ Verify that the product hardware specification contains "250 GB" by
checking the text in the :nth-child(4) > .spec-value element.
• Assertions:
o For each product, the product name, price, and specifications should match the
expected values.
Output

2.2 Test the Functionality of the 'Add to Cart' Button

• Objective: Ensure that the 'Add to Cart' button works correctly and that the cart updates
as expected.
• Steps:
1. Verify Cart Icon:
▪ Check that the cart icon is visible by verifying the presence of the
element with the class ico-cart and the cart-label span.
▪ Ensure that the cart icon text is "Shopping cart".
2. View Empty Cart:
▪ Click on the cart icon to navigate to the cart page.
▪ Verify that the page title is "Shopping cart" and that the cart is empty by
checking the text in the .order-summary-content element.
3. Navigate Back and Add Product to Cart:
▪ Navigate back to the previous page using cy.go('back').
▪ Search for "Build your own cheap computer" and submit the search.
▪ Click on the first product image in the search results.
▪ Click the 'Add to cart' button for the selected product.
4. Verify Cart Update:
▪ Click on the cart icon to view the cart.
▪ Verify that the cart contains one product by checking the length of
elements with the class .product-picture.
▪ Wait for 3 seconds to ensure the cart update is processed.
▪ Remove the product from the cart by clicking the remove button and
then click the 'Update cart' button to confirm the removal.
• Assertions:
o The cart icon should be visible and display the text "Shopping cart".
o The cart should initially be empty.
o After adding a product to the cart, it should show one product.
o The product should be successfully removed from the cart.
Output

Cart Management Automation Testing Documentation

Overview

This document provides a detailed description of the automation tests for "Cart Management"
on the Demo Web Shop using Cypress. The tests cover adding items to the cart, removing items
from the cart, and verifying cart total calculations.

Test Suite: Cart Management

1. Setup

beforeEach Hook

• Objective: Ensure the homepage is visited before each test case.

• Implementation:
o Use cy.visit('https://demowebshop.tricentis.com/') to navigate to the homepage
before executing each test.

2. Cart Management Tests

2.1 Add Items to the Cart

• Objective: Verify that multiple items can be added to the cart and check the cart
contents.
• Steps:
1. Search and Add "$5 Virtual Gift Card":
 ▪ Enter "$5 Virtual Gift Card" into the search input field with the ID
#small-searchterms and submit the search.
▪ Click on the product image to view details.
▪ Fill out the gift card details and click "Add to Cart".
2. Search and Add "Blue and Green Sneaker":
▪ Navigate back two pages using cy.go(-2).
▪ Enter "Blue and Green Sneaker" into the search input field and submit
the search.
▪ Click on the product image to view details and click "Add to Cart".
3. Search and Add "Black & White Diamond Heart":
▪ Navigate back two pages using cy.go(-2).
▪ Enter "Black & White Diamond Heart" into the search input field and
submit the search.
▪ Click on the product image to view details and click "Add to Cart".
4. Search and Add "14.1-inch Laptop":
▪ Navigate back two pages using cy.go(-2).
▪ Enter "14.1-inch Laptop" into the search input field and submit the
search.
▪ Click on the product image to view details and click "Add to Cart".
5. Verify Cart Contents:
▪ Click on the cart icon to view the cart.
▪ Verify that the cart contains 4 items by checking the number of rows in
the cart table.
• Assertions:
o The cart should contain exactly 4 items.

Output
2.2 Remove Items from the Cart

• Objective: Verify that items can be removed from the cart and that the cart updates
correctly.
• Steps:
1. Add Items to Cart:
▪ Search for "Smartphone", "Blue and Green Sneaker", "Black & White
Diamond Heart", and "14.1-inch Laptop" in sequence.
▪ Add each item to the cart.
2. Remove Items from the Cart:
▪ Click on the cart icon to view the cart.
▪ Remove items one by one from the cart using the remove buttons for
specific items.
▪ Click the "Update shopping cart" button to confirm the removal.
3. Verify Empty Cart:
▪ Navigate back to the previous page using cy.go('back').
▪ Verify that the page title is "Shopping cart".
▪ Confirm that the cart is empty by checking the text in the .order-
summary-content element.
• Assertions:
o The cart should be empty after removing all items.

2.3 Verify Cart Total Calculations

• Objective: Ensure that the cart total calculations are correct based on the added items.
• Steps:
1. Add Items to Cart:
▪ Search for "Smartphone" and "Blue and Green Sneaker".
▪ Add both items to the cart.
 2. Verify Prices and Cart Total:
▪ Click on the cart icon to view the cart.
▪ Verify the unit prices of the added items.
▪ Check the cart total to ensure it matches the expected value.
• Assertions:
o The price of each item should be correct.
o The cart total should be accurate based on the prices of the items.

Output

User Registration and Login/Logout Automation Testing Documentation

Overview

This document outlines the automation tests for user registration and login/logout functionality
on the Demo Web Shop using Cypress. The tests validate both successful and unsuccessful
user registrations, as well as login and logout operations.

Test Suite: User Registration

5.1 Verify Successful Registration and Email Confirmation

Objective: Validate that a user can register successfully with valid inputs and see the
confirmation message.

Steps:
 1. Navigate to Registration Page:
o Click the registration link (.ico-register).
2. Fill Out Registration Form:
o Select the male gender (#gender-male).
o Enter the first name (#FirstName) as "venky".
o Enter the last name (#LastName) as "reddy".
o Enter a unique email address (#Email) as "[email protected]".
o Enter the password (#Password) as "venky123".
o Confirm the password (#ConfirmPassword) as "venky123".
3. Submit the Form:
o Click the register button (#register-button).
4. Verify Registration Confirmation:
o Check if the header is visible (h1).
o Verify the success message (.result) displays "Your registration completed".

Assertions:

• The registration confirmation page should be displayed with the correct success
message.

Output:

5.2 Test Registration with Invalid Inputs

Objective: Validate error handling for invalid registration inputs and re-test with valid inputs.

Steps:
 1. Navigate to Registration Page:
o Click the registration link (.ico-register).
2. Fill Out Form with Invalid Inputs:
o Select the male gender (#gender-male).
o Enter the first name (#FirstName) as "venky".
o Enter the last name (#LastName) as "reddy".
o Enter an invalid email address (#Email) as "venky12#gmail.com".
o Enter a password (#Password) as "Sai12345".
o Enter a mismatched confirmation password (#ConfirmPassword) as
"venky12345".
3. Submit the Form:
o Click the register button (#register-button).
4. Verify Error Message:
o Check for the presence of validation error message (.field-validation-error >
span).
5. Re-Test with Valid Inputs:
o Click the registration link (.ico-register) again.
o Enter valid details:
▪ Email: "[email protected]".
▪ Password and confirmation: "venky123".
o Click the register button (#register-button).
6. Verify Registration Confirmation:
o Ensure the registration confirmation page is displayed (h1).

Assertions:

• An error message should be displayed for invalid inputs.

• The registration confirmation page should appear after re-testing with valid inputs.

Output
Test Suite: User Login/Logout

6.1 Test Login Functionality with Valid Credentials

Objective: Verify that a user can log in with valid credentials and log out successfully.

Steps:

1. Navigate to Login Page:

o Click the login link (.ico-login).
2. Enter Valid Credentials:
o Input a valid email address (#Email) as "[email protected]".
o Input a valid password (#Password) as "venky123".
3. Submit the Login Form:
o Click the login button (form > .buttons > .button-1).
4. Logout:
o Wait for 3 seconds to ensure login completion.
o Click the logout button (.ico-logout).

Assertions:

• The user should be able to log in and log out successfully.

Output

6.2 Test Login Functionality with Invalid Credentials

Objective: Verify that an error message is displayed when invalid credentials are used.
Steps:

1. Navigate to Login Page:

o Click the login link (.ico-login).
2. Enter Invalid Credentials:
o Input a valid email address (#Email) as "[email protected]".
o Input an invalid password (#Password) as "venky1234567".
3. Submit the Login Form:
o Click the login button (form > .buttons > .button-1).
4. Verify Error Message:
o Check if an error message is displayed (.validation-summary-errors).

Assertions:

• An error message should be displayed for invalid credentials.

Output

6.3 Test Logout Functionality

Objective: Verify that the user can log out after logging in.

Steps:

1. Navigate to Login Page:

o Click the login link (.ico-login).
2. Enter Valid Credentials:
o Input a valid email address (#Email) as "[email protected]".
o Input a valid password (#Password) as "venky123".
 3. Submit the Login Form:
o Click the login button (form > .buttons > .button-1).
4. Logout:
o Wait for 2 seconds to ensure login completion.
o Click the logout button (.ico-logout).

Assertions:

• The user should be able to log out successfully.

Output

Test Suite: Checkout Process

This test suite ensures that users can complete the checkout process with valid payment
information and that they can verify their order details afterward. It covers both the checkout
process and order confirmation.

Test 7.1: Test the Checkout Process with Valid Payment Information

Objective: Validate the complete checkout process, including adding items to the cart, entering
shipping and billing information, selecting payment methods, and confirming the order.

Steps:

1. Login:
o Click the login link (.ico-login).
o Enter email (#Email) as "[email protected]".
o Enter password (#Password) as "venky123".
 o Click the login button (form > .buttons > .button-1).
2. Add Item to Cart:
o Click the cart icon (a[class='ico-cart'] span[class='cart-label']).
o Search for "Blue Jeans" (#small-searchterms) and submit the search.
o Click on the product image to view details (.product-item > .picture > a > img).
o Add the product to the cart (#add-to-cart-button-36).
3. Proceed to Checkout:
o Click the cart icon again (a[class='ico-cart'] span[class='cart-label']).
o Check the terms of service (#termsofservice).
o Click the checkout button (#checkout).
4. Enter Shipping Address:
o Select "New Address" from the billing address dropdown (#billing-address-
select).
o Fill out the billing address form:
▪ Company (#BillingNewAddress_Company): "Wipro".
▪ Country (#BillingNewAddress_CountryId): Select "India".
▪ City (#BillingNewAddress_City): "Nandyal".
▪ Address1 (#BillingNewAddress_Address1): "6/24 Srinivasa center".
▪ Address2 (#BillingNewAddress_Address2): "Srinivasa center,
Nandyal".
▪ Zip Code (#BillingNewAddress_ZipPostalCode): "518543".
▪ Phone Number (#BillingNewAddress_PhoneNumber): "9876543234".
▪ Fax Number (#BillingNewAddress_FaxNumber): "9765432345".
o Save the billing address (input[onclick='Billing.save()']).
o Click the continue button (#billing-buttons-container > .button-1).
5. Select Shipping Method:
o Choose in-store pickup (#PickUpInStore).
o Click the continue button (#shipping-buttons-container > .button-1).
6. Select Payment Method:
o Choose the payment method (#paymentmethod_0).
o Click the continue button (input.button-1.payment-method-next-step-button).
o Click the continue button for payment info (input.button-1.payment-info-next-
step-button).
o Confirm the payment (input[value="Confirm"]).
7. Verify Order Confirmation:
o Check that the success message ("Your order has been successfully processed!")
is displayed (strong).
o Click the continue button (input[value="Continue"]).

Assertions:

• The order confirmation page should display the success message and allow continuing
to the next page.
Output

Test 7.2: Verify Order Confirmation and Summary

Objective: Validate that the user can view and confirm order details from their account page.

Steps:

1. Login:
oClick the login link (.ico-login).
oEnter email (#Email) as "[email protected]".
oEnter password (#Password) as "venky123".
oClick the login button (form > .buttons > .button-1).
2. View Order History:
o Click the 'My Account' link (div[class="header-links"] a[class="account"]).
o Click the 'Orders' link (div[class="master-wrapper-main"] li:nth-child(3) a:nth-
child(1)).
3. View Order Details:
o Ensure that the order history section is visible (.center-2).
o Click the 'View Order' button for the first order in the list (:nth-child(1) >
.buttons > .button-2).
4. Verify Order Details:
o Ensure the order details section is visible (.a-left).
o Verify that the order number is displayed (.order-number > strong).
o Confirm that order details are displayed (.order-details > :nth-child(1)).
o Verify that the payment method is correctly shown (.payment-method).

Assertions:

• The order history and order details should be visible and correctly displayed, including
the payment method.
Output: