How to configure WebDriver in Grails for your Geb Tests.

There has been a bit of discussion in the Grails mailing list about the lack of documentation on configuring webdriver for Geb.

In this post, I will outline the steps you will need to configure the following browsers:

• Firefox
• Chrome
• Internet Explorer
• Sauce Labs / Remote Webdriver
• PhantomJS

HTMLUnit won’t be covered because it is broken for grails 2.2 and you shouldn’t be using HTMLUnit.

Adding Geb and Spock:

To start, open up your BuildConfig.groovy file.

Add the following dependency under the plugin block:

plugins{
      test ":geb:0.9.0-RC-1"
      test(":spock:0.7") {
            exclude "spock-grails-support"
      }
}

Add the following dependencies in your dependencies block:

dependencies {
       test "org.spockframework:spock-grails-support:0.7-groovy-2.0"
       test "org.seleniumhq.selenium:selenium-support:2.31.0"
       test "org.gebish:geb-spock:0.9.0-RC-1"
}

Versions of plugins may vary so check them on maven central before adding them.

Create a blank file called GebConfig.groovy in your test/functional/ directory. We will use this file to control which driver is called.

A Sample Geb Test:

Here is a sample geb test to check that your configurations are set up correctly. Add this to your test/functional folder. This test just goes to the grails.mx.org website and checks for the title. Call it LoginSpec.groovy

import geb.spock.GebReportingSpec
 
class LoginSpec extends GebReportingSpec {
    def "go to page"() {
        when:
        go "http://www.grails.org.mx"
 
        then:
        title == "GrailsMX | Groovy y Grails en tu idioma"
    }
}

Also, since this file is a GebReportingSpec (i.e, takes a snapshot of your test after executing and keeps a copy of the html file), you need to set a reporting directory in the GebConfig.groovy file. Add this to the top of your GebConfig:

reportsDir = "target/geb-reports"

You’re ready to test. After setting up each Geb config, simply call grails test-app functional: to see your tests run.

Firefox:

For firefox, you simply need to include the firefox driver. In your dependencies, add:

test "org.seleniumhq.selenium:selenium-firefox-driver:2.31.0"

At this point, you don’t need to add anything to your GebConfig file since it will run the first driver it finds. But if you want to set it explicitivly, add this to GebConfig.groovy:

import org.openqa.selenium.firefox.FirefoxDriver
driver = { new FirefoxDriver() }

Chrome:

For Chrome, you need to first download the chrome driver from https://code.google.com/p/chromedriver/downloads/list

After you have downloaded this file, you should save it locally. For example, /Users/tomaslin/drivers/ . Set an environment variable for webdriver.chrome.driver to this.

Alternatively, you can just do so in your GebConfig.groovy file.

Add the following to set up chromedriver:

import org.openqa.selenium.chrome.ChromeDriver
driver = {
   System.setProperty('webdriver.chrome.driver', '/Users/tomaslin/drivers/chromedriver')
   new ChromeDriver()
}

If you want to be able to switch drivers on the fly via configuration, follow this example – https://github.com/geb/geb-example-grails/blob/master/test/functional/GebConfig.groovy .

If you want to download the drivers automatically, follow this blog post – https://fbflex.wordpress.com/2013/01/06/geb-quickie-automatically-download-drivers-for-chrome-and-internet-explorer/

To get this to run, you need to add the chromedriver dependency in your BuildConfig.groovy file:

test "org.seleniumhq.selenium:selenium-chrome-driver:2.31.0"

Internet Explorer:

Internet explorer follows the same pattern as Chrome Driver above, except that the environment variable name is webdriver.ie.driver and it is downloaded from https://code.google.com/p/selenium/downloads/list . It is called something like IEDriverServer_x64_2.31.0.zip

Add the dependency to BuildConfig.groovy

   test "org.seleniumhq.selenium:selenium-ie-driver:2.31.0"

Then add the following code to your GebConfig file:

driver = {
   System.setProperty("webdriver.ie.driver", new File("C:/dev/Selenium/iexploredriver.exe").getAbsolutePath())
   new InternetExplorerDriver()
}

Selenium Grid / Sauce Labs / Remote Web Driver:

An exciting alternative for running Geb tests is to use Cloudified web servers or local instances available via selenium grid.

In order to use this, you need to add the remote driver dependency in BuildConfig.groovy

    test "org.seleniumhq.selenium:selenium-remote-driver:2.31.0"

If you are subscribed to Sauce Labs, you can simply use your credentials and demand a webdriver instance to be created on the cloud based on your requirements in your GebConfig.groovy file.

Here, I ask for a firefox instance on Windows 8.

import org.openqa.selenium.remote.DesiredCapabilities
import org.openqa.selenium.remote.RemoteWebDriver
driver = {
   DesiredCapabilities capabilities = DesiredCapabilities.firefox()
   capabilities.setCapability("version", "17")
   capabilities.setCapability("platform", "Windows 2012")
   new RemoteWebDriver(
     new URL("http://:<access_key>@ondemand.saucelabs.com:80/wd/hub"), capabilities
   )
}

To get a full list of sauce labs Operating systems and configurations, refer to their browsers page documentation. You can also specify a name for your test for easy identification.

My test finishes running and I see the result when I log onto the Sauce Labs website:

When I click on it, I get a detail recording of the test being ran, all the DOM elements and Events being fired, as well as a screenshot of the test:

This is pretty useful if you’re doing functional tests and continous delivery on the cloud in environments like CloudBees.

If you want to set up your own environments, for example to drive internet explorer on a virtual machine from your mac, you can use the Selenium Grid. The instructions for this are included in the link. You download a jar file to each machine, start a hub and start testing on each machine with the same instructions as above.

PhantomJS:

Finally, if you want to have a headless browsing experience that runs your tests really quickly, you can setup a Geb configuration that relies on PhantomJS. PhantomJS is a headless javascript browser based on Webkit. It is much better than HTMLUnit.

First, you need to install phantomjs via the instructions on their website. I just do this via homebrew ‘brew install phantomjs’.

After you have phantomjs installed, verify that it works by calling phantomjs in your terminal, type phantom.exit(); to exit the console.

You need to then add the ghostdriver jar to run phantomjs tests in Geb. Add the following dependency to your BuildConfig file:

    test( "com.github.detro.ghostdriver:phantomjsdriver:1.0.1" ) {
       transitive = false
    }

Note: The latest version of this driver is 1.0.3, but I had difficulties getting it to work properly on my MacOS installation. 1.0.1 works fine.

The PhantomJS driver is a little trickier, but it looks like this in GebConfig.groovy

import org.openqa.selenium.phantomjs.PhantomJSDriver
import org.openqa.selenium.remote.DesiredCapabilities
driver = {
    new PhantomJSDriver(new DesiredCapabilities())
}

You can also change some of the configurations. For our projects, for example, we wanted to fix the screen size to 1028×768 so that our mobile layout does not kick in. Our config then looks as follows:

import org.openqa.selenium.phantomjs.PhantomJSDriver
import org.openqa.selenium.remote.DesiredCapabilities
import org.openqa.selenium.Dimension
driver = {
    def d = new PhantomJSDriver(new DesiredCapabilities())
    d.manage().window().setSize(new Dimension(1028, 768))
    d
}