Comment puis-je trouver un élément par classe CSS avec XPath?

Dans ma page Web, il y a un divavec un classnom Test.

Comment puis-je le trouver avec XPath?

Ce sélecteur devrait fonctionner mais sera plus efficace si vous le remplacez par votre balisage adapté:

//*[contains(@class, 'Test')]

Ou, puisque nous savons que l'élément recherché est un div:

//div[contains(@class, 'Test')]

Mais comme cela correspondra également à des cas comme class="Testvalue"ou class="newTest", la version de @ Tomalak fournie dans les commentaires est meilleure :

//div[contains(concat(' ', @class, ' '), ' Test ')]

Si vous souhaitez être vraiment certain qu'il correspondra correctement, vous pouvez également utiliser la fonction normaliser l'espace pour nettoyer les espaces blancs parasites autour du nom de la classe (comme mentionné par @Terry):

//div[contains(concat(' ', normalize-space(@class), ' '), ' Test ')]

Notez que dans toutes ces versions, le * devrait être remplacé par le nom d'élément que vous souhaitez réellement faire correspondre, sauf si vous souhaitez rechercher chaque élément du document pour la condition donnée.

Le moyen le plus simple ..

//div[@class="Test"]

En supposant que vous vouliez trouver <div class="Test">comme décrit.

La SEULE bonne façon de le faire avec XPath:

//div[contains(concat(" ", normalize-space(@class), " "), " Test ")]

La fonction normalize-spacesupprime les espaces blancs de début et de fin et remplace également les séquences de caractères d'espaces blancs par un seul espace.

Remarque

Si vous n'avez pas besoin de beaucoup de ces requêtes Xpath, vous voudrez peut-être utiliser une bibliothèque qui convertit les sélecteurs CSS en XPath, car les sélecteurs CSS sont généralement beaucoup plus faciles à lire et à écrire que les requêtes XPath. Par exemple, dans ce cas, vous pouvez utiliser les deux div[class~="Test"]et div.Testpour obtenir le même résultat.

Quelques bibliothèques que j'ai pu trouver:

• Pour JavaScript : css2xpath & css-to-xpath
• Pour PHP : Composant CssSelector
• Pour Python : cssselect
• Pour C # : css2xpath Reloaded
• Pour GO : css2xpath

Je fournis simplement ceci comme une réponse, comme Tomalak a fourni un commentaire à la réponse de Meder il y a longtemps

//div[contains(concat(' ', @class, ' '), ' Test ')]

Une fonction utile peut être établie à partir des réponses précédentes:

function matchClass($className) {
    return "[contains(concat(' ', normalize-space(@class), ' '), ' $className ')]";
}

Concattez ensuite l'appel de fonction dans votre requête.

Match contre une classe qui a des espaces.

<div class="hello "></div>

//div[normalize-space(@class)="hello"]

vous pouvez trouver des éléments comme cet exemple (tous les éléments css)

private By 
allElementsCss = By.xpath(".//div[@class]");