单击PageObject中的链接时调用方法

时间:2014-08-15 13:38:06

标签: watir-webdriver page-object-gem

我正在使用Watir-Webdriver和PageObject gem来自动化测试。

我有一个像这样定义的PageObject:

class Page
  include PageObject

  div(:loading_indicator, :class => 'loading_indicator')

  div(:display_detail, :id => 'log_module_detail')

  # large number of links like this:
  link(:input1) { display_detail_element.link_element(:id => 'detailed_input1') }
  link(:input2) { display_detail_element.link_element(:id => 'detailed_input2') }
  # input3, input4, etc.. 

  def wait_on_loading_indicator
    loading_indicator_element.when_not_present # wait till loading indicator is gone
  end
end

当我按input1loading_indicator出现,我想等待它消失然后再继续。

当然我可以定义一个这样的方法:

def click_input1
  input1
  wait_on_loading_indicator
end

但是我必须为每个链接定义一个类似的方法...
理想情况下我会想要这样的事情:
link(:input1) { display_detail_element.link_element(:id => 'detailed_input1'); wait_on_loading_indicator }
但这不起作用。是否有一些简单/干净的方法来做到这一点?

1 个答案:

答案 0 :(得分:0)

一种方法是创建一个定义普通链接方法的访问器,并覆盖click方法以调用wait_on_loading_indicator方法。

页面对象为:

class MyPage
  include PageObject

  def self.detailed_input(name, identifier={:index => 0}, &block)
    link(name, identifier, &block)
    define_method(name) do
      send("#{name}_element").click      
      wait_on_loading_indicator    
    end
  end

  div(:loading_indicator, :class => 'loading_indicator')
  div(:display_detail, :id => 'log_module_detail')

  detailed_input(:input1) { display_detail_element.link_element(:id => 'detailed_input1') }
  detailed_input(:input2) { display_detail_element.link_element(:id => 'detailed_input2') }

  def wait_on_loading_indicator
    loading_indicator_element.when_not_present
  end  
end

请注意detailed_input类方法: 1.调用标准link访问器方法来设置标准链接方法。 2.重新定义单击链接的方法,也可以调用wait_on_loading_indicator方法。

需要等待指标的链接将使用自定义访问器方法而不是标准link方法。换句话说,它们被声明为:

detailed_input(:input1) { display_detail_element.link_element(:id => 'detailed_input1') }
detailed_input(:input2) { display_detail_element.link_element(:id => 'detailed_input2') }

您可以在页面中看到这项工作:

<html>
  <head>
    <title>wait test</title>
    <script type="text/javascript" charset="utf-8">
      function loading() {
        var e = document.getElementById("loading")
        e.style.display = "block";
        setTimeout(function() {
          e.parentNode.removeChild(e);
        }, 2000);
      }        
    </script>
  </head>
  <body>
    <div id="loading" class="loading_indicator" style="display:none;">loading</div>
    <div id="log_module_detail">
      <a href="#" id="detailed_input1" onclick="loading();">detailed_input1</a>
    </div>
  </body>
</html>

对页面对象运行以下代码时:

page = MyPage.new(browser)
puts page.loading_indicator_element.visible?
#=> false
page.input1
puts page.loading_indicator_element.visible?
#=> false (this would return `true` without the wait method)