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: ID/Class and Attribute in Selenium IDE
2019-10-16 04:37:09

CSS Selector: ID/Class and Attribute in Selenium IDE

CSS SELECTOR: ID/Class and Attribute

The Id, class, and attribute of CSS selector are used to identify the web element to access the web pages.

 Syntax for Id/Class and Attribute:

css=<./#> {[attribute=Value of attribute]}  

[#]: It is used to present an ID attribute. It is mandatory while using the ID attribute to create a CSS selector.  

[.]: It is used to display a Class attribute. It is necessary while using a class attribute to create a CSS Selector.

Value of Class or ID attributes: It access by the value of ID/Class and attribute.

In this section, < [attribute=Value of attribute]> we can use value, type and name as an Attribute. 

Value of attribute: It denotes the value of an attribute which is used to locate the web element.

Let see an example of an ID/ Class and Attribute

Locating ID/Class and attribute of CSS selector, we would access the Password textbox present in the login form at the Facebook.

  • Launch the Firefox browser.
    • And type https://www.facebook.com in Google search box.
    • It will redirect you to the Facebook login page.
CSS SELECTOR ID Class and Attribute

Where HTML tag value is [input], attributes are ID and type, and their parallel values are [Pass] and [password], and all of them together make a reference to the [Password] textbox.     

 Verify the locator value:

  • Type css=input#Pass[name='Pass'] i.e. the locator value in the target box in the Selenium IDE.
CSS SELECTOR ID Class and Attribute 1
  • To verify the value of a locator is correct or not, click on the Find button in the selenium IDE interface.
  • And check in a browser that the password Text box is highlighted or not.     
CSS SELECTOR ID Class and Attribute 2