如何在 Watir 中使用 XPath 定位和操作页面元素

上次我写过一篇 如何在 Selenium 中操作 SPAN 元素  ，提到了如何在 Selenium 中利用 XPath 的方法定位和操作页面元素。昨天抽空看了一下，Watir 目前也提供了对于 XPath 的支持，有兴趣的朋友可以了解一下。下面会列出一些参考文档和示例代码。

首先要提到的是一篇参考文档，关于 Watir 中对 XPath 的支持， 点击这里下载。其中提到了，对 XPath 的支持需要满足几点要求：
1.Watir 的版本是 1.5.x ，这个好办，从 Watir 主页上下载并安装最新的 gem 就可以了；
2.安装 REXML 3.1.3 以后的版本，我使用的是 REXML 3.1.4 ，可以 点击这里下载。

具体的安装方法，请参照 Watir 的 FAQ (http://wiki.openqa.org/display/WTR/FAQ ) 和 REXML 的 INSTALL 文档。当然，还要有些 web 开发的经验，至少要明白什么是 XPath 吧 ^_^

当你安装配置完成后，可以使用下面的页面做为一个试验。被操作的 HTML 页面的源代码如下：

<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML Transitional//EN" >
< META  http-equiv ="Content-Type"  content ="text/html; charset=utf-8" >
< HTML >
     < BODY >
         < DIV  id ="container" >
             < DIV  id ="entryPanel" >
                 < DIV  class ="levelChooser"  id ="entryPanel_levelChooser" >
                     < SPAN  class ="tab-panel" >
                         < DIV  class ="stepChooser"  id ="entryPanel_levelChooser_panel_stepChooser" >
                             < DIV  class ="tabbedStepChooser"  id ="entryPanel_levelChooser_panel_stepChooser_tabbedStepChooser" >
                                 < SPAN  class ="tab-panel" >
                                     < DIV  id ="mainContent" >
                                         < DIV  id ="mainNav"  style ="HEIGHT: 228px" >
                                             < DIV  class ="leftarea"  id ="entryPanel_levelChooser_panel_stepChooser_tabbedStepChooser_panel_proxyListPanel" >
                                                 < DIV  class ="PnWebProxyTreePanel" >
                                                     < DIV  class ="proxyTree" >
                                                         < SPAN  id ="entryPanel_levelChooser_panel_stepChooser_tabbedStepChooser_panel_proxyListPanel_proxyTree" >
                                                             < DIV  class ="wicket-tree" >
                                                                 < DIV  class ="row"  id ="entryPanel_levelChooser_panel_stepChooser_tabbedStepChooser_panel_proxyListPanel_proxyTree_3" >
                                                                     < DIV  class ="a_" >
                                                                         < A  id ="entryPanel_levelChooser_panel_stepChooser_tabbedS  tepChooser_panel_proxyListPanel_proxyTree_i_3_nodeLink"  onclick ="var wcall=wicketAjaxGet('/webclient/client/?wicket:interface=:3:entryPanel:levelChooser:panel:stepChooser:tabbedStepChooser:panel:proxyListPanel:proxyTree:i:3:nodeLink::IBehaviorListener&wicket:behaviorId=0', function() { }, function() { });return !wcall;"  href ="http://java-server/webclient/client/launchcenter/entry/Reservations#" >
                                                                             < SPAN >
                                                                                Main Road Nijmegen 
                                                                             </ SPAN ></ A >
                                                                     </ DIV >
                                                                 </ DIV >
                                                             </ DIV >
                                                         </ SPAN >
                                                     </ DIV >
                                                 </ DIV >
                                             </ DIV >
                                         </ DIV >
                                     </ DIV >
                                 </ SPAN >
                             </ DIV >
                         </ DIV >
                     </ SPAN >
                 </ DIV >
             </ DIV >
         </ DIV >
     </ BODY >
</ HTML >

用来测试的 Watir 代码如下：

require  " watir "

ie = Watir::IE.new

ie.goto( " g://span.html " )

ie.element_by_xpath( " //span[contains(text(), 'Main Road Nijmegen')] " ).click

如果测试代码可以正常工作没有报错，就说明 WATiR 对 XPath 的支持已经配置好了。

另外，根据 WATiR 官方站点中提到的，目前对 XPath 的支持不包括对 frame 的支持。