Selenium02-通过页面元素的属性获取相应的页面元素


在正式编写测试用例前,应该了解一下 Selenium的基本语法,下面通过实际的案例介绍

内容:

1.搭建tomcat服务器,存放准备测试内容,测试页面



2. 执行testng测试

第一部分:基本语法部分介绍

package com.testng;

import java.util.List;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.testng.Assert;
import org.testng.annotations.AfterTest;
import org.testng.annotations.BeforeTest;
import org.testng.annotations.Test;

/**
 * <p>
 * Selenium的Java编程基本语法:通过页面元素的属性获取相应的页面元素
 * 检查元素的文本
 * </p>
 * <code>
			<html>
			<head>
			<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
			<title>Insert title here</title>
			</head>
			<body>
				名称: <input id="wareName" name="wareName" value="中国"></input><br/>
				多行文本框:<textarea rows="2" cols="40" id="area">中国移动积分商城计划</textarea><br/>
				div:<div id="coolestWidgetEvah">亚信科技(中国)有线公司</div><br/>
				<div class="guojia">
					<span>中国</span>
				</div>
				<div class="guojia">
					<span>美国</span>
				</div>
				<br/>
				By Link Text:<a href="http://jf.10086.cn/">积分商城</a><br/>
				
				<iframe src="http://jf.10086.cn/"></iframe><br/>
				
				By Partial Link Text根据链接的部分文字 By Link Text:<a href="http://jf.10086.cn/">搜索积分商城</a><br/>
				By CSS从名字上看,这是根据CSS来定位元素:
				<div id="food" style="border: 1px solid;">
					 <span class="dairy">milk</span>
					 <span class="dairy aged">apple</span>
				</div>
			</body>
			</html>
 * </code>
 * @author shenfl
 * @version V1.0
 * @date 2014/7/7
 */
public class TestSeleniumGrammar01 {

	public static final String jfWebUrl = "http://localhost:8080/SeleniumWeb/selenium01.jsp";
	WebDriver wd ;
	
	@BeforeTest
	public void beforeTest(){
		System.setProperty("webdriver.firefox.bin", "D:/Program Files/Mozilla Firefox/firefox.exe");
	    wd = new FirefoxDriver();
		wd.manage().window().maximize();
		wd.get(jfWebUrl);
	}
	@AfterTest
	public void afterTest(){
		wd.close();
	}
	/**
	 * 通过Identifier(id)定位元素,只有当你明确知道元素的id属性,才能使用
	 */
	@Test
	public void test01Byid() {
		
		WebElement wE = wd.findElement(By.id("wareName"));
		wE.clear();
		wE.sendKeys("杯子");

		String value = wE.getAttribute("value");
		Assert.assertEquals("杯子", value);
		
		//WebElement中的getText()方法返回元素的innerText属性。所以元素里面如果有子节点一样也会被反回出来
		wE = wd.findElement(By.id("area"));
		String v = wE.getText();
		Assert.assertEquals(v, "中国移动积分商城计划");
		Assert.assertTrue(v.contains("移动"));
		Assert.assertTrue(v.startsWith("中国"));
		Assert.assertTrue(v.endsWith("计划"));
		//此处需要使用getAttribute()方法来检查元素的属性
		Assert.assertEquals("2", wE.getAttribute("rows"));
		
		wE = wd.findElement(By.id("coolestWidgetEvah"));
		v = wE.getText();
		Assert.assertEquals("亚信科技(中国)有线公司", v);
	}

	/**
	 * 使用id定位元素固然方面,但是id并不是html元素必须的,我们可以使用Name定位元素位置
	 * ①使用Name定位元素的位置,会匹配第一个与Name匹配的元素。如果页面中有多个相同的Name,可以使用更多的筛选器进行元素筛选的细化
	 */
	@Test
	public void test02ByName() {
		
		WebElement we = null;
		//通过name获取元素
		we = wd.findElement(By.name("wareName"));
		
		Assert.assertEquals("中国", we.getAttribute("value"));
		//By.tagname 通过tagname属性定位元素
		Assert.assertEquals("input", we.getTagName());
		
	}
	/**
	 *使用CSS选择器来查找元素的时候
	 */
	@Test
	public void test03CssSelector(){
		
		WebElement wE = null;
		//通过css选择器获取元素:By.cssselector 通过CSS定位元素
		wE=wd.findElement(By.cssSelector("input[name=wareName]"));
		wE.clear();
		wE.sendKeys("中国");
		Assert.assertEquals("中国", wE.getAttribute("value"));
	}
	
	
	/**
	 * <function>class指的是DOM中的元素,在实际使用过程中,会发现很多DOM元素含有相同的class名。</function>
	 * <code>
	 * 		<div class="guojia">
				<span>中国</span>
			</div>
			<div class="guojia">
				<span>美国</span>
			</div>
	 * </code>
	 */
	@Test
	public void test04ByClass(){
		
		List<WebElement> guojias = wd.findElements(By.className("guojia"));
		for(WebElement wE:guojias){
			System.out.println(wE.getText());
		}
	}
	/**
	 * By.linktext 通过文本定位链接
	 * <code>
	 * 	By Link Text:<a href="http://jf.10086.cn/">积分商城</a>
	 * </code>
	 */
	@Test
	public void test05ByLink(){
		
		WebElement wE = wd.findElement(By.linkText("积分商城"));
		Assert.assertEquals("http://jf.10086.cn/", wE.getAttribute("href"));
	}
	
	/**
	 * By Tag Name : DOM的Tag元素
	 * <code></code>
	 */
	@Test
	public void test06ByTagName(){
		
		WebElement we = wd.findElement(By.tagName("iframe"));
		
		Assert.assertEquals("http://jf.10086.cn/", we.getAttribute("src"));
		
	}
	
	/**
	 * By Partial Link Text根据链接的部分文字 
	 * <code>
	 * 		By Link Text:<a href="http://jf.10086.cn/">搜索积分商城</a>
	 * </code>
	 */
	@Test
	public void test07ByPartialLinkText(){
		
		WebElement we = wd.findElement(By.partialLinkText("搜索"));
		Assert.assertEquals("http://jf.10086.cn/", we.getAttribute("href"));
	}
	
	/**
	 * <code>
	 * 			By CSS从名字上看,这是根据CSS来定位元素:
				<div id="food" style="border: 1px solid;">
					 <span class="dairy">milk</span>
					 <span class="dairy aged">apple</span>
				</div>
	 * </code>
	 */
	@Test
	public void test08ByCssSelector(){
		
		WebElement we = wd.findElement(By.cssSelector("#food span.dairy"));
		Assert.assertEquals("milk", we.getText());
	}
}


第二部分:高级语法部分

package com.testng;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.testng.Assert;
import org.testng.annotations.AfterTest;
import org.testng.annotations.BeforeTest;
import org.testng.annotations.Test;

/**
 * <function>
			//By id
			WebElement ele = driver.findElement(By.id(<element id>));
			//By Name
			WebElement ele = driver.findElement(By.id(<element name>));
			//By className
			WebElement ele = driver.findElement(By.className(<element ClassName>));
			//By tabName
			WebElement ele = driver.findElement(By.tagName(<html tagName>));
			//By linkText
			WebElement ele = driver.findElement(By.linkText(<link text>));
			//By partialLinkText
			WebElement ele = driver.findElement(By.partialLinkText(<link text>));//通过部分文本定位连接
			//By cssSelector
			WebElement ele = driver.findElement(By.cssSelector(<css>));
			//By XPATH
			WebElement ele = driver.findElement(By.xpath(<element xpath>));
 * </function>
 * <p>
	 @author shenfl
	 @version V1.0
	 @date 2014/7/9
   </p>
 */
public class TestSeleniumGrammar02 {

	public static final String jfWebUrl = "http://localhost:8080/SeleniumWeb/selenium02.jsp";
	WebDriver wd ;
	
	@BeforeTest
	public void beforeTest(){
		System.setProperty("webdriver.firefox.bin", "D:/Program Files/Mozilla Firefox/firefox.exe");
	    wd = new FirefoxDriver();
		wd.manage().window().maximize();
		wd.get(jfWebUrl);
	}
	@AfterTest
	public void afterTest(){
		wd.close();
	}
	/**
	 * xpath:获取处于DOM中<input>元素
	 * 选择属性在XPath中,除了选择元素以外,也可以选择属性。属性都是以@开头。
	 * <code>
			<input name="n1" id="n1" value="n11" type="text"/>
			<input name="n2" id="n2" value="n12" type="text"/>
			<input name="n3" id="n3" value="n13" type="text"/>
	 * </code>
	 */
	@Test
	public void test01Xpath() {
		
		WebElement we = wd.findElement(By.xpath("//input"));
		Assert.assertEquals("n11", we.getAttribute("value"));

		//使用索引定位DOM中的第二个<input>元素:
		we = we.findElement(By.xpath("//input[2]"));
		Assert.assertEquals("n12", we.getAttribute("value"));
		
		//查找所有input标签中含有type属性的元素
		we = wd.findElement(By.xpath("//input[@id='n3']"));
		Assert.assertEquals("n13", we.getAttribute("value"));
	}
         /**
<span style="white-space:pre">	</span> * <function>XPATH语言是基于XML文档的树结构</function>
<span style="white-space:pre">	</span> * <code>
<span style="white-space:pre">	</span> * <span style="white-space:pre">		</span><div id="welcome">
<span style="white-space:pre">				</span><span class="welInfo">您好,欢迎访问中国移动积分商城,请[<a href="http://jf.10086.cn/login/login.jsp">登录</a>]</span>
<span style="white-space:pre">			</span></div>
<span style="white-space:pre">	</span> * </code>
<span style="white-space:pre">	</span> */
<span style="white-space:pre">	</span>@Test
<span style="white-space:pre">	</span>public void test02Xpath(){
<span style="white-space:pre">		</span>
<span style="white-space:pre">		</span>WebElement we = wd.findElement(By.xpath("//*[@id='welcome']/span/a"));
<span style="white-space:pre">		</span>Assert.assertEquals("http://jf.10086.cn/login/login.jsp", we.getAttribute("href"));
<span style="white-space:pre">		</span>Assert.assertEquals("登录", we.getText());
<span style="white-space:pre">	</span>}
}



执行单元测试后,给出执行后的报告:



从以上单元测试报告可以看出,正确的用例绿色显示,未通过案例红色颜色。对于出错的用例,清楚看到具体出错原因,大大方便开发者。




相关推荐
©️2020 CSDN 皮肤主题: 游动-白 设计师:白松林 返回首页