使用页面对象模型访问嵌套的div [英] Accessing nested divs using page object model

问题描述

我无法访问嵌套的div.

I am having trouble accessing the nested divs.

这是我的情况.我需要访问内部div中的总数.有人可以在这里阐明一下吗?

here is my scenario. I need to access the total in inner div. Can some one please shed some light here.

<div id="RequestSend">
    <div class="title">
        Requests Sent
    </div>
    <div class="total">
        10
    </div>
</div>
<div id="RequestReceived">
    <div class="title">
        Requests Received
    </div>
    <div class="total">
        20
    </div>
</div>

我尝试了以下操作，但没有成功.

I tried the following, but did not succeed.

    Approach 1:

    prof.rb
    =======

    div(:total_count, {:class => 'total'})
    div(:request_send, {:id => 'RequestSend'})

    prof_spec.rb
    =============
    page.request_send_element.total_count.should eq 10

    Output:
    NoMethodError: undefined method `total_count' for #<Selenium::WebDriver::Element:0x....>


    Approach 2:

    prof.rb
    =======
    divs(:total_count, {:class => 'total'})

    prof_spec.rb
    ============
    total_count[0] # for first 
    total_count[1] # for second

Please note I am a new user to page object.

推荐答案

解决方案1-块

最直接的方法是在定义访问器时使用块.这样，您可以指定元素的路径-即，可以将搜索范围限定到特定元素.

The most straightfoward approach would be to use blocks when defining your accessors. This allows you to specify paths to an element - ie allowing you to scope the search to specific elements.

最简单的方法是将一堆div_element 1方法链接在一起:

The easiest one is to just chain a bunch of div_element1 methods together:

div(:request_send_total){
  div_element(:id => 'RequestSend').div_element(:class => 'total')
}
div(:request_received_total){
  div_element(:id => 'RequestReceived').div_element(:class => 'total')
} 

或者，如果您可能需要在RequestSend/RequestReceived div中查找不同的内容，我将专门为每个div创建一个访问器.然后，总计的访问器将调用父元素:

Alternatively, if you might need to look for different things in the RequestSend/RequestReceived divs, I would create an accessor specifically for each of those divs. Then the accessor for the total, would call the parent element:

div(:request_send, :id =>'RequestSend')
div(:request_send_total){
  request_send_element.div_element(:class => 'total')
}
div(:request_received, :id =>'RequestReceived')
div(:request_received_total){
  request_received_element.div_element(:class => 'total')
}

在两种情况下，您的页面API均为:

In both cases, your page API would be:

page.request_send_total
#=> 10
page.request_received_total
#=> 20

解决方案2-小部件

一个更复杂的实现，但是更好的页面API，将是使用小部件.基本上，这就像使用自己的特定方法创建元素类型.

A more complicated implementation, but nicer page API, would be to use widgets. Basically this is like creating an element type with its own specific methods.

您可以创建一个请求窗口小部件，例如:

You could create a request widget like:

class Request < PageObject::Elements::Div
  def total
    div_element(:class => 'total').text
  end
end
PageObject.register_widget :request, Request, :div

您的页面对象将使用已注册的request访问器:

Your page object, would then use the registered request accessor:

request('request_send', :id => 'RequestSend')
request('request_received', :id => 'RequestReceived')

最后，您将获得的总值为:

Finally, you would get the total values as:

page.request_send_element.total
#=> 10
page.request_received_element.total
#=> 20

这篇关于使用页面对象模型访问嵌套的div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！