Finding an Element With Webdriver- Part I

The most useful method of Webdriver is the findElement() method.  It can also be the most frustrating:  you can see the element you want on your webpage, but it's often difficult to figure out how to tell Webdriver to find it!

There are many different ways to find an element with findElement():

By.id
By.className
By.name
By.linkText
By.partialLinkText
By.tagName
By.cssSelector
By.xpath

I will include examples of these in this blog entry, and in the two entries following.  But first you need to know how to inspect an element in order to make the best choice about which By method to use.  Go to www.google.com, right-click in the search text field, and choose "Inspect Element".  A new window will open up at the bottom of the screen, and you will see the element highlighted:

<input id="lst-ib" class="gsfi" type="text" value="" autocomplete="off" name="q" style="border: medium none; padding: 0px; margin: 0px; height: auto…; width: 100%; background: url('" dir="ltr" spellcheck="false"></input>

Look at the id attribute:  id = "lst-ib".  This is what we will use for our first findElement() exercise.
(Note that the id for this element changes periodically.  Substitute whatever you see listed as the element id in the steps below.)

Return to myFirstTest in Eclipse and add the following text below the driver.get(URL) command:
driver.findElement(By.id("lst-ib")).sendKeys("Hello World");

This command tells Webdriver to:
1.  Find the element with the id "lst-ib"
2.  Type "Hello World" into the element

You will also need to add the following to the import section of your test:
import org.openqa.selenium.By;

Insert a breakpoint into your test so that you can see if the commands were executed correctly.  To do this, right-click in the left margin of the "driver.quit();" command and select "Insert Breakpoint".  Then to run the test, right-click on the test, and select Debug As->JUnit Test.  The test should run and will stop just after it has typed "Hello World" into the text field.  If this is what you see, then you have used findElement() correctly!  Click on the green arrow at the top of the screen to finish the test.

We now have an example of findElement(By.id()).  Now let's try By.className.  Look back at the html that describes the text field.  You should see the class attribute:  class="gsfi".  (Note that the class name for this element changes periodically.  Substitute whatever you see listed as the class in the steps below.)Let's change our test to find the element by className.  Replace the findElement command in your test with:
driver.findElement(By.className("gsfi")).sendKeys("Hello World");

Run the test in debug mode again, and you should again see that "Hello World" has been typed into the text field.  The result is the same, but this time the element was located by the class name instead of by the id! Click on the green arrow to finish the test.

Finally, let's try to find the element by its name.  Look at the html again and see the attribute name="q". Replace the findElement command in your test with:
driver.findElement(By.name("q")).sendKeys("Hello World");

Run the test in debug mode again, and you should see that once again, "Hello World" has been typed into the text field.  Click on the green arrow to finish the test.

You have successfully located a web element by using an id, a class name, and a name!  The next blog entry will discuss finding elements by link text, partial link text, and tag name.

Installing Webdriver

Webdriver is an API that enables testers to find and use web elements in their automated tests.  To get set up, you will need to find out what the latest version of Webdriver is.  Navigate to this link:  http://docs.seleniumhq.org/download and in the section called Selenium Client and Webdriver Language Bindings, find the Java entry and make a note of the latest client version.

Next, you will need to add this text to your project's POM file:
<dependency>
   <groupId>org.seleniumhq.selenium</groupId>
   <artifactId>selenium-java</artifactId>
   <version>2.39.0</version>  //replace the version number here with the most current version number
 </dependency>

Add the text after the JUnit dependency, so that the dependencies section now looks like this:

<dependencies>
    <dependency>
      <groupId>junit</groupId>
      <artifactId>junit</artifactId>
      <version>4.8.1</version>
    </dependency>
    <dependency>
<groupId>org.seleniumhq.selenium</groupId>
<artifactId>selenium-java</artifactId>
<version>2.39.0</version>
</dependency>
  </dependencies>

In the command line, navigate to your project folder.  Then type:
clean install
This will download all of the dependencies needed to run Webdriver in your project.

Let's set up a new test using Webdriver:

1. Right-click on the myFirstTests package and select New->Class
2. Give the class a name of secondTest
3. The SecondTest class should open in the center pane, and should look like this:
package myFirstTests;
public class SecondTest {
}

4. In between the brackets, add the following:
@Test
public void test() {
}

5. Add the following to the import section:
import org.junit.Test;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;

6.  In between the brackets following test(), add this code:
driver = (WebDriver) new FirefoxDriver();
String URL = "http://www.google.com";
driver.get(URL);
driver.quit();

7.  Right-click on the test name secondTest and choose Run As-> JUnit Test.  You should see a Firefox browser open, navigate to Google, and close again, and on the JUnit tab of Eclipse, you should see that the test has passed.

Congratulations!  You are now all set up to begin writing your own automated Webdriver tests!  In my next post, I will discuss the Webdriver syntax.

Understanding the POM

A POM file is necessary for any automated testing with Maven.  It can seem daunting at first, especially if you don't usually work with XML files, but it's actually very simple.  

POM stands for "Project Object Model".  It contains instructions about where to look for the source code for your tests, and what versions of JUnit, Maven, and Webdriver to use.  

Here is an example of a POM file, which should look very similar to the file you created for your First Java Project:

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">

  <modelVersion>4.0.0</modelVersion>

  <groupId>MyFirstJavaProject</groupId>

  <artifactId>MyFirstJavaProject</artifactId>

  <version>0.0.1-SNAPSHOT</version>

  <build>

    <sourceDirectory>src</sourceDirectory>

    <plugins>

      <plugin>

        <artifactId>maven-compiler-plugin</artifactId>

        <version>2.3.2</version>

        <configuration>

          <source>1.7</source>

          <target>1.7</target>

        </configuration>

      </plugin>

    </plugins>

  </build>

  <dependencies>

    <dependency>

      <groupId>junit</groupId>

      <artifactId>junit</artifactId>

      <version>4.8.1</version>

    </dependency>

    <dependency>

<groupId>org.seleniumhq.selenium</groupId>

<artifactId>selenium-java</artifactId>

<version>2.32.0</version>

</dependency>

  </dependencies>

</project>

Let's look at the file one section at a time:  

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">

</project>

This is information that describes the schema for the Maven project.  This will be automatically generated for you.

 <modelVersion>4.0.0</modelVersion>

 <groupId>MyFirstJavaProject</groupId>

 <artifactId>MyFirstJavaProject</artifactId>

 <version>0.0.1-SNAPSHOT</version>

This is required information for every POM file-

The version number of Maven

The groupId (can be any name you like)

The artifactId (should match the name of your project)

The version number of your project (can be any number you like, and it's easy to just leave it at the default of 0.0.1-SNAPSHOT)

<build>

    <sourceDirectory>src</sourceDirectory>

    <plugins>

    </plugins>

</build>

The build section defines what will be necessary to build the project-

The sourceDirectory defines where Maven should look for your source files.  If you ever have trouble with a build, check to make sure this value is correct.  In this case, the source files will be found in the src folder.

The plugins section defines what plugins are necessary in order for your tests to run.

<plugin>

        <artifactId>maven-compiler-plugin</artifactId>

        <version>2.3.2</version>

        <configuration>

          <source>1.7</source>

          <target>1.7</target>

        </configuration>

</plugin>

The plugin that is needed in this case is the Maven compiler plugin.  The compiler version is specified, and the source and target Java versions are specified.  

<dependencies>

    <dependency>

      <groupId>junit</groupId>

      <artifactId>junit</artifactId>

      <version>4.8.1</version>

    </dependency>

    <dependency>

<groupId>org.seleniumhq.selenium</groupId>

<artifactId>selenium-java</artifactId>

<version>2.32.0</version>

     </dependency>

  </dependencies>

Finally we need the dependencies; any extra software that the code needs in order to run properly.  In the case of this example, we need JUnit and Selenium to run our tests.  

As you become adept at test automation, you will probably run into situations where a test that ran without difficulty suddenly won't run at all.  This is often because of browser/Selenium incompatibility; for instance, a new version of Firefox may have been released, and you will need the latest version of Selenium in order for your tests to run in the new browser.  Rather than downloading and replacing files yourself, all you need to do is alter the version number of Selenium in your POM file, and the next time you do a Maven build, the project will fetch and download the new files for you!  

This is far from an exhaustive list of all the information that a POM file can contain; it is merely a brief description to help demystify what the file does and how it can be used.  For more information, see these helpful links:

http://maven.apache.org/pom.html#Build_Settings

http://maven.apache.org/guides/introduction/introduction-to-the-pom.html