如何在 Selenium 中檢查表單元素的有效性 state

Question

我想知道是否可以檢查來自 Selenium 的表單元素的驗證 state。 我想這是一個屬性，但它的含義並不明顯。

//all these form elements are required as part of the form
WebElement createAccountEmailInput = this.wrapper.getDriver().findElement(By.id("createAccountEmail"));
WebElement createAccountUsernameInput = this.wrapper.getDriver().findElement(By.id("createAccountUsername"));
WebElement createAccountPasswordInput = this.wrapper.getDriver().findElement(By.id("createAccountPassword"));
WebElement createAccountPasswordConfirmInput = this.wrapper.getDriver().findElement(By.id("createAccountPasswordConfirm"));
WebElement createAccountSubmitButton = this.wrapper.getDriver().findElement(By.id("createAccountSubmitButton"));

//doesn't submit on no input
createAccountSubmitButton.click();

// at this point, all the inputs will be in the invalid state. How to verify that state?

形式：

<form id="homeCreateAccount">
    <div class="form-group">
        <label for="createAccountEmail">Email:</label>
        <input type="email" class="form-control loginEmailUsername" id="createAccountEmail"
        placeholder="Email" name="email" required>
    </div>
    <div class="form-group">
        <label for="createAccountUsername">Username:</label>
        <input type="text" class="form-control loginEmailUsername" id="createAccountUsername"
        placeholder="Username" name="email" required>
    </div>
    <div class="form-group">
        <label for="createAccountPassword">Password:</label>
        <input type="password" class="form-control loginPassword" id="createAccountPassword"
        placeholder="Password" name="password" required>
    </div>
    <div class="form-group">
        <label for="createAccountPasswordConfirm">Password Confirmation:</label>
        <input type="password" class="form-control loginPassword" id="createAccountPasswordConfirm"
        placeholder="Password Confirm" name="password" required>
    </div>
    <button type="submit" class="btn btn-primary" id="createAccountSubmitButton">Create Account <i class="fas fa-user-plus"></i></button>
</form>

Answer 1

您可以在查詢選擇器中使用：invalid pseudo class 來查找 select 無效元素。