In order to click on or type into an HTML element,
Changing selectors from
Let’s talk about how to change
SIMPLE ELEMENT NAME
Google’s homepage currently has a large text input, with a name of “q.” The simplest
//input[@name="q"]
The CSS is very similar:
input[name=q]
Here are examples selecting the element in Ruby using Webdriver 3.0.
driver = Selenium::WebDriver.for :chrome, options: options
driver.navigate.to "http://google.com"
element = driver.find_element :xpath, '//input[@name="q"]'
element = driver.find_element :css, 'input[name=q]'
DIRECT CHILD
HTML is built like a tree, with child nodes below parents. A child in XPATH is represented with a "/", as it is with directories on UNIX filesystems. In CSS the child is indicated with a “>” Examples of a link (“a”) inside of a div tag:
In XPATH: //div/a
In CSS: div > a
CHILD OR SUBCHILD
Sometimes an element is inside another, perhaps several levels down - and the author does not wish to write /div/div/div/div. In that case, a lazy match of any subnode can be defined in XPATH using two slashes, or "//". In CSS just by a whitespace Examples:
In XPATH: //div//a
In CSS: div a
ID
ID’s in XPATH and CSS are similar to names. XPATH defines ID’s using: "[@id='example']" while another approach in CSS is to use the pound sign
In XPATH: //div[@id='example']//a
In CSS: div#example a
CLASS
For class, things are pretty similar in XPATH: "[@class='example']" while another option in CSS is the dot "." Examples: In XPATH: //div[@class='example']//a In CSS: css=div.example a That's