克隆行的页面元素定义

Question

我正在使用 page-object-gem 并尝试在一组 text_field 出现无限次时找到定义我的页面元素的最佳方法。

页面加载时的HTML类似如下：

<div><input id="dx_1_code" value=""/> <input id="dx_1_dos" onblur="clone($(this),false)" value=""/></div>

如果用户从最后一个输入中跳出，则会克隆一个新行，其 id 值会随着 HTML 递增，如下所示：

<div><input id="dx_2_code" value=""/> <input id="dx_2_dos" onblur="clone($(this),false)" value=""/></div>
<div><input id="dx_3_code" value=""/> <input id="dx_3_dos" onblur="clone($(this),false)" value=""/></div>

我的第一个尝试是定义我的 class 如下：

class SamplePage
  include PageObject
  include DataMagic

  text_field(:dx_1, :id => "dx_1_code")
  text_field(:dx_2, :id => "dx_2_code")
  text_field(:dos_1, :id => "dx_1_dos")
  text_field(:dos_2, :id => "dx_2_dos")

end

但是我很快就得到了很多多余的条目。

在元素设置和 populate_page_with 方法的使用方面，是否有更好的方法来处理未知数字或此类条目？

Answer 1

元素已编入索引，这使它们成为索引属性功能的理想选择。 indexed_property 允许您定义在访问元素时替换数字的定位器。页面对象看起来像：

class MyPage
  include PageObject

  indexed_property(:dx, [
    [:text_field, :code, {id: 'dx_%s_code'}],
    [:text_field, :dos, {id: 'dx_%s_dos'}],
  ])
end

前两行将使用以下方式输入：

page = MyPage.new(browser)
page.dx[1].code = 'a'
page.dx[1].dos = 'b'
page.dx[2].code = 'c'
page.dx[2].dos = 'd'

遗憾的是，populate_page_with 方法没有内置方法来处理索引属性。与任何事物一样，您可以破解某些东西。 populate_page_with 方法查找 "element" 方法以及 setter 方法。通过将您自己的添加到页面对象，可以使用该方法。

class MyPage
  include PageObject

  indexed_property(:dx, [
    [:text_field, :code, {id: 'dx_%s_code'}],
    [:text_field, :dos, {id: 'dx_%s_dos'}],
  ])

  # Method for inputting the various dx code/dos values based on a Hash
  def dx=(values)
    values.each_pair do |index, fields|
      fields.each_pair do |field, value|
        dx[index].send("#{field}=", value)
      end
    end
  end

  # This is so that populate_page_with can check that the element is enabled/visible
  def dx_element
    dx[1].code_element
  end
end

这将使您能够通过发送哈希来使用 populate_page_with，其中键是索引，值是该索引的 fields/values。我们之前做的相同的页面输入现在可以写成：

page = MyPage.new(browser)
page.populate_page_with(dx: {
  1 => {code: 'a', dos: 'b'},
  2 => {code: 'c', dos: 'd'}
})

克隆行的页面元素定义

page element definition for cloned rows

page-object-gem