使用 Selenium 和 Eclipse (Java) 为表格边框断言 css 样式答案

【问题标题】：Assert style of css for table border using Selenium with Eclipse (Java)使用 Selenium 和 Eclipse (Java) 为表格边框断言 css 样式
【发布时间】：2015-12-20 19:11:54
【问题描述】：

我正在测试一个表格，部分测试将必填字段留空，并检查该字段是否有红色边框，表示该字段是必填的，应在继续之前填写。到目前为止，我有以下代码：

driver=new FirefoxDriver();
driver.manage().window().maximize();

/** Test: Open page*/
driver.get ("URL with form");

/** the following confirms a text above the form stating what fields are mandatory and not filled */
driver.findElement(By.id("nextbutton")).click(); /** leave all fields blank and click on next below form */
assertEquals("The following fields are mandatory", driver.findElement(By.cssSelector("p")).getText());
assertEquals("Field 1 is mandatory", driver.findElement(By.xpath("//form[@id='genericform']/div[2]/ul/li")).getText());
assertEquals("Field 2 is mandatory", driver.findElement(By.xpath("//form[@id='genericform']/div[2]/ul/li[2]")).getText());
assertEquals("Field 3 is mandatory", driver.findElement(By.xpath("//form[@id='genericform']/div[2]/ul/li[3]")).getText());

assertTrue(isElementPresent(By.id("Field1.Value"))); /** confirms the first mandatory field is present */

现在我想确认/断言必填字段有一个红色边框和一个图标，而非必填字段没有红色边框或图标。

CSS：
边框颜色：#E04228；背景：#FFF url("../img/icon-field-error.png") no-repeat scroll right center / 28px 22px;

我正在使用带有 Selenium webdriver 的 Eclipse

【问题讨论】：

标签： java css selenium assert

【解决方案1】：

使用getCssValue()方法获取border-bottom-color、border-top-color、border-left-color和border-right-color CSS属性：

assertEquals("rgba(224, 66, 40)", element.getCssValue("border-bottom-color"));

请注意，border-color 是 computed，无法通过这种方式检索。

您也可以convert the rgba value to HEX format 使其更具可读性和方便性。

或者，您可以只检查input 元素是否具有error 和input-validation-error 类：

assertEquals("block error input-validation-error", element.getAttribute("class"));

【讨论】：

我尝试添加代码：assertEquals("#E04228", driver.findElement(By.id("frm-Voornaam.Value")).getCssValue("border-color"));但这导致：org.junit.ComparisonFailure: expected: but was: ......
@Hugo 所以，基本上它根本没有读取border-color 设置？您确定在做出断言时输入已突出显示吗？谢谢。
这是完整的 CSS 部分：select.error,textarea.error,input[type="email"].error,input[type="number"].error,input[type="密码"].error,input[type="tel"].error,input[type="text"].error,input[type="url"].error,input[type="color"].error, input[type="date"].error,input[type="datetime"].error,input[type="datetime-local"].error,input[type="month"].error,input[type= "time"].error,input[type="week"].error,input[type="search"].error{border-color:#e04228;背景：#fff url(../img/icon-field-error.png) 无重复权；背景尺寸：28px 22px;
和页面中的来源：
@Hugo 你知道吗，如果我们改为检查 error 和 input-validation-error 类的存在呢？..

【解决方案2】：

谢谢，您上次的更新成功了。我不得不改变一件事，但现在的代码是：

assertEquals("rgba(224, 66, 40, 1)", driver.findElement(By.id("frm-Voornaam.Value")).getCssValue("border-bottom-color"));

我必须用 rgba 做广告 [, 1] 现在它可以工作了，谢谢！

【讨论】：