如何檢查元素是否包含特定的類屬性

Question

如何檢查 selenium web 元素是否包含特定的 css 類。

我有這個 html li 元素

<li class="list-group-item ng-scope active" ng-repeat="report in lineageController.reports" ng-click="lineageController.activate(report)" ng-class="{active : lineageController.active == report}">

正如您在 class 屬性中看到的那樣，有一個活動類。

我的問題是我有這個元素，我想根據 class 屬性是否具有“active”值進行檢查，這是比使用 xpath 更優雅的解決方案。

我怎樣才能做到這一點？

Answer 1

鑒於您已經找到了您的元素，並且您想檢查 class-attribute 中的某個類：

public boolean hasClass(WebElement element) {
    String classes = element.getAttribute("class");
    for (String c : classes.split(" ")) {
        if (c.equals(theClassYouAreSearching)) {
            return true;
        }
    }
    
    return false;
}

#EDIT 正如@aurelius 正確指出的那樣，還有一種更簡單的方法（效果不佳）：

public boolean elementHasClass(WebElement element, String active) {
    return element.getAttribute("class").contains(active);
}

這種方法看起來更簡單，但有一個很大的警告：

正如@JuanMendes 所指出的，如果您要搜索的類名是其他類名的子字符串，則會遇到問題：

例如 class="test-a test-b"，搜索 class.contains("test") 將返回 true 但它應該是 false

#EDIT 2 嘗試組合兩個代碼片段：

public boolean elementHasClass(WebElement element, String active) {
    return Arrays.asList(element.getAttribute("class").split(" ")).contains(active);
}

那應該可以解決您的警告。

Answer 2

@drkthng 提供的答案有效，但您可能會遇到類名是另一個類名的子集的情況。 例如：

<li class="list-group-item ng-scope active">text</li>

如果您想找到“項目”類，那么提供的答案將給出誤報。 你可能想嘗試這樣的事情：

public boolean hasClass(WebElement element, String htmlClass) {
    String classes = element.getAttribute("class").split("\\s+");
    if (classes != null) {
        for (String classAttr: classes) {
            if (classAttr.equals(htmlClass)) {
                return true;
            }
        }
    }
    return false;
}

Answer 3

使用 javascript：classList.contains

 WebElement element = By.id("id");
 String className = "hidden";
 JavascriptExecutor js = (JavascriptExecutor) driver;
 Boolean containsClass = js.executeScript("return arguments[0].classList.contains(arguments[1])", element, className);

Answer 4

基於常見的 pre- classList javascript 技術：

public boolean hasClass(WebElement element, String theClass) {
    return (" " + element.getAttribute("class") + " ").contains(" " + theClass + " ");
}

Answer 5

與上一個類似，但具有 java 8 功能：

String classes= getDriver().findElement(someSelector).getAttribute("class");
Optional<String> classFindResult = Arrays.stream(elementClasses.split(" ")).filter(el -> el.equals("myClass")).findFirst();
if(openClassFindResult.isPresent()){
    return true;
}
return false;

Answer 6

改進@uesports135 答案，“classess”應該是一個字符串數組。

 public boolean hasClass(WebElement element, String htmlClass) {
        String[] classes = element.getAttribute("class").split("\\s+");
        if (classes != null) {
            for (String classAttr: classes) {
                if (classAttr.equals(htmlClass)) {
                    return true;
                }
            }
        }
        return false;
    }

Answer 7

對於任何尋找 C# 實現的人：

public static class WebElementExtensions
{
    private static Regex _classNameValidatorRegex = new Regex(@"^[a-z][a-z0-9\-_]*$", RegexOptions.IgnoreCase | RegexOptions.Compiled);
    private static Regex _whiteSpaceRegex = new Regex(@"\s+");

    public static bool HasClass(this IWebElement element, params string[] htmlClasses)
    {
        if (!htmlClasses.Any())
            throw new ArgumentException("No html classes to match.");

        if (!htmlClasses.All(c => _classNameValidatorRegex.IsMatch(c)))
            throw new ArgumentException("Invalid CSS class(es) detected.");

        var classAttribute = element.GetAttribute("class");
        if (string.IsNullOrWhiteSpace(classAttribute))
            return false;

        var elementClasses = _whiteSpaceRegex.Split(classAttribute.Trim()).ToHashSet();

        return htmlClasses.All(c => elementClasses.Contains(c));
    }

    public static bool HasAnyClass(this IWebElement element, params string[] htmlClasses)
    {
        if (!htmlClasses.Any())
            throw new ArgumentException("No html classes to match.");

        if (!htmlClasses.All(c => _classNameValidatorRegex.IsMatch(c)))
            throw new ArgumentException("Invalid CSS class(es) detected.");

        var classAttribute = element.GetAttribute("class");
        if (string.IsNullOrWhiteSpace(classAttribute))
            return false;

        var elementClasses = _whiteSpaceRegex.Split(classAttribute.Trim()).ToHashSet();

        return htmlClasses.Any(c => elementClasses.Contains(c));
    }
}

Answer 8

嘗試使用 contains();

String classes = divPubli.getAttribute("class");
assertTrue("The element does not contain .maClass class .publi",classes.contains("maClass"));

Answer 9

您可以使用jquery：

$( "#yourElement" ).hasClass( "protected" )

或這個

$( "#yourElement" ).is( ".pretty.awesome" )

另一個例子

$( "#yourElement" ).is( ":hidden" )

請參閱此處如何測試元素是否具有特定的類