兆鹏带你读watir——【第五篇】watir的js应用（技巧篇）

申明：《兆鹏带你读watir》系列文章在未经本人允许的情况下，请勿以任何形式转载、发表。联系QQ：252413619

        从第一篇到第四篇，我和大家分享了watir的整体框架，我想大家现在对watir是个什么情况已经有了大致的认识。今天我和大家分享一些更加实用的东西，即如何编写一个高质量的case，如何让自己的case满足用例要求。技巧篇的第一篇与大家分享watir的JS应用。

        在Watir Reference中，我们知道有两个函数可以执行js，分别是：

1）fire_event : 函数写在element.rb中

2）execute_script : 函数写在ie-class.rb中

        有童鞋就问了，为什么都是执行js的，但存放在不同的文件中呢，原因是fire_event是执行html元素的js事件，这些事件是已经定义好的，例如onMouseHover。而execute_script是一个全局的，执行的是用户输入的js代码，例如创建一个对象，更简单的可以测试下alert('s')这样简单的js片段。

        这两个函数的原理都是调用InternetExplorer.Application的相关函数实现的，所以对于我们读watir来说，没有必要了解具体细节，只要会用即可，而本篇主要介绍第二个函数，即execute_script的扩展功能。

实例一：watir改变当前浏览器窗口的大小

def open_size_browser(w=800,h=600)
		$browser.execute_script("window.resizeTo(#{w},#{h});")
	end

一句话搞定，代码简洁明了，默认窗口大小为800,600

实例二：获取浏览器元素在屏幕中的绝对位置

原理：首先获取浏览器在当前屏幕的绝对坐标，获取浏览器toolbar的高度，获取元素在浏览器中的相对位置。好啦，根据上面几个变量，大家应该可以计算出任意一个HTML元素在屏幕上的绝对坐标。需要这段代码的童鞋可以加我QQ联系我，不方便在BLOG中公开呀，不好意思啦！

实例三：让js搭建watir与浏览器的桥梁

大家都知道，我们可以用set\append函数去设置浏览器上面的一些值，可以点击浏览器，但我们不能让浏览器执行完一个命令后给watir发信息，这是watir的一个缺陷，在这里我和大家只分享原理，不再分享设计的代码，读者可以自行尝试。

原理：我们可以利用execute_script函数执行js，而在执行的js中，我们设置一个隐藏的HTML对象，设置该对象的ID和name。因此，我们执行完的js返回的结果都存在这个对象的innnerHtml中。我们再通过watir的方法获取该对象的innerHtml，这样，就实现了watir和浏览器之间的通信，我们可以将这个新添加的隐藏对象建立成一个永久的通道，这样就便于双方的通信。

OK，今天写到这里，大家对执行js有什么疑问可以QQ联系我！