selenium 学习-js执行,事件模拟,页面加载等待

selenium  使用的时候要注意

1,浏览器的版本

2,和对应 jar 包

3,浏览器的环境变量设置

System.setProperties("key","value")

如下(创建浏览器对象):

System.getProperties().setProperty("phantomjs.binary.path", “"phantomjs-2.1.1-windows/bin/phantomjs.exe"”);

WebDriver webDriver = new PhantomJSDriver();

  • 如何等待页面元素加载完成 

问题:在加载页面的时候我们要知道页面是否加载完成,才能够执行操作。需要我们去判断是否加载完成。再执行获取对象,填值,或者鼠标点击的操作。在selenenium有两种解决方法。

在selenium-webdriver中我们用两种方式进行等待:显性的等待和隐性的等待。

显性的等待

显式等待 使用ExpectedConditions类中自带方法, 可以进行显试等待的判断。

显式等待可以自定义等待的条件,用于更加复杂的页面等待条件


等待的条件


WebDriver方法


页面元素是否在页面上可用和可被单击


elementToBeClickable(By locator)


页面元素处于被选中状态


elementToBeSelected(WebElement element)


页面元素在页面中存在


presenceOfElementLocated(By locator)


在页面元素中是否包含特定的文本


textToBePresentInElement(By locator)


页面元素值


textToBePresentInElementValue(By locator, java.lang.String text)


标题 (title)


titleContains(java.lang.String title)

只有满足显式等待的条件满足,测试代码才会继续向后执行后续的测试逻辑如果超过设定的最大显式等待时间阈值, 这测试程序会抛出异常。

明确的等待是指在代码进行下一步操作之前等待某一个条件的发生。最不好的情况是使用Thread.sleep()去设置一段确认的时间去等待。但为什么说最不好呢?因为一个元素的加载时间有长有短,你在设置sleep的时间之前要自己把握长短,太短容易超时,太长浪费时间。selenium webdriver提供了一些方法帮助我们等待正好需要等待的时间。利用WebDriverWait类和ExpectedCondition接口就能实现这一点。

public static void main(String[] args) {

// TODO Auto-generated method stub

System.setProperty("webdriver.firefox.bin","D:\\Program Files\\Mozilla Firefox\\firefox.exe");

WebDriver dr = new FirefoxDriver();

String url = "file:///C:/Documents and Settings/gongjf/桌面/selenium_test/Wait.html";// "/Your/Path/to/Wait.html"

dr.get(url);

WebDriverWait wait = new WebDriverWait(dr,10);

wait.until(new ExpectedCondition<WebElement>(){

@Override

public WebElement apply(WebDriver d) {

return d.findElement(By.id("b"));

}}).click();

WebElement element = dr.findElement(By.cssSelector(".red_box"));

((JavascriptExecutor)dr).executeScript("arguments[0].style.border = \"5px solid yellow\"",element);

}

隐性等待

隐性等待是指当要查找元素,而这个元素没有马上出现时,告诉WebDriver查询Dom一定时间。默认值是0,但是设置之后,这个时间将在WebDriver对象实例整个生命周期都起作用。

public static void main(String[] args) {

// TODO Auto-generated method stub

System.setProperty("webdriver.firefox.bin","D:\\Program Files\\Mozilla Firefox\\firefox.exe");

WebDriver dr = new FirefoxDriver();

//设置10秒

dr.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);

String url = "file:///C:/Documents and Settings/gongjf/桌面/selenium_test/Wait.html";// "/Your/Path/to/Wait.html"

dr.get(url);

dr.findElement(By.id("b")).click();

WebElement element = dr.findElement(By.cssSelector(".red_box"));

((JavascriptExecutor)dr).executeScript("arguments[0].style.border = \"5px solid yellow\"",element);

}

  • 模拟执行 javascript :

背景:有时候会出现操作动作不好模拟,我们知道其中的JS方法就可以使用它进行执行。更加简洁。

简单例子如下:

System.setProperty("webdriver.firefox.bin","D:\\Program Files\\Mozilla Firefox\\firefox.exe");

WebDriver
driver= new FirefoxDriver();

WebElement ele = driver.findElement(By.id("id"));

((JavascriptExecutor) driver).executeScript("arguments[0].onclick=function(){alert(‘js has been execute!‘);}",

ele); // add js on the web element

  • FRAME 和 WINDOW 之间的切换

//页面中含有多个iframe的时间就可以使用它进行切换进入到不同的iframe.

drvier.switchTo().frame("frame对象");

//获取窗口对象的标记

Set<String> windowHandles = driver.getWindowHandles();

//传指定的windownHandle字符串可以实现不同窗口的切换。

driver.switchTo().window("windowHandle");

  • By.xpath 的多种写法

1.     Xpath往往以“//”开头,属性都是采用@表示,例如//div[@id=‘_navigation‘]/div

2.     Firefox有个插件叫做xpather,在页面上点击右键选中“show in xpather”,可以很快的给出对应的xpath。它给出的格式是这样的:/html/body/header/nav/ul[1]/li[5]/a/span

3.     根据是否使用属性,Xpath的语法格式有两种:

不使用属性:按照html的层次,如/html/body/header/nav/ul[1]/li[5]/a/span

使用属性:如//input[@class=’input’],直接定位。

Selenium还支持多个属性来定位,如//input[@class=’input’
and @type=’text’]。

4.     /div[2]表示第二个,/div[last()]表示最后一个,但是没有/div[first()]的语法,选择第一个用/div[1]

5.     选择一个以上的元素,使用|,如//div|//a,表示选择所有的div标签和a标签

6.     选择未知元素,使用“*”来选择满足条件的所有元素,如/*

7.     //input[@class=’input’]选择元素中的属性

//input[@class]选择有属性名为class的input标签

//input[@]选择有属性的input标签

  • Selenium 中鼠标和键盘事件分析及扩展

参考:

http://www.ibm.com/developerworks/cn/java/j-lo-keyboard/

概念

在使用 Selenium WebDriver 做自动化测试的时候,会经常模拟鼠标和键盘的一些行为。比如使用鼠标单击、双击、右击、拖拽等动作;或者键盘输入、快捷键使用、组合键使用等模拟键盘的操作。在 WebDeriver 中,有一个专门的类来负责实现这些测试场景,那就是 Actions 类,在使用该类的过程中会配合使用到 Keys 枚举以及 Mouse、 Keyboard、CompositeAction 等类。

其次,在实际测试过程中,可能会遇到某些按键没办法使用 Actions、Keys 等类来实现的情况。 比如通过使用 Alt+PrtSc 组合键来实现截取屏幕当前活动窗口的图像,在 Keys 枚举中,因为没有枚举出 PrtSc 键,所以没办法通过 Action 的 KeyDown(Keys) 来模拟按下这个动作。

再次是在自动化测试中,可能会遇到一些附件、文件上传的场景,或者是多文件上传,这些在 Selenium2.0 之后,可以直接使用 WebElement 类的 sendKeys() 方法来实现。

下面就分别介绍这些情况的具体使用。

回页首

鼠标点击操作

鼠标点击事件有以下几种类型:

清单 1. 鼠标左键点击
 Actions action = new Actions(driver);action.click();// 鼠标左键在当前停留的位置做单击操作
action.click(driver.findElement(By.name(element)))// 鼠标左键点击指定的元素
清单 2. 鼠标右键点击
 Actions action = new Actions(driver);
 action.contextClick();// 鼠标右键在当前停留的位置做单击操作
action.contextClick(driver.findElement(By.name(element)))// 鼠标右键点击指定的元素
清单 3. 鼠标双击操作
 Actions action = new Actions(driver);
 action.doubleClick();// 鼠标在当前停留的位置做双击操作
action.doubleClick(driver.findElement(By.name(element)))// 鼠标双击指定的元素
清单 4. 鼠标拖拽动作
 Actions action = new Actions(driver);
// 鼠标拖拽动作,将 source 元素拖放到 target 元素的位置。
 action.dragAndDrop(source,target);
// 鼠标拖拽动作,将 source 元素拖放到 (xOffset, yOffset) 位置,其中 xOffset 为横坐标,yOffset 为纵坐标。
action.dragAndDrop(source,xOffset,yOffset);

在这个拖拽的过程中,已经使用到了鼠标的组合动作,首先是鼠标点击并按住 (click-and-hold) source 元素,然后执行鼠标移动动作 (mouse move),移动到 target 元素位置或者是 (xOffset, yOffset) 位置,再执行鼠标的释放动作 (mouse release)。所以上面的方法也可以拆分成以下的几个执行动作来完成:

action.clickAndHold(source).moveToElement(target).perform();
 action.release();
清单 5. 鼠标悬停操作
 Actions action = new Actions(driver);
 action.clickAndHold();// 鼠标悬停在当前位置,既点击并且不释放
 action.clickAndHold(onElement);// 鼠标悬停在 onElement 元素的位置

action.clickAndHold(onElement) 这个方法实际上是执行了两个动作,首先是鼠标移动到元素 onElement,然后再 clickAndHold, 所以这个方法也可以写成 action.moveToElement(onElement).clickAndHold()。

清单 6. 鼠标移动操作
 Actions action = new Actions(driver);
 action.moveToElement(toElement);// 将鼠标移到 toElement 元素中点
// 将鼠标移到元素 toElement 的 (xOffset, yOffset) 位置,
//这里的 (xOffset, yOffset) 是以元素 toElement 的左上角为 (0,0) 开始的 (x, y) 坐标轴。
 action.moveToElement(toElement,xOffset,yOffset)
// 以鼠标当前位置或者 (0,0) 为中心开始移动到 (xOffset, yOffset) 坐标轴
 action.moveByOffset(xOffset,yOffset);

action.moveByOffset(xOffset,yOffset) 这里需要注意,如果 xOffset 为负数,表示横坐标向左移动,yOffset 为负数表示纵坐标向上移动。而且如果这两个值大于当前屏幕的大小,鼠标只能移到屏幕最边界的位置同时抛出 MoveTargetOutOfBoundsExecption 的异常。

鼠标移动操作在测试环境中比较常用到的场景是需要获取某元素的 flyover/tips,实际应用中很多 flyover 只有当鼠标移动到这个元素之后才出现,所以这个时候通过执行 moveToElement(toElement) 操作,就能达到预期的效果。但是根据我个人的经验,这个方法对于某些特定产品的图标,图像之类的 flyover/tips 也不起作用,虽然在手动操作的时候移动鼠标到这些图标上面可以出现 flyover, 但是当使用 WebDriver 来模拟这一移动操作时,虽然方法成功执行了,但是 flyover
却出不来。所以在实际应用中,还需要对具体的产品页面做相应的处理。

清单 7. 鼠标释放操
 Actions action = new Actions(driver);
 action.release();// 释放鼠标

回页首

键盘模拟操作

对于键盘的模拟操作,Actions 类中有提供 keyUp(theKey)、keyDown(theKey)、sendKeys(keysToSend) 等方法来实现。键盘的操作有普通键盘和修饰键盘(Modifier Keys, 下面的章节将讲到修饰键的概念)两种 :

1. 对于普通键盘,使用 sendKeys(keysToSend) 就可以实现,比如按键 TAB、Backspace 等。

清单 8. 普通键盘模拟 sendKeys(keysToSend)
 Actions action = new Actions(driver);
 action.sendKeys(Keys.TAB);// 模拟按下并释放 TAB 键
 action.sendKeys(Keys.SPACE);// 模拟按下并释放空格键
/***
针对某个元素发出某个键盘的按键操作,或者是输入操作,
比如在 input 框中输入某个字符也可以使用这个方法。这个方法也可以拆分成:
action.click(element).sendKeys(keysToSend)。
*/
 action.sendKeys(element,keysToSend);

注意除了 Actions 类有 sendKeys(keysToSend)方法外,WebElement 类也有一个 sendKeys(keysToSend)方法,这两个方法对于一般的输入操作基本上相同,不同点在于以下几点:

  • Actions 中的 sendKeys(keysToSend) 对于修饰键 (Modifier Keys) 的调用并不会释放,也就是说当调用 actions.sendKeys(Keys.ALT); actions.sendKeys(Keys.CONTROL); action.sendKeys(Keys.SHIFT); 的时候,相当于调用 actions.keyDown(keysToSend),而如果在现实的应用中想要模拟按下并且释放这些修饰键,应该再调用 action.sendKeys(keys.NULL)
    来完成这个动作。
  • 其次就是当 Actions 的 sendKeys(keysToSend) 执行完之后,焦点就不在当前元素了。所以我们可以使用 sendKeys(Keys.TAB) 来切换元素的焦点,从而达到选择元素的作用,这个最常用到的场景就是在用户名和密码的输入过程中。
  • 第三点,在 WebDriver 中,我们可以使用 WebElement 类的 sendKeys(keysToSend) 来上传附件,比如 element.sendKeys(“C:\\test\\uploadfile\\test.jpg”); 这个操作将 test.jpg 上传到服务器,但是使用:
Actions action = New Actions(driver);
 action.sendKeys(element,“C:\\test\\upload\\test.jpg”);
action.click(element).sendKeys(“C:\\test\\upload\\test.jpg”);

这种方式是上传不成功的,虽然 WebDriver 在执行这条语句的时候不会出错,但是实际上并没有将文件上传。所以要上传文件,还是应该使用前面一种方式。

2.对于修饰键(Modifier keys),一般都是跟普通键组合使用的。比如 Ctrl+a、Alt+F4、 Shift+Ctrl+F 等等。

  • 这里先解释一下修饰键的概念,修饰键是键盘上的一个或者一组特别的键,当它与一般按键同时使用的时候,用来临时改变一般键盘的普通行为。对于单独按下修饰键本身一般不会触发任何键盘事件。在个人计算机上的键盘上,有以下几个修饰键:Shift、Ctrl、Alt(Option)、AltGr、Windows logo、Command、FN(Function)。但是在 WebDriver 中,一般的修饰键指前面三个。你可以点击下面的 Wiki 链接去了解更多有关修饰键的信息,Modifier
    key
  • 回到上面的话题,在 WebDriver 中对于修饰键的使用需要用到 KeyDown(theKey)、keyUp(theKey) 方法来操作。
清单 9. 修饰键方法 KeyDown(theKey)、keyUp(theKey)
 Actions action = new Actions(driver);
 action.keyDown(Keys.CONTROL);// 按下 Ctrl 键
 action.keyDown(Keys.SHIFT);// 按下 Shift 键
 action.keyDown(Key.ALT);// 按下 Alt 键
 action.keyUp(Keys.CONTROL);// 释放 Ctrl 键
 action.keyUp(Keys.SHIFT);// 释放 Shift 键
 action.keyUp(Keys.ALT);// 释放 Alt 键

所以要通过 Alt+F4 来关闭当前的活动窗口,可以通过下面语句来实现:action.keyDown(Keys.ALT).keyDown(Keys.F4).keyUp(Keys.ALT).perform();

而如果是对于像键盘上面的字母键 a,b,c,d... 等的组合使用,可以通过以下语句实现 :action.keyDown(Keys.CONTROL).sednKeys(“a”).perform();

在 WebDriver API 中,KeyDown(Keys theKey)、KeyUp(Keys theKey) 方法的参数只能是修饰键:Keys.SHIFT、Keys.ALT、Keys.CONTROL, 否者将抛出 IllegalArgumentException 异常。 其次对于 action.keyDown(theKey) 方法的调用,如果没有显示的调用 action.keyUp(theKey) 或者 action.sendKeys(Keys.NULL) 来释放的话,这个按键将一直保持按住状态。

时间: 2024-11-05 13:45:48

selenium 学习-js执行,事件模拟,页面加载等待的相关文章

asp.net使用httphandler打包多CSS或JS文件以加快页面加载速度

介绍 使用许多小得JS.CSS文件代替一个庞大的JS或CSS文件来让代码获得更好的可维 护性,这是一个很好的实践.但这样做反过来却损失了网站的性能.虽然你应该将你的Javascript代码写在小文件中并且将大的CSS文件分割到小文件 中,当一个浏览器请求那些JS以及CSS文件,它却将为每一个文件产生一个请求.每一个HTTP请求将导致从你的浏览器到服务器上的一次"往返",从响应 服务器到客户端浏览器之间的等待时间称之为"延时".因此,如果你有四个JS文件以及三个CSS

两种页面加载等待效果的实现

第一种,当打开一个新的页面时,这个页面的加载时间可能会比较长,可以用以下js实现页面等待效果,将该js导入加载的页面即可使用 //获取浏览器页面可见高度和宽度 var _PageHeight = document.documentElement.clientHeight, _PageWidth = document.documentElement.clientWidth; //计算loading框距离顶部和左部的距离(loading框的宽度为215px,高度为61px) var _Loading

jQuery框架使用,jq选择器,jq操作页面内容, jq操作类名,jq操作全局属性,jq获取盒子信息,jq获取位置信息,js/jq页面加载完毕事件,jq事件

jq选择器 // 获取所有的页面元素jq对象 $('css3选择器语法'); var $box = $(".box:nth-child(1)"); 获取的是jq对象数组 // 拿到指定的页面元素jq对象 $('css3选择器语法').eq(index); var $box = $(".box").eq(1); 获取的是jq对象数组 // jq 转 js ( jq对像就是由数组包裹的js对象 ) box1 = $box[0] 从数组里取出来 box1 = $box.g

减少JS对页面加载性能影响的方法以及无阻塞脚本(javascript)模式

JS的阻塞特性:当<script>出现的时候,页面必须等待脚本文件的加载.解析.执行完毕后才能继续进行页面的渲染.不管脚本文件是以内联形式还是外部引入的形式出现在<script>中,页面的加载和渲染都必须停下来等待脚本文件的执行完成.因为在脚本文件中可能会修改页面的内容.这就会出现一个问题,当HTML文件中引入很多的外部脚本文件和内联脚本时,可能会导致页面的严重阻塞,影响页面的加载和渲染,用户体验特别的差.因而需要寻找适当的方法来减小脚本文件对页面加载带来的影响. 改善性能的几种方

JavaScript之jQuery-4 jQuery事件(页面加载后执行、事件处理、事件冒泡、事件对象、模拟操作)

一.jQuery 页面加载后执行 代码执行的时机选择 - $(document).ready()方法和 window.onload事件具有相似的功能,但是在执行时机方面是有区别的 - window.onload 事件是在网页中所有的元素(包括元素的所有关联文件)完全加载到浏览器后才执行 - $(document).ready()方法注册的事件处理程序,在DOM完全加载后就可以调用 - 一般来讲, $(document).ready()的执行要优于window.onload事件 - 需要注意的是,

JS 页面加载触发事件 document.ready和window.onload的区别

document.ready和onload的区别——JavaScript文档加载完成事件页面加载完成有两种事件: 一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件): 二是onload,指示页面包含图片等文件在内的所有元素都加载完成. 1.Dom Ready 使用jq时一般都是这么开始写脚本的: $(function(){ // do something }); 例如: $(function() { $("a").click(function() { alert(&

JS 页面加载触发事件 document.ready和onload的区别

JS 页面加载触发事件 document.ready和onload的区别 document.ready和onload的区别——JavaScript文档加载完成事件 页面加载完成有两种事件: 一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件): 二是onload,指示页面包含图片等文件在内的所有元素都加载完成. 1.Dom Ready 用jQ的人很多人都是这么开始写脚本的: $(function(){       // do something }); 例如: $(functi

js中页面加载完成后执行的几种方式及执行顺序

在js和jquery使用中,经常使用到页面加载完成后执行某一方法.通过整理,大概是五种方式(其中有的只是书写方式不一样). 1:使用jQuery的$(function){}; 2:使用jquery的$(document).ready(function(){});前两者本质上没有区别,第1种是第2种的简写方式.两个是document加载完成后就执行方法. 3:使用jQuery的$(window).load(function(){}); 4:使用window.onload = function(){

javascript页面加载完执行事件

<script type="text/javascript" language="JavaScript"> //: 判断网页是否加载完成 document.onreadystatechange = function () { if(document.readyState=="complete") { alert('ok'); } } </script> javascript页面加载完执行事件