如何测试是否为 Selenium 的必填字段触发了 HTML5 验证？答案

【问题标题】：How do I test if HTML5 validation was triggered for a required field with Selenium?如何测试是否为 Selenium 的必填字段触发了 HTML5 验证？
【发布时间】：2016-10-04 18:45:11
【问题描述】：

假设我有以下 HTML5 的 sn-p：

<form method="get" action="logginValidation.php">
    <input type="text" required="" name="username">
    <button class="btn" type="submit">Se connecter</button>
</form>

使用 Selenium，我将字段留空并按下按钮。表单未按预期进行验证，但我如何验证 this 字段无效以及是否存在与 this 字段相关联的消息。

现在我没有调查的一件事是我正在使用加载了 JavaScript 库的 Twitter Bootstrap。我必须仔细检查这些库是否没有欺骗我，以及验证是否真的来自 Firefox 浏览器。

【问题讨论】：

How to check if an HTML5 validation was triggered using selenium? 的可能重复项
无效字段会将 input:focus:required:invalid 伪类附加到该字段。嗯...现在我如何使用 Selenium 验证这些伪元素的存在。

标签： html selenium validation

【解决方案1】：

来自 Selenium 文档：

目前 css 选择器定位器支持所有 css1、css2 和 css3 选择器除了 css3 中的命名空间，一些伪类（：nth-of-type， :nth-last-of-type, :first-of-type, :last-of-type, :only-of-type, :visited, :hover, :active, :focus, :indeterminate) 和伪元素(::first-line, ::first-letter, ::selection, ::before, ::之后）。

这意味着 :required、:invalid 和 :valid 不是您可以选择与之交互的伪元素。

我通过对下一页上的文本执行 VerifyNotText 来解决此限制。不理想，但工作。

【讨论】：

我倾向于同意这是最好的解决方案，直到 Selenium 在其支持的列表中添加其他伪元素。

【解决方案2】：

目前我正在使用硒测试覆盖公司内部项目（类似于员工管理系统）。所以表格上有很多强制性的输入。如果任何一个为空，则整个表单都会得到验证。输入附近的文本标签变为（变为）红色，并出现相应的验证器消息。所以我检查验证器是否正常工作的方法非常简单： - 我写了获取颜色文本方法来获取输入附近标签的颜色（如果它是红色的，那么验证器已经在提交表单）

public String jsGetColor(String css){
        JavascriptExecutor js = (JavascriptExecutor) driver;
        StringBuilder stringBuilder = new StringBuilder();
        stringBuilder.append("var x=$(\'"+css+"\');");
        stringBuilder.append("return x.css('color')");
        String res= (String) js.executeScript(stringBuilder.toString());
        return res;
    }
// the way i use this method:

String defaultTimeOffLabelColor=(String)jsGetColor(propertyKeysLoader("rms.home.timeoffsportlet.addnewtimeoff.typetimeofflabel"));

        driverClickByCssSelector("rms.home.timeoffsportlet.addnewtimeoff.submitbutton");


        String validationTimeOffLabelColor=(String)jsGetColor(propertyKeysLoader("rms.home.timeoffsportlet.addnewtimeoff.typetimeofflabel"));

        //verifying validation works properly using Assert mechanism
 Assert.assertFalse("validation is invalid", validationTimeOffLabelColor.equals(defaultTimeOffLabelColor));

我还应该补充一点，如果验证器有效，则会出现错误消息。因此，您可以找到此消息的定位器并比较适当的文本。在其他情况下，当验证器没有工作时，例如提交表单验证器消息的样式将类似于“display:none”。因此，要了解一切正常，您只需检查消息是否可见：

driver.findElement(By.cssSelector(...blabla...)).isDisplayed()

最后一点。如果您想验证验证器的消息。

public void addNewTimeOffValidatorsMessagesCheck(String expectedValidationMsg)  {
        Assert.assertTrue(driver.findElement(By.cssSelector(propertyKeysLoader("rms.home.timeoffsportlet.addnewtimeoff.validationmessage"))).getText().trim().equals(expectedValidationMsg));
    }
 addNewTimeOffValidatorsMessagesCheck("Timeoff type was not selected!");

希望现在你能更清楚一点）

【讨论】：

【解决方案3】：

我认为这可以通过检查元素是否在 HTML 中具有“必需”属性来测试。示例代码是：- usernameField.getAttribute("必填")

如果它不为空，那么我们可以确定验证被触发了。

【讨论】：