ACCEPTANCE testing of web uiusing webdriver, thucydides and groovy                                            story       ...
team &                  tech lead @                   partner @vladimir tsukur                  10+ years dev experience
BASED ON REAL PRODUCT DEV
App #1. Media logger
APP #2. JOURNALIST
COMMON UI
TEAMSmedia logger                      journalist               COre / COMMON UI  editor                          producer
CUSTOMERS               OF CORE UImedia logger                      journalist               COre / COMMON UI  editor     ...
APPS RELEASE                         6 months            FEATUREs            4.5 months1   2   3    4     5       6       ...
WHAT’s IMPORTANT FOR CORE?        DELIVER FREQUENTLY        DELIVER STABLE COMPONENTS
CORE DELIVERYEVERY TWo WEEKS1   2   3    4   5   6   7   8   9   10   11   12
COMPLEXITIES   REQUIREMENTS NOT ALWAYS DETAILED *   NOT ENOUGH FOCUS ON AUTOMATION   FROM THE BEGINNING OF THE PROJECT   T...
AS A                   RESULT ... LONG MANUAL                         WRONG STUFFTESTING CYCLES                       DELI...
WE CAN DO BETTER!TEAM
CHANGEAUTOMATEDACCEPTANCE  TESTING
STEP 1: discuss     user story             QAPO            DEV                       Acceptance criteria
STEPS 2 & 3: distill and develop             QA                           automated                        Acceptance test...
STEP 4: demo   automatedAcceptance tests                        PO                                  DONE!                 ...
important:   developers helpqa with technical stuff
important:customer plays the game    customer   dev team
ENFORCED BY dod         STORY NOT RESOLVED     IF automated acceptance         testing is not DONE
INITIALLy SLOWED DOWN                             but then                   accelerated again!iteration #n               ...
benefits                                    * early                                 requirementsless bugs                 ...
not used in prototyping
technical stuff
toolingtestng
WHY                 ? «... Selenium is a suite of tools to automate web browsers across many platforms ...»
WHY              ?      «... tool that let’s you use      WebDriver-based tests to      write more flexible and more      ...
WHY testng ?WHY not         ?  * more flexible listener  ecosystem *  * project-specific testng  extensions already  avail...
why groovy?dynamic, compact syntaxjvm-compatiblepowerful processing primitivesno-brainer for javists
groovy vs java                getSelectedRowColumns()[«RE: defect ...», «Andrii Shapovalov», «Wed Oct 13:59:04 ...»]
getSelectedRowColumns()   java
getSelectedRowColumns()   groovy
getSelectedRowColumns()
getSelectedRowColumns()   groovy  dynamic types  easy collection processing  closures  use variables in string literals  i...
layered architecturetests        steps                page objects        1.        2.        3.                          ...
example              USER story    As an asset list user    I want to rename asset    so that the name of the asset    cor...
acceptance criteria        * i can do in-place editing of the        single asset        * I can enter edit mode using    ...
acceptance tests
do first things first!
our first test   Asset list view should enter edit   mode when user presses   and should accept changes when   user presse...
our first test
test steps             injected             automatically
test steps
test steps
test steps
test steps
test steps
test steps
test steps
test steps
test stepsstate is recorded when step is called
asset navigation steps        page object
asset navigation steps                * high-level and                readable api                free from               ...
asset navigation steps        page object   * high-level and                      readable api                      free f...
asset navigation steps                * high-level and                readable api                free from               ...
asset renaming steps
asset renaming steps
story / feature mapping
test report
test report
what we likestepsmapping to features and storiesreporting with screenshotsutilities for webdriver
what welack of testng supportno dynamic page fragmentsdirect safari support
page objects
componentize your UI domain model
composite viewsTABS                     asset                          list                         viewTAB
keep page object api high-level
minimum-to-no use of   webdriver api in   page object api          minimal exposure of      1   internals          api is ...
fluency
locating page objects    how to find required componentamong multiple instances (e.g. «projects»)?
@Findby with defaultsearch context does notfit because it has whole-page contextuse loadablecomponent or «customloadable c...
locating page objects+    create page object with    domain-specific arguments+   use builder.init to wire-up elements
locating page objects                         @findby is in                         the context of                        ...
graphene page fragments                in scope of @root
‘tools’ project    QA                                 QAMedia logger                       JOURNALIST    QA               ...
Delivery:                   +                            page objectweb component                            steps object
javascript object proxies
ideally tests are not aware ofimplementation details,e.g. JS APIs present on the page... but use of these APIs maysignific...
how to use js in groovy / java?
webdriver’s execute script  return / pass dom elements only,other objects are serialized to string
how to easily map jsobjects to java runtime?how to simplify java-to-javascript interopwithout explicit calls to#executescr...
let’s invent         js object       proxy factoryTEAM
simple proxy
simple proxy
proxy from external source            $root/javascriptobject.js                 search by convention
elements in proxies
multiparams and fields
chaining
mapping to extjs objects
extjs grid interop
extjs grid interop   associated with grid component
js proxies in page objectspage objects may be bound to JS      proxy by interface js proxy serves as javascript        log...
js proxies in page objects bound automatically by method return type   1:1 mapping between                           page ...
js proxies      good partmap by interface, abstract classor through fully dynamic proxylink external js sourcesupports fie...
very powerful if you know how to use it
js proxies       beware!performance impactdo not overusehide behind page objects tokeep reusability
special credit to                                       http://www.vladstudio.comTHANKS.                  FOR YOUR ATTENTI...
referenceshttp://www.extremeprogramming.org/rules/functionaltests.html                        http://seleniumhq.org/      ...
references  http://arquillian.org/blog/tags/graphene/  http://testng.org/doc/index.html  http://groovy.codehaus.org/
Acceptance Testing of Web UI
Acceptance Testing of Web UI
Upcoming SlideShare
Loading in...5
×

Acceptance Testing of Web UI

3,392

Published on

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
3,392
On Slideshare
0
From Embeds
0
Number of Embeds
8
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Transcript of "Acceptance Testing of Web UI"

  1. 1. ACCEPTANCE testing of web uiusing webdriver, thucydides and groovy story volodymyr tsukur // follow me : twitter.com/flushdia or email to flushdia@gmail.com
  2. 2. team & tech lead @ partner @vladimir tsukur 10+ years dev experience
  3. 3. BASED ON REAL PRODUCT DEV
  4. 4. App #1. Media logger
  5. 5. APP #2. JOURNALIST
  6. 6. COMMON UI
  7. 7. TEAMSmedia logger journalist COre / COMMON UI editor producer
  8. 8. CUSTOMERS OF CORE UImedia logger journalist COre / COMMON UI editor producer
  9. 9. APPS RELEASE 6 months FEATUREs 4.5 months1 2 3 4 5 6 7 8 9 10 11 12 1.5 months REGRESSION
  10. 10. WHAT’s IMPORTANT FOR CORE? DELIVER FREQUENTLY DELIVER STABLE COMPONENTS
  11. 11. CORE DELIVERYEVERY TWo WEEKS1 2 3 4 5 6 7 8 9 10 11 12
  12. 12. COMPLEXITIES REQUIREMENTS NOT ALWAYS DETAILED * NOT ENOUGH FOCUS ON AUTOMATION FROM THE BEGINNING OF THE PROJECT TESTERS NOT fluent in automation, NEED ASSISTANCE
  13. 13. AS A RESULT ... LONG MANUAL WRONG STUFFTESTING CYCLES DELIVERED * MISSED BUGS APPS TEAMS SLOWED DOWN
  14. 14. WE CAN DO BETTER!TEAM
  15. 15. CHANGEAUTOMATEDACCEPTANCE TESTING
  16. 16. STEP 1: discuss user story QAPO DEV Acceptance criteria
  17. 17. STEPS 2 & 3: distill and develop QA automated Acceptance tests DEVAcceptance FEATURE criteria IMPLEMENTATION (driven by unit and integration tests)
  18. 18. STEP 4: demo automatedAcceptance tests PO DONE! approval FEATUREIMPLEMENTATION
  19. 19. important: developers helpqa with technical stuff
  20. 20. important:customer plays the game customer dev team
  21. 21. ENFORCED BY dod STORY NOT RESOLVED IF automated acceptance testing is not DONE
  22. 22. INITIALLy SLOWED DOWN but then accelerated again!iteration #n iteration #n+1 ... iteration #n+M ...
  23. 23. benefits * early requirementsless bugs clarification and common understanding more APPS TEAMS automation not delayed
  24. 24. not used in prototyping
  25. 25. technical stuff
  26. 26. toolingtestng
  27. 27. WHY ? «... Selenium is a suite of tools to automate web browsers across many platforms ...»
  28. 28. WHY ? «... tool that let’s you use WebDriver-based tests to write more flexible and more reusable WebDriver-based tests, and also to generate documentation about your acceptance tests ...»
  29. 29. WHY testng ?WHY not ? * more flexible listener ecosystem * * project-specific testng extensions already available
  30. 30. why groovy?dynamic, compact syntaxjvm-compatiblepowerful processing primitivesno-brainer for javists
  31. 31. groovy vs java getSelectedRowColumns()[«RE: defect ...», «Andrii Shapovalov», «Wed Oct 13:59:04 ...»]
  32. 32. getSelectedRowColumns() java
  33. 33. getSelectedRowColumns() groovy
  34. 34. getSelectedRowColumns()
  35. 35. getSelectedRowColumns() groovy dynamic types easy collection processing closures use variables in string literals implicit return statement ‘public’ visibility is the default
  36. 36. layered architecturetests steps page objects 1. 2. 3. webdriver ...
  37. 37. example USER story As an asset list user I want to rename asset so that the name of the asset corresponds to its content
  38. 38. acceptance criteria * i can do in-place editing of the single asset * I can enter edit mode using keyboard shortcuts * i can submit new name and see the change right away * i can abort RENAMING while in edit mode and see that the name stays intact
  39. 39. acceptance tests
  40. 40. do first things first!
  41. 41. our first test Asset list view should enter edit mode when user presses and should accept changes when user presses while in edit mode
  42. 42. our first test
  43. 43. test steps injected automatically
  44. 44. test steps
  45. 45. test steps
  46. 46. test steps
  47. 47. test steps
  48. 48. test steps
  49. 49. test steps
  50. 50. test steps
  51. 51. test steps
  52. 52. test stepsstate is recorded when step is called
  53. 53. asset navigation steps page object
  54. 54. asset navigation steps * high-level and readable api free from webdriver specifics
  55. 55. asset navigation steps page object * high-level and readable api free from webdriver specifics * interact with page object(s)
  56. 56. asset navigation steps * high-level and readable api free from webdriver specifics * interact with page object(s) * reused between tests
  57. 57. asset renaming steps
  58. 58. asset renaming steps
  59. 59. story / feature mapping
  60. 60. test report
  61. 61. test report
  62. 62. what we likestepsmapping to features and storiesreporting with screenshotsutilities for webdriver
  63. 63. what welack of testng supportno dynamic page fragmentsdirect safari support
  64. 64. page objects
  65. 65. componentize your UI domain model
  66. 66. composite viewsTABS asset list viewTAB
  67. 67. keep page object api high-level
  68. 68. minimum-to-no use of webdriver api in page object api minimal exposure of 1 internals api is strictly domain 2 focused
  69. 69. fluency
  70. 70. locating page objects how to find required componentamong multiple instances (e.g. «projects»)?
  71. 71. @Findby with defaultsearch context does notfit because it has whole-page contextuse loadablecomponent or «customloadable component»
  72. 72. locating page objects+ create page object with domain-specific arguments+ use builder.init to wire-up elements
  73. 73. locating page objects @findby is in the context of root elementbuilder locatesroot elementand optionallysets it to a field
  74. 74. graphene page fragments in scope of @root
  75. 75. ‘tools’ project QA QAMedia logger JOURNALIST QA QA page objects + steps + editor framework producer
  76. 76. Delivery: + page objectweb component steps object
  77. 77. javascript object proxies
  78. 78. ideally tests are not aware ofimplementation details,e.g. JS APIs present on the page... but use of these APIs maysignificantly simplifydevelopment of ui tests
  79. 79. how to use js in groovy / java?
  80. 80. webdriver’s execute script return / pass dom elements only,other objects are serialized to string
  81. 81. how to easily map jsobjects to java runtime?how to simplify java-to-javascript interopwithout explicit calls to#executescript?
  82. 82. let’s invent js object proxy factoryTEAM
  83. 83. simple proxy
  84. 84. simple proxy
  85. 85. proxy from external source $root/javascriptobject.js search by convention
  86. 86. elements in proxies
  87. 87. multiparams and fields
  88. 88. chaining
  89. 89. mapping to extjs objects
  90. 90. extjs grid interop
  91. 91. extjs grid interop associated with grid component
  92. 92. js proxies in page objectspage objects may be bound to JS proxy by interface js proxy serves as javascript logic adapter
  93. 93. js proxies in page objects bound automatically by method return type 1:1 mapping between page object and js proxy
  94. 94. js proxies good partmap by interface, abstract classor through fully dynamic proxylink external js sourcesupports field access and callchaining
  95. 95. very powerful if you know how to use it
  96. 96. js proxies beware!performance impactdo not overusehide behind page objects tokeep reusability
  97. 97. special credit to http://www.vladstudio.comTHANKS. FOR YOUR ATTENTION FLUSHDIA@gmail.com https://twitter.com/flushdia
  98. 98. referenceshttp://www.extremeprogramming.org/rules/functionaltests.html http://seleniumhq.org/ http://code.google.com/p/selenium/ http://thucydides-webtests.com/ http://thucydides.wakaleo.com/ http://www.thucydides.info
  99. 99. references http://arquillian.org/blog/tags/graphene/ http://testng.org/doc/index.html http://groovy.codehaus.org/

×