Chapter 2: Positioner
The topics in this chapter are as follows:
* Locate elements by ID
* Locate an element by name
* Locate elements based on links
* Locate elements based on xpath
* Positioning elements based on CSS
Tools to be prepared:
Firebug: https://addons.mozilla.org/en-US/firefox/addon/1843
Firefinder: https://addons.mozilla.org/en-US/firefox/addon/11905
IE Developer Tools: this tool is built in IE7 and IE8 and can be called up by pressing F12.
Google Chrome Developer Tools
* Locate elements by ID
Firebug has a "click to view elements in the page" button. Click this button to move the mouse to the element you want to see. Even if the position of the element is moved, it can be found.
* Locate an element by name
Filter can be used for locating by name. For example, name = verifybutton value = chocolate.
* locate elements by link
Target link = link; verifyelementpresent is used for verification.
* positioning elements based on XPath
Ajax uses the DOM model. For example, the first link is document. Links [0]. Mostly used with waitforcondition to search for elements through JavaScript.
example:
function searchlinks () {
var links = document. links,
H = new Regexp (/HTTP: \\//);
for (link in links) {
If (link. tostring (). match (H) {return link ;}< BR >}< br> searchlinks ();
XPath = // input. You can also attach attributes: XPath = // element [@ attribute = 'attribute value'], XPath = // Div [@ class = 'classname'].
// indicates that the system stops when the first element is found. It is a greedy match.
XPath =/html/body/Div [2]/Div [3]/input a single/represents an absolute path. The absolute path is fast, but the flexibility is poor. You may not be able to find the correct element after the UI changes.
access the 2nd tags: // Div [2]
for some dynamic IDs: // Div [contains (@ ID, 'Time _'); the effect of starts-with is similar.
locate the element based on the contained text: // element [text () = 'inner text']. it can also be used with contains: // Div [contains (text (), 'element has a id')]
you can find through adjacent elements: // input [@ value = 'button with id']/following-Sibling: input [@ value = 'sibling click'] others include ancestor, descendant, following, following-sibling, parent, preceding, preceding-sibling
* positioning elements based on CSS
selenium is compatible with CSS 1.0, CSS 2.0, and CSS 3.0 selectors. It also supports pseudo classes and pseudo elements in CSS 3.0.
CSS = div. leftdiv the input is different from the traditional CSS. If it finds one, it stops. The search for child elements can also be expressed as follows: CSS = div. leftdiv> input
Find sibling elements:
for example:
CSS = input # but1 find the first button. The query brother is: CSS = input # but1 + Br + input.
Use the class name together: CSS = div. centerdiv, and centerdiv is the class name.
Use Id: CSS = div # divinthecenter.
Combination of attributes: CSS = input [value = 'chocolate']. The connection is also similar: CSS = A [href = '/.
You can also change attributes: CSS = input [ID = 'but1'] [value = 'button with id'].
Partial match:
^ = Starts-.
$ = Ends-.
* = Contains.
For example, div [ID ^ = 'time _ '] Or Div [ID * = 'time _'].
Access the 2nd tags: CSS = div # divinthecenter *: Nth-child (2 ).
Selenium does not support Nth-of-type pseudo classes. So I used *.
Contains text: CSS = div: Contains ('element has a id ')
CSS can only be read forward, so it is faster than XPath.
# undertake Gtalk such as software automation implementation and training: ouyangchongwu # gmail.com QQ 37391319
# Python QQ group: Shenzhen automated testing Python group: 113938272