无法单击复选框。使用页面对象宝石

Question

我无法使用 page-object-gem 单击复选框。 html代码如下所示：

<label class='cc pointer value-apple'>
 <input class='hidden' type='checkbox' value='apple'></input>
 <div style="background-image:url(/images/fruit-apple-3453452346.jpg)"><div>
</label>
<label class='cc pointer value-banana'>
 <input class='hidden' type='checkbox' value='banana'></input>
 <div style="background-image:url(/images/fruit-banana-2359235674.jpg)"><div>
</label>

使用 watir-webdriver 我没有问题单击标签或 div，因为复选框已隐藏。那些工作正常。但是，这似乎不适用于使用 page-object-gem。我尝试了以下方法：

label(:select_fruit_apple, :class => /apple/)
on(FruitsPage).select_fruit_apple

div(:select_fruit_apple, :style => /apple/)
on(FruitsPage).select_fruit_apple

非常感谢任何有关如何执行此操作的建议。

Answer 1

由于 Watir-Webdriver 要求您单击标签或 div，因此您必须对页面对象执行相同操作。

label 和 div 访问器方法不会创建单击元素的方法。对于您尝试的代码，当您调用 select_fruit_apple 时，它只是返回标签或 div 元素的文本。

要点击标签（或 div），您需要：

1. 获取标签/div 元素。这可以通过定义使用NestedElement 的方法或创建标签/div 访问器并使用_element 方法来完成。
2. 为元素调用click 方法。这将调用 Watir-Webdriver 的 click 方法。

如果您直接使用 NestedElement，则该类的外观如下：

class MyPage
  include PageObject

  def select_fruit_apple()
    label_element(:class => 'value-apple').click  
  end
end

或者，如果您需要多个标签/div 元素，您可能需要为它们创建一个访问器：

class MyPage
  include PageObject

  label(:apple, :class => 'value-apple')
  def select_fruit_apple()
    apple_element.click
  end
end

然后你可以调用这个方法来设置复选框：

on(FruitsPage).select_fruit_apple    

当然，如果你不想为每个水果定义一个方法，你可以使用一个带参数的方法：

class MyPage
  include PageObject

  def select_fruit(fruit)
    label_element(:class => 'value-' + fruit).click  
  end
end

那么方法调用将是：

on(FruitsPage).select_fruit('apple')