testcentricity_web 4.1.6 → 4.1.9

data/features/support/pages/{basic_test_page.rb → basic_form_page.rb}

@@ -1,8 +1,41 @@
-# Page Object class definition for Basic HTML Test page
+# Page Object class definition for Basic HTML Form page
 
-class BasicTestPage < TestCentricity::PageObject
+class BasicFormPage < BaseTestPage
   trait(:page_url)         { '/basic_test_page.html' }
+  trait(:navigator)        { header_nav.open_form_page }
+  trait(:page_title)       { 'Basic HTML Form'}
   trait(:tab_order)        {
+    [
+      header_nav.form_link,
+      header_nav.media_link,
+      header_nav.indexed_sections_link,
+      header_nav.custom_controls_link,
+      username_field,
+      password_field,
+      max_length_field,
+      read_only_field,
+      number_field,
+      color_picker,
+      slider,
+      comments_field,
+      upload_file,
+      check_1,
+      check_2,
+      check_3,
+      radio_1,
+      [
+        radio_2,
+        radio_3
+      ],
+      multi_select,
+      drop_down_select,
+      link_1,
+      link_2,
+      cancel_button,
+      submit_button
+    ]
+  }
+  trait(:firefox_order)    {
     [
       username_field,
       password_field,
@@ -41,17 +74,44 @@ class BasicTestPage < TestCentricity::PageObject
   }
 
   def verify_page_ui
+    super
+
+    verify_page_contains(page_title)
+    image_1.wait_until_loaded(5)
+    username_field.scroll_to(:center) if username_field.obscured?
     ui = {
-      self              => { exists: true, secure: false, title: 'Basic HTML Form' },
-      header_label      => { visible: true, caption: 'Basic HTML Form Example' },
       username_label    => { visible: true, caption: 'Username:' },
-      username_field    => { visible: true, enabled: true, required: true, value: '', placeholder: 'User name' },
+      username_field    => {
+        name: 'username',
+        exists: true,
+        displayed: true,
+        obscured: false,
+        visible: true,
+        hidden: false,
+        enabled: true,
+        disabled: false,
+        required: true,
+        value: '',
+        placeholder: 'User name'
+      },
       password_label    => { visible: true, caption: 'Password:' },
-      password_field    => { visible: true, enabled: true, required: true, value: '', placeholder: 'Password' },
+      password_field    => {
+        name: 'password',
+        visible: true,
+        displayed: true,
+        obscured: false,
+        focused: false,
+        enabled: true,
+        required: true,
+        value: '',
+        placeholder: 'Password'
+      },
       max_length_label  => { visible: true, caption: 'Max Length:' },
       max_length_field  => {
         visible: true,
+        obscured: false,
         enabled: true,
+        focused: false,
         placeholder: 'up to 64 characters',
         value: '',
         maxlength: 64
@@ -87,15 +147,75 @@ class BasicTestPage < TestCentricity::PageObject
       filename_label    => { visible: true, caption: 'Filename:' },
       upload_file       => { visible: true, enabled: true, value: '' },
       checkboxes_label  => { visible: true, caption: 'Checkbox Items:' },
-      check_1           => { visible: true, enabled: true, checked: false },
-      check_2           => { visible: true, enabled: true, checked: false },
-      check_3           => { visible: true, enabled: true, checked: false },
-      check_4           => { visible: true, enabled: false, checked: false },
+      check_1           => {
+        exists: true,
+        visible: true,
+        hidden: false,
+        enabled: true,
+        disabled: false,
+        checked: false,
+        indeterminate: false
+      },
+      check_2           => {
+        exists: true,
+        visible: true,
+        hidden: false,
+        enabled: true,
+        disabled: false,
+        checked: false,
+        indeterminate: false
+      },
+      check_3           => {
+        exists: true,
+        visible: true,
+        hidden: false,
+        enabled: true,
+        disabled: false,
+        checked: false,
+        indeterminate: false
+      },
+      check_4           => {
+        exists: true,
+        visible: true,
+        hidden: false,
+        enabled: false,
+        disabled: true,
+        checked: false,
+        indeterminate: false
+      },
       radios_label      => { visible: true, caption: 'Radio Items:' },
-      radio_1           => { visible: true, enabled: true, selected: false },
-      radio_2           => { visible: true, enabled: true, selected: false },
-      radio_3           => { visible: true, enabled: true, selected: false },
-      radio_4           => { visible: true, enabled: false, selected: false },
+      radio_1           => {
+        exists: true,
+        visible: true,
+        hidden: false,
+        enabled: true,
+        disabled: false,
+        selected: false
+      },
+      radio_2           => {
+        exists: true,
+        visible: true,
+        hidden: false,
+        enabled: true,
+        disabled: false,
+        selected: false
+      },
+      radio_3           => {
+        exists: true,
+        visible: true,
+        hidden: false,
+        enabled: true,
+        disabled: false,
+        selected: false
+      },
+      radio_4           => {
+        exists: true,
+        visible: true,
+        hidden: false,
+        enabled: false,
+        disabled: true,
+        selected: false
+      },
       multiselect_label => { visible: true, caption: 'Multiple Select Values:' },
       multi_select      => {
         visible: true,
@@ -112,6 +232,29 @@ class BasicTestPage < TestCentricity::PageObject
         options: ['Drop Down Item 1', 'Drop Down Item 2', 'Drop Down Item 3', 'Drop Down Item 4', 'Drop Down Item 5', 'Drop Down Item 6'],
         selected: 'Drop Down Item 1'
       },
+      link_label        => { visible: true, caption: 'Links:' },
+      links_list        => {
+        visible: true,
+        enabled: true,
+        itemcount: 3,
+        items: ['Open Media Page in same window/tab', 'Open Media Page in a new window/tab', 'Disabled Link']
+      },
+      link_1            => {
+        visible: true,
+        href: { ends_with: 'media_page.html' },
+        caption: 'Open Media Page in same window/tab'
+      },
+      link_2            => {
+        visible: true,
+        href: { ends_with: 'media_page.html' },
+        caption: 'Open Media Page in a new window/tab'
+      },
+      link_3            => {
+        visible: true,
+        aria_disabled: true,
+        role: 'link',
+        caption: 'Disabled Link'
+      },
       table_label       => { visible: true, caption: 'Table:' },
       static_table      => {
         visible: true,
@@ -121,17 +264,22 @@ class BasicTestPage < TestCentricity::PageObject
         { row: 1 } => [['Alfreds Futterkiste', 'Maria Anders', 'Germany']],
         { row: 2 } => [['Centro comercial Moctezuma', 'Francisco Chang', 'Mexico']],
         { row: 3 } => [['Ernst Handel', 'Roland Mendel', 'Austria']],
-        { row: 4 } => [['Island Trading', 'Helen Bennett', 'UK']]
+        { row: 4 } => [['Island Trading', 'Helen Bennett', 'UK']],
+        { cell: [1, 3] } => ['Germany'],
+        { cell: [2, 3] } => ['Mexico'],
+        { column: 3 } => [['Germany', 'Mexico', 'Austria', 'UK']]
       },
       images_label      => { visible: true, caption: 'Images:' },
       image_1           => {
         visible: true,
+        loaded: true,
         broken: false,
         src: { ends_with: 'images/Wilder.jpg' },
         alt: "It's alive"
       },
       image_2           => {
         visible: true,
+        loaded: true,
         broken: false,
         src: { ends_with: 'images/You_Betcha.jpg' },
         alt: 'You Betcha'
@@ -149,29 +297,45 @@ class BasicTestPage < TestCentricity::PageObject
   end
 
   def form_data
-    file_path = Environ.platform == :mobile ? nil : "#{Dir.pwd}/test_site/images/Wilder.jpg"
+    data = form_data_source.read_form_data
+
+    if Environ.platform == :mobile
+      file_path = nil
+      file_name = ''
+      color_value = '#000000'
+    else
+      file_path = "#{Dir.pwd}/test_site/images/#{data.image_filename}"
+      file_name = data.image_filename
+      color_value = Faker::Color.hex_color
+    end
     {
-      username:     Faker::Name.name,
-      password:     'T0p_Sekrit',
+      username:     data.username,
+      password:     data.password,
       maxlength:    Faker::Marketing.buzzwords,
       number:       Faker::Number.between(from: 10, to: 1024),
-      color:        Faker::Color.hex_color,
-      slider:       45,
+      color:        color_value,
+      slider:       50,
       comments:     Faker::Hipster.paragraph,
       filepath:     file_path,
-      filename:     "Wilder.jpg",
-      check1:       true,
-      check2:       true,
-      check3:       false,
-      radio1:       true,
-      radio2:       false,
-      radio3:       false,
-      multi_select: 'Selection Item 2',
-      drop_select:  'Drop Down Item 5'
+      filename:     file_name,
+      check1:       data.check1,
+      check2:       data.check2,
+      check3:       data.check3,
+      radio_select: data.radio_select,
+      multi_select: data.multi_select,
+      drop_select:  data.drop_down_item
     }
   end
 
   def populate_form
+    # toggle checks and radios and verify
+    check_2.check
+    check_2.verify_check_state(true)
+    check_2.uncheck
+    check_2.verify_check_state(false)
+    radio_2.select
+    radio_2.unselect
+    # populate fields and controls with externally sourced data
     @data = form_data
     fields = {
       username_field   => @data[:username],
@@ -185,9 +349,9 @@ class BasicTestPage < TestCentricity::PageObject
       check_1          => @data[:check1],
       check_2          => @data[:check2],
       check_3          => @data[:check3],
-      radio_1          => @data[:radio1],
-      radio_2          => @data[:radio2],
-      radio_3          => @data[:radio3],
+      radio_1          => @data[:radio_select] == 1,
+      radio_2          => @data[:radio_select] == 2,
+      radio_3          => @data[:radio_select] == 3,
       multi_select     => @data[:multi_select],
       drop_down_select => @data[:drop_select]
     }
@@ -207,9 +371,9 @@ class BasicTestPage < TestCentricity::PageObject
       check_1          => { checked: @data[:check1] },
       check_2          => { checked: @data[:check2] },
       check_3          => { checked: @data[:check3] },
-      radio_1          => { selected: @data[:radio1] },
-      radio_2          => { selected: @data[:radio2] },
-      radio_3          => { selected: @data[:radio3] },
+      radio_1          => { selected: @data[:radio_select] == 1 },
+      radio_2          => { selected: @data[:radio_select] == 2 },
+      radio_3          => { selected: @data[:radio_select] == 3 },
       multi_select     => { selected: @data[:multi_select] },
       drop_down_select => { selected: @data[:drop_select] }
     }
@@ -228,11 +392,38 @@ class BasicTestPage < TestCentricity::PageObject
   end
 
   def verify_tab_order
-    order = if Environ.browser == :safari
+    order = case Environ.browser
+            when :safari
               safari_tab_order
+            when :firefox
+              firefox_order
             else
               tab_order
             end
     verify_focus_order(order)
   end
+
+  def choose_options_by(method)
+    case method.downcase.to_sym
+    when :index
+      multi_select.choose_option(index: 2)
+      drop_down_select.choose_option(index: 3)
+    when :value
+      multi_select.choose_option(value: 'ms2')
+      drop_down_select.choose_option(value: 'dd3')
+    when :text
+      multi_select.choose_option(text: 'Selection Item 2')
+      drop_down_select.choose_option(text: 'Drop Down Item 3')
+    else
+      raise "#{method} is not a valid selector"
+    end
+  end
+
+  def verify_chosen_options
+    ui = {
+      multi_select     => { selected: 'Selection Item 2' },
+      drop_down_select => { selected: 'Drop Down Item 3' }
+    }
+    verify_ui_states(ui)
+  end
 end

data/features/support/pages/{basic_xpath_test_page.rb → basic_xpath_form_page.rb}

@@ -1,7 +1,7 @@
-# Page Object class definition for Basic HTML Test page with Xpath locators
+# Page Object class definition for Basic HTML Form page with Xpath locators
 
-class BasicXpathTestPage < BasicTestPage
-  trait(:page_name)    { 'Basic Xpath Test' }
+class BasicXpathFormPage < BasicFormPage
+  trait(:page_name)    { 'Basic Xpath Form' }
   trait(:page_locator) { "//form[@id='HTMLFormElements']" }
 
   # Basic HTML Test page UI elements
@@ -12,8 +12,8 @@ class BasicXpathTestPage < BasicTestPage
               number_field:      "//input[@id='number-field']",
               comments_field:    "//textarea[@id='comments']",
               color_picker:      "//input[@id='color-picker']"
-  range       :slider,           "//input[@id='slider']"
-  filefield   :upload_file,      "//input[@id='filename']"
+  ranges      slider:            "//input[@id='slider']"
+  filefields  upload_file:       "//input[@id='filename']"
   checkboxes  check_1:           "//input[@id='check1']",
               check_2:           "//input[@id='check2']",
               check_3:           "//input[@id='check3']",
@@ -24,13 +24,17 @@ class BasicXpathTestPage < BasicTestPage
               radio_4:           "//input[@id='radio4']"
   selectlists multi_select:      "//select[@id='multipleselect']",
               drop_down_select:  "//select[@id='dropdown']"
-  table       :static_table,     "//table[@id='table']"
+  lists       links_list:        "//ul[@id='links_list']"
+  links       link_1:            "//a[@id='link1']",
+              link_2:            "//a[@id='link2']",
+              link_3:            "//a[@id='link3']"
+  tables      static_table:      "//table[@id='table']"
   images      image_1:           "//img[@id='image1']",
               image_2:           "//img[@id='image2']",
               image_3:           "//img[@id='image3']"
   buttons     cancel_button:     "//input[@id='cancel']",
               submit_button:     "//input[@id='submit']"
-  labels      header_label:      '//h1',
+  labels      header_label:      '//h2',
               username_label:    "//label[@for='username']",
               password_label:    "//label[@for='password']",
               max_length_label:  "//label[@for='maxlength']",
@@ -44,6 +48,7 @@ class BasicXpathTestPage < BasicTestPage
               radios_label:      "//label[@id='radios']",
               multiselect_label: "//label[@for='multipleselect']",
               dropdown_label:    "//label[@for='dropdown']",
+              link_label:        "//label[@id='links']",
               table_label:       "//label[@for='table']",
               images_label:      "//label[@id='images']"
 end

data/features/support/pages/custom_controls_page.rb

@@ -0,0 +1,263 @@
+# Page Object class definition for Custom Controls page with CSS locators
+
+class CustomControlsPage < BaseTestPage
+  trait(:page_name)    { 'Custom Controls' }
+  trait(:page_locator) { 'div.custom-controls-page-body' }
+  trait(:page_url)     { '/custom_controls_page.html' }
+  trait(:navigator)    { header_nav.open_custom_controls_page }
+  trait(:page_title)   { 'Custom Controls Page'}
+  trait(:divisions)    {
+    ['NFC EAST',
+     'NFC NORTH',
+     'NFC SOUTH',
+     'NFC WEST',
+     'AFC EAST',
+     'AFC NORTH',
+     'AFC SOUTH',
+     'AFC WEST']
+  }
+  trait(:teams)        {
+    ['Dallas Cowboys',
+     'New York Giants',
+     'Philadelphia Eagles',
+     'Washington Redskins',
+     'Chicago Bears',
+     'Detroit Lions',
+     'Green Bay Packers',
+     'Minnesota Vikings',
+     'Atlanta Falcons',
+     'Carolina Panthers',
+     'New Orleans Saints',
+     'Tampa Bay Buccaneers',
+     'Arizona Cardinals',
+     'St. Louis Rams',
+     'San Francisco 49ers',
+     'Seattle Seahawks',
+     'Buffalo Bills',
+     'Miami Dolphins',
+     'New England Patriots',
+     'New York Jets',
+     'Baltimore Ravens',
+     'Cincinnati Bengals',
+     'Cleveland Browns',
+     'Pittsburgh Steelers',
+     'Houston Texans',
+     'Indianapolis Colts',
+     'Jacksonville Jaguars',
+     'Tennessee Titans',
+     'Denver Broncos',
+     'Kansas City Chiefs',
+     'Oakland Raiders',
+     'San Diego Chargers']
+  }
+  trait(:countries)    { ['United Kingdom', 'Tonga', 'Sweden', 'Peru', 'Belize', 'Mali', 'Ireland'] }
+
+  # Custom Controls page UI elements
+  selectlists country_select: 'div#country_chosen',
+              team_select:    'div#team_chosen'
+  checkboxes  pork_check:     "label[for='check1']",
+              beef_check:     "label[for='check2']",
+              chicken_check:  "label[for='check3']",
+              shrimp_check:   "label[for='check4']"
+  radios      mild_radio:     "label[for='radio1']",
+              spicey_radio:   "label[for='radio2']",
+              hot_radio:      "label[for='radio3']",
+              flaming_radio:  "label[for='radio4']"
+  tables      custom_table:   'div#resp-table'
+
+  attr_accessor :selected_country
+  attr_accessor :selected_team
+  attr_accessor :selected_checks
+  attr_accessor :selected_radio
+
+  def initialize
+    super
+    # define the custom list element components for the Country and Team Chosen selectlists
+    list_spec = {
+      selected_item: "li[class*='result-selected']",
+      list_item:     "li[class*='active-result']",
+      text_field:    'input.chosen-search-input',
+      options_list:  'ul.chosen-results',
+      group_item:    'li.group-result',
+      group_heading: 'li.group-result'
+    }
+    country_select.define_list_elements(list_spec)
+    team_select.define_list_elements(list_spec)
+    # define the custom element components for the checkboxes
+    check_spec = { input: "input[type='checkbox']" }
+    pork_check.define_custom_elements(check_spec)
+    beef_check.define_custom_elements(check_spec)
+    chicken_check.define_custom_elements(check_spec)
+    shrimp_check.define_custom_elements(check_spec)
+    # define the custom element components for the radios
+    radio_spec = { input: "input[type='radio']" }
+    mild_radio.define_custom_elements(radio_spec)
+    spicey_radio.define_custom_elements(radio_spec)
+    hot_radio.define_custom_elements(radio_spec)
+    flaming_radio.define_custom_elements(radio_spec)
+    # define the custom element components for the table
+    table_spec = {
+      table_body:    'div#resp-table-body',
+      table_row:     'div.resp-table-row',
+      table_column:  'div.table-body-cell',
+      table_header:  'div#resp-table-header',
+      header_column: 'div.table-header-cell'
+    }
+    custom_table.define_table_elements(table_spec)
+  end
+
+  def verify_page_ui
+    super
+
+    ui = {
+      country_select => {
+        exists: true,
+        visible: true,
+        enabled: true,
+        optioncount: 251
+      },
+      team_select => {
+        exists: true,
+        visible: true,
+        enabled: true,
+        optioncount: 32,
+        options: teams,
+        groupcount: 8,
+        group_headings: divisions
+      },
+      pork_check => {
+        exists: true,
+        visible: true,
+        enabled: true,
+        checked: true,
+        caption: 'Pork'
+      },
+      beef_check => {
+        exists: true,
+        visible: true,
+        enabled: true,
+        checked: false,
+        caption: 'Beef'
+      },
+      chicken_check => {
+        exists: true,
+        visible: true,
+        enabled: true,
+        checked: false,
+        caption: 'Chicken'
+      },
+      shrimp_check => {
+        exists: true,
+        visible: true,
+        enabled: true,
+        checked: false,
+        caption: 'Shrimp'
+      },
+      mild_radio => {
+        exists: true,
+        visible: true,
+        enabled: true,
+        selected: true,
+        caption: 'Mild'
+      },
+      spicey_radio => {
+        exists: true,
+        visible: true,
+        enabled: true,
+        selected: false,
+        caption: 'Spicey'
+      },
+      hot_radio => {
+        exists: true,
+        visible: true,
+        enabled: true,
+        selected: false,
+        caption: 'Hot'
+      },
+      flaming_radio => {
+        exists: true,
+        visible: true,
+        enabled: true,
+        selected: false,
+        caption: 'Flaming'
+      },
+      custom_table => {
+        visible: true,
+        columncount: 4,
+        rowcount: 3,
+        { row: 1 } => [['Cell 1–1', 'Cell 1–2', 'Cell 1–3', 'Cell 1–4']],
+        { row: 2 } => [['Cell 2–1', 'Cell 2–2', 'Cell 2–3', 'Cell 2–4']],
+        { row: 3 } => [['Cell 3–1', 'Cell 3–2', 'Cell 3–3', 'Cell 3–4']],
+        { cell: [1, 3] } => ['Cell 1–3'],
+        { cell: [2, 4] } => ['Cell 2–4'],
+        { column: 3 } => [['Cell 1–3', 'Cell 2–3', 'Cell 3–3']]
+      }
+    }
+    verify_ui_states(ui)
+    team_select.verify_options(teams)
+  end
+
+  def populate_form
+    @selected_country = countries.sample
+    @selected_team = teams.sample
+    @selected_checks = [:chicken, :shrimp]
+    @selected_radio = 3
+    fields = {
+      country_select => @selected_country,
+      team_select    => @selected_team,
+      pork_check     => @selected_checks.include?(:pork),
+      beef_check     => @selected_checks.include?(:beef),
+      chicken_check  => @selected_checks.include?(:chicken),
+      shrimp_check   => @selected_checks.include?(:shrimp),
+      mild_radio     => @selected_radio == 1,
+      spicey_radio   => @selected_radio == 2,
+      hot_radio      => @selected_radio == 3,
+      flaming_radio  => @selected_radio == 4
+    }
+    populate_data_fields(fields)
+  end
+
+  def set_select_options
+    @selected_country = countries.sample
+    @selected_team = teams.sample
+    country_select.set(@selected_country)
+    team_select.set(@selected_team)
+  end
+
+  def verify_form_data
+    ui = {
+      country_select => { selected: @selected_country },
+      team_select    => { selected: @selected_team },
+      pork_check     => { checked: @selected_checks.include?(:pork) },
+      beef_check     => { checked: @selected_checks.include?(:beef) },
+      chicken_check  => { checked: @selected_checks.include?(:chicken) },
+      shrimp_check   => { checked: @selected_checks.include?(:shrimp) },
+      mild_radio     => { selected: @selected_radio == 1 },
+      spicey_radio   => { selected: @selected_radio == 2 },
+      hot_radio      => { selected: @selected_radio == 3 },
+      flaming_radio  => { selected: @selected_radio == 4 }
+    }
+    verify_ui_states(ui)
+  end
+
+  def choose_options_by(method)
+    case method.downcase.to_sym
+    when :index
+      country_select.choose_option(index: 56)
+      team_select.choose_option(index: 20)
+    when :text
+      country_select.choose_option('Costa Rica')
+      team_select.choose_option('Seattle Seahawks')
+    else
+      raise "#{method} is not a valid selector"
+    end
+  end
+
+  def verify_chosen_options
+    ui = {
+      country_select => { selected: 'Costa Rica' },
+      team_select    => { selected: 'Seattle Seahawks' }
+    }
+    verify_ui_states(ui)
+  end
+end