Selenium Tutorial

Selenium Tool Suit Versions of Selenium Selenium Testing Difference Between Selenium and QTP Advantage and Disadvantage of Selenium

Selenium IDE Topics

Selenium-IDE Introduction Installation /download  Selenium–IDE (Firefox) Installation /download Selenium–IDE (Google Chrome) Characteristics of Selenium-IDE First test case of Selenium-IDE Login test for Selenium-IDE Selenium-IDE commands Selenium-IDE locators Id locator Name Locator  X Path Locator CSS Selector Locator Locating by ID Locating by Class Locating by Attribute Locating by ID/Class & Attribute Locating by Sub-string Locating by inner text Link Text Locator Advantage and Disadvantage of Selenium-IDE

Selenium WebDriver Topics

WebDriver introduction Characteristics of WebDriver Difference Between Selenium RC and WebDriver Installation steps of WebDriver WebDriver Class Diagram/ Architecture WebDriver control commands Browser control Navigation control Web element control Operational control Data capture control Verification control WebDriver working with chrome browser WebDriver working with Firefox browser WebDriver working with internet explorer browser WebDriver working with Microsoft Edge browser WebDriver locator Id Locator Name Locator Class name Locator Xpath Locator XPath axes Link text Locator Partial link text Locator Tag name Locator Css Selector Tag and Id Tag and Class Tag and Attribute Tag, class, and Attribute Sub string matches WebDriver wait statements Drop down handling Mouse and keyboard controls Drag and drop Event Handling Window Handling: New tab/new window Alert pop up Handling Checkbox Handling Radio button Handling Selenium Assertion

CSS Selector: Class in selenium IDE
2019-10-16 04:28:28

CSS Selector: Class in selenium IDE

CSS Selector: Class

Identify a web element with the help of Class as a CSS Selector is like using id attribute. The only difference between Class and id is in their syntax.

The value of a class attribute is used to access the web element.

Syntax of Class Attribute:

css= [HTML tag][.][Value of class attributes]

 [.]: Itis mandatory while using a Class attribute to create a CSS Selector.

We will take an example of an Email text box present in the login form of facbook.com

  • Launch the Firefox browser.
  • And type https://www.facebook.com in Google search box; it will redirect you to the Facebook login page.
  • Where you inspect the email text box web element and notice that the html tag is input and the value of the class attribute is input.login_form_input_box
CSS Selector Class

To verify the locator

  • Open the Test Script Editor Box in selenium IDE and click on the command text box,

And write command as:

Command =verify element present 

Value = css=input.login_form_input_box

CSS Selector Class
  • Click on the Find button. 
  • To verify that the value of a locator is correct or not, you can check in a browser that the Email Text box is highlighted or not.
CSS Selector Class 2

NOTE:  When multiple elements have the same HTML tag and name, then only the first element in source code will be considered.

For example, both email and the password text box have the same class name as: “input text login_form_input_box.”

In this case, the email text box is the first element, so the source code of this element would be considered first.

CSS Selector Class 3