Pragmatic Browser Automation with GebNaresha K, Chief Technologist Channel Bridge Software Labs @naresha_k

2

3

4

5

6

WebDriver

7

http://martinfowler.com/bliki/PageObject.html

8

WebDriver

ChromeDriver FirefoxDriver InternetExplorerDriver

9

WebDriver

ChromeDriver FirefoxDriver InternetExplorerDriver

Selenium server

WebDriverJS

10

Coarse Grained

Fine Grained

11

Any problem in computer science can be solved with another

layer of indirection

David Wheeler

12

13

Geb

14

15

16

Browser

import geb.Browserimport org.openqa.selenium.firefox.FirefoxDriver

Browser browser = new Browser(driver: new FirefoxDriver())

17

Browserimport geb.Browserimport org.openqa.selenium.firefox.FirefoxDriver

Browser browser = new Browser(driver: new FirefoxDriver())

// driver.get("http://seleniumconf.org/")browser.go 'http://seleniumconf.org/'

18

Accessing Elements// driver.findElement(By.name("j_username")) def username = browser.$(name: 'j_username')

// username.sendKeys("user1")username << 'user1'

println username.value()

19

20

External Config// GebConfig.groovyimport org.openqa.selenium.firefox.FirefoxDriver

driver = { def driverInstance = new FirefoxDriver() driverInstance.manage().window().maximize() driverInstance

}

Browser browser = new Browser()

// driver.get("http://seleniumconf.org/")browser.go 'http://seleniumconf.org/'browser.quit()

21

Hello GebBrowser browser = new Browser()browser.go “http://localhost:8000/app/login.html"browser.$(name: 'j_username') << 'user1'browser.$(name: 'j_password') << 'secret'browser.$('#submit').click()browser.quit()

22

Hello Geb - Improved

Browser.drive{go “http://localhost:8000/app/login.html"$(name: 'j_username') << 'user1'$(name: 'j_password') << 'secret'$('#submit').click()

}.quit()

23

Configurable URL

Browser.drive{go “login.html”$(name: 'j_username') << 'user1'$(name: 'j_password') << 'secret'$('#submit').click()

}.quit()

// GebConfig.groovybaseUrl = "http://localhost:8000/app/"

24

Assertion

assert $('h1').text() == 'Dashboard'

25

Navigator API

26

Navigator Syntax

$(<css selector>, <index or range>, <attribute / text matchers>)

27

<h2>Introduction</h2><h2>Navigator</h2><h2>Page Objects</h2><h2>Summary</h2>

$('h2').text() == 'Introduction'

$('h2', 1).text() == 'Navigator'

$('h2').size() == 4

28

<h2>Introduction</h2><h2>Navigator</h2><h2>Page Objects</h2><h2>Summary</h2>

$('h2', 0..2)*.text() == ['Introduction', 'Navigator', 'Page Objects']

29

<h2 duration="5">Introduction</h2><h2 duration="15">Navigator</h2><h2>Page Objects</h2><h2 duration="5">Summary</h2>

$('h2', duration: '5').size() == 2

$('h2', text: 'Summary').size() == 1

30

<h2 duration="5">Introduction</h2><h2 duration="15">Navigator</h2><h2>Page Objects</h2><h2 duration="5">Summary</h2>

$('h2', text: contains('o')).size() == 2

$('h2', text: iContains('o')).size() == 3

$('h2', duration: contains('5')).size() == 3

31

<div class="languages"><div class="language jvm">Java</div><div class="language clr">C#</div><div class="language jvm">Groovy</div><div class="language clr">F#</div><div class="language erlang">Elixir</div>

</div>

$('div.languages').find('.jvm').each{ element ->println element.text()

}

Java Groovy

32

<div class="languages"><div class="language jvm">Java</div><div class="language clr">C#</div><div class="language jvm">Groovy</div><div class="language clr">F#</div><div class="language erlang">Elixir</div>

</div>

$('.language').filter('.jvm').each{ element ->println element.text()

}

Java Groovy

$('.language').not('.clr').each{ element ->println element.text()

}

Java Groovy Elixir

33

Page Objects

34

Page Objects

35

Modules

36

Modules

37

38

Modulesclass Record extends Module{

static content = {column {index -> $('td', index)}productCode {column(1).text()}price { column(2).text().toInteger()}

}}

class ProductPage extends Page{static url = 'table.html'static content = {

products {moduleList Record, $('table tbody tr')}}

}

39

Modules

Browser.drive() {to ProductPageproducts.each{ product ->

println "${product.productCode} -> ${product.price}"}

}.quit()

40

Modules List

41

Waiting

42

Wait<div id="dynamic"></div>

waitFor { $('#dynamic').text()}waitFor(8) { $('#dynamic').text()}waitFor(8, 0.5) { $('#dynamic').text()}waitFor('slow') { $('#dynamic').text()}

// GebConfig.groovywaiting { presets { slow { timeout = 12 retryInterval = 1 } }}

43

Integration

https://www.flickr.com/photos/lumaxart/2137737248

44

Supported Frameworks

45

Spock Example@Stepwiseclass SampleGebSpec extends GebReportingSpec{

def "User can login"(){ when: to LoginPage

login('user1', 'secret') then:

at DashboardPageand:header.pageTitle == 'Dashboard'

}

}

46

Integration

47

• Power of WebDriver • Elegance of jQuery selection • Robustness of Page Object

modeling • Expressiveness of Groovy

Summary

Welcome Geb

48

ReferencesOfficial Geb Page - http://www.gebish.org/

Example - https://github.com/geb/geb-example-gradle

Spock Documentation - http://spock-framework.readthedocs.org/en/latest/

Code samples - https://github.com/naresha/seconf2014