Agile NCR 2013 - Gaurav Bansal- web_automation

545 views
475 views

Published on

Published in: Business
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
545
On SlideShare
0
From Embeds
0
Number of Embeds
108
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Agile NCR 2013 - Gaurav Bansal- web_automation

  1. 1. Ultimate Web Automation using WebDriver, Groovy, JQuery and Domain Modelling It is just not all about Selenium Gaurav BansalPrincipal Consultant, XebiaPhone: +91-989-984-9992E-mail: gbansal@xebia.com
  2. 2. Challenges…More Deliverables Fewer resources In less time With high qualityFinding ToolCost effective approachesIntegrated Framework
  3. 3. Web Automation Challenges..Challenges Solution (Theory)Multiple Browsers, Multiple Versions Native to Web Browsers Powerful Element QueryingComplex Web Elements CapabilitiesCoupling of Env. in scripts Configuration ManagementDuplicate/Unreadable/Non-Maintainable Code Domain ModellingResults - Required Statistics,Screenshot etc Good ReportingBoilerplate Code DSLTest Representation Problem BDD
  4. 4. Web Automation Solution..Solution (Theory) Solution (Practical)Native to Web BrowsersPowerful Element QueryingCapabilitiesConfiguration Management GEBDomain Modelling Geb’s Page ClassGood Reporting Geb Geb’s BrowserDSL ClassBDD Spock
  5. 5. What is Geb?Geb is a browser automation solution.It brings together the… Cross browser automation capabilities of WebDriver Elegance of jQuery content selection Expressiveness of the Groovy language Robustness of Page Object modelling
  6. 6. WebDriverSuccessor to the Selenium project.Also known as “Selenium 2”.Sponsored and driven by Google.Becoming a W3C standard. http://dvcs.w3.org/hg/webdriver/raw- file/515b648d58ff/webdriver-spec.html
  7. 7. Cross-browser Automation
  8. 8. What is cool new in WebDriver?PhantomJS Based Ghost Driver.Implementation of WebDriver Wire Protocol.Run your tests without launching a browser.
  9. 9. GhostDriver 1.0.0 Navigation Page content extraction Arbitrary JS execution Window handling Frame handling Screen-shot generation Cookies Element Search, Localization & Manipulation Mouse interaction (even though doubleClick and rightClick seems to be a bit flaky) Keyboard interaction
  10. 10. Demo…
  11. 11. WebDriver APIGeb sits on top of WebDriver.Geb never talks to the actual browser because thats what WebDriver does.
  12. 12. Gebs inspiration“Navigator API” that is inspired by jQuery. // This is Geb code, not jQuery JavaScript… $("h1").previous().children();API is not identical.
  13. 13. Dynamic JVM Lang.Groovy is… Compiled, never interpreted Dynamic, optionally typed 99% Java syntax compatible Concise & clear Great for DSLs A comfortable Java alternative for most
  14. 14. Geb & GroovyGeb uses Groovys dynamism to remove boilerplate. import geb.* Browser.drive { to GoogleHomePage at GoogleHomePage search.field.value("wikipedia") waitFor { at GoogleResultsPage } assert firstResultLink.text() == "Wikipedia" firstResultLink.click() waitFor { at WikipediaPage } }
  15. 15. Page Objects The key to not pulling your hairout when dealing with web tests.
  16. 16. What are they? In a phrase: Domain Modelling. By modelling and creating abstractions, we can isolate implementation detail. $("input[name=username]").value("user") $("input[name=pwd]").value("password") $("input[type=submit]").click() Is far more fragile than this… void login(String username, String password) { $("input[name=username]").value(username) $("input[name=pwd]").value(password) $("input[type=submit]").click() } login("user", "password")
  17. 17. Browser has-a PageBrowser.drive { to GoogleHomePage at GoogleHomePage search.field.value("wikipedia") at GoogleResultsPage assert firstResultLink.text() == "Wikipedia" firstResultLink.click() waitFor { at WikipediaPage } } The to() and click() methods are changing the underlying page. You can refer to the current pages content and methods just by name.
  18. 18. Gebs Page ObjectsGeb builds the Page Object pattern directly into the framework (though it is optional). import geb.* class GoogleHomePage extends Page { static url = "http://google.com/ncr" static at = { title == "Google" } static content = { search { module GoogleSearchModule } } }
  19. 19. Gebs Page ObjectsFeatures the “Content DSL” for naming content in a dynamic and powerful way. import geb.* class GoogleResultsPage extends Page { static at = { waitFor { title.endsWith("Google Search") } } static content = { search { module GoogleSearchModule } results { $("li.g") } result { i -> results[i] } resultLink { i -> result(i).find("a.l", 0) } firstResultLink { resultLink(0) } } }
  20. 20. ModulesModules are repeating and/or reappearing content.import geb.*class GoogleSearchModule extends Module { static content = { field { $("input", name: "q") } button(to: GoogleResultsPage) { $("input", value: buttonValue) } }
  21. 21. TestingGebs testing adapters
  22. 22. Geb for Testing Geb can be used with…  Spock  JUnit (3 & 4)  TestNG  EasyB  Cucumber (Cuke4Duke) The majority of Geb users use Spock. Geb can dump HTML and screenshots for each “test” to help in debugging.
  23. 23. Navigator APIjQuery inspired content selection/navigation
  24. 24. Attribute/Text matchCan match on attribute values:  //<div foo="bar">  $("div", foo: "bar") The “text” attribute is special:  //<div>foo</div>  $("div", text: "foo")Can use Regular Expressions:  //<div>foo</div>  $("div", text: ~/f.+/)
  25. 25. Relative Content $() returns a Navigator that allows you to find relative content. $("p").previous() $("p").prevAll() $("p").next() $("p").nextAll() $("p").parent() $("p").siblings() $("div").children() Most of these methods take selectors, indexes and attribute text/matchers too. $("p").nextAll(".listing")
  26. 26. Content DSL
  27. 27. Content DSLclass GoogleResultsPage extends Page { static content = { results { $("li.g") } result { i -> results[i] } resultLink { i -> result(i).find("a.l", 0) } firstResultLink { resultLink(0) } }}Content definitions can build upon each other.Content definitions are actually templates.
  28. 28. Optional Contentclass OptionalPage extends Page { static content = { errorMsg(required: false) { $("p.errorMsg") } } }By default, Geb will error if the content you select doesnt exist.The “required” option disables this check.
  29. 29. Dynamic Contentclass DynamicPage extends Page { static content = { errorMsg(wait: true) { $("p.errorMsg") } }} Geb will wait for some time for this content to appear. By default, it will look for it every 100ms for 5s before giving up. This is highly configurable. Same semantics as the waitFor {} method that can be used anywhere.
  30. 30. Expensive Contentclass ExpensivePage extends Page { static content = { results(cache: true) { $("li.results") } result { results[it] } }} By default, all content is transient. The cache option instructs Geb to hold on to the content, avoiding redundant lookups. Use carefully, can cause problems with dynamic pages.
  31. 31. NavigationGetting around
  32. 32. The to() methodclass GoogleHomePage extends Page { static url = "http://google.com/ncr"}Pages can define a url that defines the page location.The to() method sends the browser there and sets that as the current page object.
  33. 33. Content based navigationclass FrontPage { static content = { aboutUsLink(to: AboutUsPage) { $("div#nav ul li a", text: iStartsWith("About Us")) } }}When this content is clicked, the underlying page will be changed implicitly. to FrontPage aboutUsLink.click() page instanceof AboutUsPage
  34. 34. At CheckingThe “at checking” mechanism enables fail fast and less debugging.class LoginPage extends Page { static at = { $("h1").text() == "Please log in" } }browser.at LoginPageWill throw an exception if every statement of the at check is not true.
  35. 35. Driver ManagementGeb caches the WebDriver instance (per thread) and shares it across test cases.Manages clearing cookies and is configurable.
  36. 36. Config. ManagementLooks GebConfig.groovy file on classpath. driver = { new FirefoxDriver() } waiting { timeout = 2 slow { timeout = 100 } } reportsDir = "geb-reports“ environments { chrome { driver = "chrome" } }
  37. 37. Demo….Spock Example
  38. 38. SummaryJUnit4 Spock Grails TestNG EasyB
  39. 39. Thanks  @gaurav_bansal  gbansal@xebia.com /

×