Hi folks,
I found the following invaluable resource on how to create and/or build CSS selectors and wanted share it with the forum. I hope others find it as valuable as I have.
5 Likes
Other resources follow:
1 Like
1 Like
Example for using Chrome’s ‘Copy selector’ to find CSS selectors.
01 Using Chrome open: https://katalon-demo-cura.herokuapp.com
02 Click 'Make Appointment' button.
03 Login with John Doe/ThisIsNotAPassword.
04 Right-click on the 'Facility' dropdown.
05 Click 'Inspect'.
06 Right-click on the 'Facility' dropdown.
07 Click 'Inspect'.
08 Click the right caret symbol for <select id="combo_facility" name="facility" class="form-control">.
09 Click on one of the options.
10 Right-click > Copy > Copy selector.
11 Press "Control + F".
12 Paste the copied selector, e.g., #combo_facility > option:nth-child(1) into the search field.
13 Press <Enter> key, option 1 is selected.
14 Change #combo_facility > option:nth-child(2)
15 Press <Enter> key, option 2 is selected.
16 Change #combo_facility > option:nth-child(3)
17 Press <Enter> key, option 3 is selected.
1 Like