Selenium中级 | Selenium如何验证error message的颜色

                      Selenium如何验证error message的颜色

在Web系统中，对于一些错误的操作，给出的错误提示信息往往是比较警醒的红色，比如登录的时候输入了错误的用户名和密码，或者不输入直接点击登录按钮，系统都会给出类似的错误提示信息：

我们做自动化测试的时候，如果要进一步验证文字的颜色，则可以按照下面的方法来进行。

 

整体思路如下：

1. 通过getCssValue("color");方法来获取到错误提示的颜色信息

一般这些颜色的控制都是放在CSS文件中的，在Selenium中可以通过getCssValue("color");方法来获取到某元素的颜色信息

例：String errorColor = driver.findElement(By.xpath("//div[@class='error']")).getCssValue("color");

2.  将RGB格式的颜色转化为16进制的颜色

通过getCssValue获取到的颜色信息是RGB格式的（例：rgba(169, 68, 66, 1)），为了方便比较可以通过Selenium提供的Color类里的fromString()和asHex()方法将RGB格式的颜色转换为16进制的颜色（例：#a94442）

例：String hexColor = Color.fromString(errorColor).asHex();

 

实例：

1. 打开eteams网站：https://eteams.cn/

2. 点击登录按钮进入登录页面

3.不输入用户名密码，直接点击 登录

4. 验证错误提示信息及信息的颜色

实例代码：

package high;

import java.util.concurrent.TimeUnit;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.chrome.ChromeOptions;
import org.openqa.selenium.support.Color;

public class VerifyCSSColor {

	public static void main(String[] args) {
		
System.setProperty("webdriver.chrome.driver", "D:\\BrowserDriver\\chromedriver.exe");
		
		//关掉谷歌浏览器提示信息
		ChromeOptions options =new ChromeOptions();
		options.addArguments("disable-infobars");
		//实例化webdriver对象
		WebDriver driver =new ChromeDriver(options);
		driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
		//1.打开OA首页
		driver.get("https://eteams.cn/");
		driver.manage().window().maximize();
		
		driver.findElement(By.id("top-btn-login")).click();
		
		//直接点击登录按钮，触发error出现
		driver.findElement(By.xpath("//button[@type='submit']")).click();
		
		//获取error message的文本信息
		String errorMsg = driver.findElement(By.xpath("//div[@class='error']")).getText();
		System.out.println(errorMsg);
		
		//使用getCssValue("color")获取到错误提示的颜色信息为RGB格式
		String errorRGBColor = driver.findElement(By.xpath("//div[@class='error']")).getCssValue("color");
		System.out.println(errorRGBColor);
		
		//借助Selenium Color类提供的相关方法将RGB格式转换为16进制格式
		String hexColor = Color.fromString(errorRGBColor).asHex();	      
		System.out.println(hexColor);

	}

}

 

执行该脚本后，在控制台可以看到如下输出：

Picked up JAVA_TOOL_OPTIONS: -Dfile.encoding=UTF8
Starting ChromeDriver 2.40.565498 (ea082db3280dd6843ebfb08a625e3eb905c4f5ab) on port 37896
Only local connections are allowed.
6月 14, 2019 10:14:52 上午 org.openqa.selenium.remote.ProtocolHandshake createSession
信息: Detected dialect: OSS
账号和密码均不能为空
rgba(169, 68, 66, 1)
#a94442

注：

1. 16进制颜色中字母是不区分大小写的

2. 如果引入了TestNG则可以使用TestNG的Assert.assertEquals("#a94442",hexColor );来验证。

3. getCssValue方法不光可以获取CSS的颜色属性还可以获取其他属性如字体类型、字体大小等等。

希望本篇文章可以帮到大家，谢谢！

********************************************************************************************************

近期我会在博客中系统的更新一些关于Selenium的文章，也请大家多多关注下我的视频课程：

入门：基于Java的Selenium3自动化测试完整教程

高级：Selenium Java高级架构课程

*********************************************************************************************************

阅读更多精彩文章，请大家关注我的测试公众号：火烈鸟测试