Selenium IDE - Locating Elements in Page.

For most of the Selenium commands target is required. This target identifies an element in the content of the web application. The various locator types are:

1. Identifying elements by ID

2. Identifying elements by Name

3. Identifying elements by Link

4. Identifying elements by XPath

5. Identifying elements by CSS

6. Identifying elements by DOM

For identifying elements, we need some applications.

FireBug: Firebug integrates with Firefox to put a wealth of web development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.

We can download this from this website: http://getfirebug.com/.

Just Drag and Drop firebug.xpi to Firefox it will install.

With the help of FireBug you can

1. Identifying elements by ID

2. Identifying elements by Name

Identifying elements by DOM

Few examples for DOM

getElementById()

getElementsByName()

getElementsByTagName()

getElementsByClassName()

identifier=id
Select the element with the specified @id attribute. If no match is found, select the first element whose @name attribute is id.
(This is normally the default; see below.)
id=id
Select the element with the specified @id attribute.
name=name
Select the first element with the specified @name attribute.

• username
• name=username
  

The name may optionally be followed by one or more element-filters, separated from the name by whitespace. If the filterType is not specified, value is assumed.

• name=flavour value=chocolate
  

dom=javascriptExpression


Find an element using Javascript traversal of the HTML Document Object
Model. DOM locators must begin with "document.".

• dom=document.forms['myForm'].myDropdown
• dom=document.images[56]
  

xpath=xpathExpression
Locate an element using an XPath expression.

• xpath=//img[@alt='The image alt text']
• xpath=//table[@id='table1']//tr[4]/td[2]
  

link=textPattern
Select the link (anchor) element which contains text matching the
specified pattern.

• link=The link text
  

css=cssSelectorSyntax
Select the element using css selectors. Please refer to CSS2 selectors, CSS3 selectors
for more information. You can also check the TestCssLocators test in
the selenium test suite for an example of usage, which is included in
the downloaded selenium core package.

• css=a[href="#id3"]
• css=span#firstChild + span