Locating elements by ID

On web applications today, elements should have an ID attribute for all their controls on the page. A control is an element that we can interact with and is not static text. This allows Selenium to find the unique item, since IDs are unique, and then complete the action that it needs to do against that element. ID locators usually have the highest speed, especially when compared to XPath.

Finding IDs of elements on the page with Firebug

In this section, we will find a web button with an ID that is on the page. You will need to have Firebug installed for this. We will look at how to find the ID of an element using Firefox:

  1. Navigate to http://book.theautomatedtester.co.uk/chapter2 and click on the Firebug icon present in the Firefox browser toolbar shown in the following screenshot, or start Firebug by pressing the F12 key:
    Finding IDs of elements on the page with Firebug
  2. Click on the Select Element icon in Firebug . Finding IDs of elements on the page with Firebug
  3. Move your mouse over the element that you wish to have a look at.
  4. Move your mouse over different elements. As you can see in the following screenshot, Firebug will highlight each of the items that you want to see:
    Finding IDs of elements on the page with Firebug

Once a web page element has been selected, you can see that the element and all of the different attributes are now visible. We saw that the item got highlighted, or a single color box surrounded it, so that we can see which item is selected. We can see this in the previous screenshot.

Now that we are confident on how to find elements and their attributes, let's start using them in Selenium.

Finding elements by ID

Elements often have IDs that are used to locate them. In the Target textbox, this will look like id=Element. Follow this example to see how it works:

  1. Open Selenium IDE.
  2. Navigate to http://book.theautomatedtester.co.uk/chapter2 and click on the Firebug icon.
  3. Find any element that you want to interact with on the page and, in the Target textbox of Selenium IDE, place its ID attribute value. Make sure that it has an ID attribute. For example, use but1 as in the preceding screenshot against http://book.theautomatedtester.co.uk/chapter2.
  4. Type the click command into the Command select box.
  5. Play your script.
    Finding elements by ID

Your test will have executed the step successfully. Since the test is using the ID of the element, if that element were to be moved around, it would find the item without any issue. This is one of the main plus points of Selenium over a lot of the competing test frameworks out there.

上一章目录下一章