Skip to main content

Posts

AUTOMATE END TO END TEST IN CYPRESS

  Tutorial 7 – Automate E2E Test case in Cypress Adding the PDF link as the images are not fully loaded: https://docs.google.com/document/d/1a5Fv-M2wlhs7FTWUxgiyhRy8dNv-NPhObalEbK1tU2w/edit?usp=sharing What you will Learn : Automate End-to-End test case in cypress Automate End-to-End test case in cypress We have studied about locators in the previous sessions. Let us practically use the concept to automate an end-to-end business process in cypress. Below are the steps that we will automate: Launch  https://demo.nopcommerce.com/  in chrome browser Enter ‘Lenovo IdeaCentre 600 All-in-One PC’ text in search  text  field Click Search  button Click ADD TO CART  button Click ‘Shopping cart’  link  at the page top Clear the quantity 1 from the Qty  text  field Enter 2 in Qty  text  field Click ‘Update shopping cart’  button Verify the ‘Total’ amount Let us first navigate these steps manually. Create E2E.spec.js file. Note: W...

AUTOMATICALLY CAPTURE CSS SELECTOR IN CYPRESS

  Adding the PDF link as the images are not fully loaded: https://docs.google.com/document/d/17XTzUZDT1set4VwpK5ULWw7jndcMwGEkfApFo5jyA84/edit?usp=sharing Tutorial 6 – Capture css selector automatically What you will Learn : Automatically capture css selectors instead of creating them manually Automatically capture css selectors instead of creating them manually So far, we have been creating css selectors manually. If you want to automatically capture the css selectors instead of constructing them manually, there are 3 ways: Right click and inspect element -> Copy -> Copy selector SelectorsHub plugin Selector playground in Test Runner Copy selector So let us first see ‘Copy selector’. Launch  http://demo.nopcommerce.com/  and inspect nopCommerce image Now right click the corresponding tag in the html page >Copy >Copy selector Paste it in notepad. So this is the css selector for this image body > div.master-wrapper-page > div.header > div.header-lower ...