Upgrade to Pro — share decks privately, control downloads, hide ads and more …

One Page to test them all - An automation framework for cross platform

C14b7086b0302922ebf347c0ef39a778?s=47 Priti
June 23, 2016

One Page to test them all - An automation framework for cross platform

This is presented at Selenium conference, Bangalore, 2016.

C14b7086b0302922ebf347c0ef39a778?s=128

Priti

June 23, 2016
Tweet

Transcript

  1. 1 ONE PAGE TO TEST THEM ALL ! A Cross

    platform mobile automation framework
 Priti Biyani | @pritibiyani
 Selenium Conference, 2016
  2. 2

  3. ABOUT ME 3

  4. 4 MOBILE ?

  5. U.S. AIRLINE MOBILE APP 5 ๏ iOS, Android, iPad, Blackberry,

    Windows and Mobile Web
 
 ๏ Apple Appstore featured app (Travel)
 

  6. 6 FUNCTIONAL TESTS ?

  7. FUNCTIONAL TESTS 7

  8. 8 Saves Time Quality gatekeeper Documentation Regression Domain

  9. AUTOMATION EXPECTATION ๏ Easy to add tests. 
 ๏ Simple

    to accommodate changes.
 ๏ Allow Reuse of the code. 
 ๏ Promote high level thinking.
 ๏ Keep it simple
 ๏ Keep it simple.
 9
  10. 10 CASE STUDY

  11. EXAMPLE - FOOD DELIVERY SYSTEM 11 Food Menu Order food

    User details (name, address) Payment option Summary Credit Card details Credit Card option Cash on delivery
  12. ๏ Platforms: ๏ Android ๏ mobile Web ๏ iOS 


    ๏ Native screens + Hybrid screens
 ๏ Different automation tools for each platforms. 12 EXAMPLE - FOOD DELIVERY SYSTEM
  13. PROBLEM STATEMENT 13 
 Create a generic automation framework which

    could support each of the 
 three UI automation tools and work seamlessly across both native and 
 hybrid UI screens
  14. 14 EXISTING APPROACHES

  15. 1. EXISTING APPROACHES - BY CALABASH Cross-platform Acceptance Testing Best

    Practices by calabash
 
 http://bit.do/github_calabash_automation_practice
 1. Different pages for ios and android 2. Each page will implement respective contract for given platform 3. Conditional loading of pages 
 

  16. 2. EXISTING APPROACHES - STRATEGY PATTERN Android and ios app

    automation - by 3pillar
 
 http://bit.do/3pillar_blog

  17. 3. EXISTING APPROACHES - SCREEN OBJECT PATTERN http://bit.do/screen_object_pattern


  18. 18 APPROACHES - ANALYSIS Feature File
 ——————— 
 Given ..


    When .. 
 Then .. Step 
 Definitions Android 
 Pages 18 iOS 
 Pages Mobile web 
 Pages
  19. ๏ ADDING NEW AUTOMATION?
 ๏ CODE REUSABILITY?
 ๏ MAKE CHANGE

    AT ONLY ONE PLACE?
 ๏ CLASS EXPLOSION 19 SOLUTION ANALYSIS OF APPROACHES
  20. 20 APPROACHES - ANALYSIS Feature File
 ——————— 
 Given ..


    When .. 
 Then .. Step 
 Definitions Android 
 Pages 20 iOS 
 Pages Mobile web 
 Pages
  21. 21 DIFFERENT PAGE FOR 
 
 EACH PLATFORM !

  22. 22 APPROACHES - ONE PAGE FOR ALL PLATFORM 22 Feature

    File
 ——————— 
 Given ..
 When .. 
 Then .. Step 
 Definitions Single 
 Page
 for each 
 Platform
  23. ๏ ADDING NEW AUTOMATION?
 ๏ CODE REUSABILITY?
 ๏ MAKE CHANGE

    AT ONLY ONE PLACE?
 ๏ CLASS EXPLOSION 23 SOLUTION ANALYSIS OF SINGLE PAGE FOR EACH PLATFORM
  24. 24 COMMON PAGE OBJECT : CONCERNS Single 
 Page
 for

    each 
 Platform Automation Tools Different UI actions touch click Locators Navigation Patterns Nav Drawer Menu Bar Tab Bar
  25. 25 SINGLE PAGE FOR ALL!


  26. ๏ Single page 
 ➡ Key fields? ➡ Key behavior

    ? 26 ONE PAGE OBJECT : OBJECT MODELING EXERCISE
  27. 27 ONE PAGE OBJECT : PAGE IDENTIFIER Page Name :

    String
 Id : Map {
 :web => "'#login_form'",
 :ios => "label marked:'LoginPageHeaderLabel'",
 :droid => "* id:'title_login'"
 } Identify each page uniquely on the device

  28. 28 ONE PAGE OBJECT : ID EXISTS CHECK 
 def

    exists?
 case platform
 when ANDROID
 query(ui_query).empty?
 when IOS
 query(ui_query).empty?
 when WEB
 Browser.element(:css => locator).present?
 end end

  29. 29 ONE PAGE OBJECT : DRIVER ABSTRACTION Driver Platform :

    droid
 exists? () 
 def exists?(id_map) # ----- # DROID SPECIFIC CODE # ----- end 
 def exists?(id_map) # ----- # iOS SPECIFIC CODE # ----- end def exists?(id_map) # ----- # web SPECIFIC CODE # ----- end
 Page Name : String
 Id : PageId PageId Field : Map
 exists? () 
 Driver Platform : ios
 exists? () 
 Driver Platform : web
 exists? () 

  30. 30 ONE PAGE OBJECT : CHECKLIST Single 
 Page
 for

    each 
 Platform Different UI actions touch click Locators Navigation Patterns Nav Drawer Menu Bar Tab Bar Automation Tools
  31. 31 ONE PAGE OBJECT : ELEMENTS Page Name : String


    Id : PageId
 Elements 
 Element.new({
 :web => ‘#save_and_continue_button’,
 :ios => "navigationButton marked:'DONE'",
 :droid => "* marked:'Done'"
 } 
 Element Id: Map
 click() def click
 case platform
 when ANDROID
 touch(query(locator))
 when IOS
 touch(query(locator))
 when WEB
 Browser.element(:css => locator).click()
 end end

  32. ONE PAGE OBJECT : ELEMENT DELEGATING ACTION TO DRIVER 32

    Page Name : String
 Id : Map Elements Element Id : Map
 Driver : Driver click() 32 def click(id_map)
 # ----- # DROID SPECIFIC CODE # ----- end
 def click(id_map)
 # ----- # iOS SPECIFIC CODE # ----- end
 def click(id_map)
 # ----- # WEB SPECIFIC CODE # ----- Driver Platform : droid
 exists? () 
 Driver Platform : ios
 exists? () 
 Driver Platform : web
 exists? () 

  33. ONE PAGE OBJECT : MORE ELEMENTS 33 33 Element id_map

    click()
 exists? () Checkbox id_map check()
 checked? () Textbox id_map set_text()
 get_text() Dropdown id_map select() Driver <platform> click()
 exists? ()

  34. 34 ONE PAGE OBJECT : ONE END TO END ACTION

    Feature File
 ——————— 
 Given ..
 When .. 
 Then .. Step 
 Definitions page page.service element.ui_interaction Driver
  35. 35 ONE PAGE OBJECT : ONE END TO END ACTION

    Feature File
 ——————— 
 Given ..
 When .. 
 Then .. Step 
 Definitions page food_cart_page.checkout element.ui_interaction Driver order_food
 .feature def _checkout
 @checkout.click
 end
  36. 36 ONE PAGE OBJECT : CHECKLIST Single 
 Page
 for

    each 
 Platform Automation Tools Different UI actions touch click Locators Navigation Patterns Nav Drawer Menu Bar Tab Bar
  37. ONE PAGE OBJECT : NAVIGATION PATTERN 37 37 Iphone Mobile

    Web Android 37
  38. ๏ Menu is a PAGE? ๏ ID ? ๏ Name

    ? ๏ Elements - Menu Items.
 38 NAVIGATION PATTERN
  39. ONE PAGE OBJECT : MENU DESIGN 39 39 Menu Name:

    <String>
 Id : <PageId>
 MenuItems : [] launch() show_secondary() show() MenuItem Name: <String>
 TargetPage : <Page>
 MenuButton: <Element> Type: <enum> click() is_secondary?()
  40. 40 ONE PAGE OBJECT : CHECKLIST Single 
 Page
 for

    each 
 Platform Automation Tools Different UI actions touch click Locators Navigation Patterns Nav Drawer Menu Bar Tab Bar
  41. 41 ONE PAGE OBJECT : TRANSITION Order food User details

    def proceed
 order_food.click
 wait_for_user_page_to_load
 return UserDetails.new
 end [ success ] 
 def <action>
 click_button
 wait_for_<next_page>_to_load
 return <NextPage.new>
 end
  42. 42 TRANSITION FROM 
 
 ONE PAGE TO 
 


    ANOTHER ?
  43. 43 ONE PAGE OBJECT : TRANSITION 1. driver.click ๏ Driver

    should be responsible only for UI interaction. ๏ Driver should not know about higher level abstraction Page.
 2. element.click ๏ It will not be applicable to all elements. 
 3. Transition Aware Element ➡ An element that understands page transitions.
  44. 44 ONE PAGE OBJECT : TRANSITION Driver Platform: droid exists?


    click()
 getText()
 checked() Driver Platform: iOS exists?
 click()
 getText()
 checked() Driver Platform: iOS exists?
 click()
 getText()
 checked() Transition element id : map click()
 
 Checkbox id : map checked()
 check() Textbox id : map setText()
 getText() Page Name: String
 Id: pageId
 Elements
 Element Id: pageId
 Driver: Driver
 exists?()
  45. 45 ONE PAGE OBJECT : TRANSITION @checkout_button = TransitionElement.new(
 {

    
 :web => '#continue_button',
 :ios => "* marked:'Order'",
 :droid => "* marked:'Order Food'"
 }
 
 
 
 
 
 
 )
 
 ,
 {
 :to => UserDetails,
 }
  46. 46 ONE PAGE OBJECT :MULTIPLE TRANSITION Credit Card option Cash

    O n delivery [success] User details Credit Card page Purchase summary Payment option
  47. 47 ONE PAGE OBJECT :MULTIPLE TRANSITION @user_details_checkout = TransitionElement.new(
 {

    
 :web => '#continue_button',
 :ios => "* marked:'Checkout'",
 :droid => "* marked:’Checkout For Payment'"
 },
 
 
 
 
 
 )
 
 Multiple Transition {
 :to => [CreditCardPage, PurchaseSummary],
 
 }

  48. 48 ONE PAGE OBJECT :MULTIPLE TRANSITION @user_details_checkout = TransitionElement.new(
 {

    
 :web => '#continue_button',
 :ios => "* marked:'Checkout'",
 :droid => "* marked:’Checkout For Payment'"
 },
 
 
 
 
 
 
 )
 
 Error {
 :to => [ CreditCardPage, PurchaseSummary ],
 :error => [ UserDialog ]
 }
 

  49. MULTIPLE TRANSITIONS - WRONG TRANSITION ‣ Scenario: If there is

    a bug in code, app transitions to wrong page from list of multiple transitions.
 
 
 
 
 
 ➡ Tests should take care for assertions of correct page, not the framework.
 

  50. 50 ONE PAGE OBJECT : TRANSITION Error def wait_till_next_page_loads(next_pages, error_page)


    
 has_error, found_next_page = false, false
 
 begin
 wait_for_element(timeout: 30) do
 found_next_page = next_pages.any? { |page| page.current_page?}
 has_error = error_page.has_error? if error_page
 found_next_page or has_error
 end
 has_error ? error_page : next_pages.find { |page| page.current_page?}
 
 rescue WaitTimeoutError
 — - - 
 end
 
 end
 

  51. IMPLEMENTATION DETAILS ๏ We "require" specific driver class during test

    execution. 
 ๏ Page registry, can be queried for page object instances.
 ๏ Rspec Unit Tests
 ๏ Rake task to create new page classes.
  52. LEARNING ๏ Object design is key. 
 ๏ Use case

    driven development
 ๏ Keep on building up on problem. Iterative solving. 

  53. LINKS 1. Github 
 
 https://github.com/CrossPlatformPageObject/cross-platform-single-page-example
 2. Link of the

    talk given at VodQA Bangalore 
 
 https://pritibiyani.github.io/blog/speaking-at-vodqa-banglore/
  54. 54 DEMO

  55. 55

  56. EXAMPLE - FOOD DELIVERY SYSTEM 56 Food Menu Order food

    User details (name, address) Payment option Summary Credit Card details Credit Card option Cash on delivery
  57. LEARNING 57 
 Today, to add automation to support new

    feature development across the three different platforms requires changes in One Place!
  58. THANKS 1. Aroj George (@arojp)
 
 2. Rajdeep Verma
 


  59. Priti Biyani @pritibiyani
 
 pritibiyani.github.io
 THANK YOU