¿Cómo puedo encontrar un elemento por clase CSS con XPath?

En mi página web, hay un divcon un classnombre Test.

¿Cómo puedo encontrarlo XPath?

Este selector debería funcionar, pero será más eficiente si lo reemplaza con su marcado adecuado:

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

O, como sabemos, el elemento buscado es un div:

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

Pero como esto también coincidirá con casos como class="Testvalue"o class="newTest", la versión de @ Tomalak proporcionada en los comentarios es mejor :

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

Si desea estar realmente seguro de que coincidirá correctamente, también puede usar la función normalizar-espacio para limpiar los caracteres de espacio en blanco alrededor del nombre de la clase (como lo menciona @Terry):

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

Tenga en cuenta que en todas estas versiones, el * debe reemplazarse mejor por cualquier nombre de elemento que realmente desee que coincida, a menos que desee buscar en cada elemento del documento la condición dada.

La forma más fácil ...

//div[@class="Test"]

Suponiendo que desea encontrar <div class="Test">como se describe.

La ÚNICA forma correcta de hacerlo con XPath:

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

La función normalize-spaceelimina los espacios en blanco iniciales y finales, y también reemplaza las secuencias de caracteres de espacios en blanco por un solo espacio.

Nota

Si no necesita muchas de estas consultas Xpath, es posible que desee utilizar una biblioteca que convierta los selectores CSS a XPath, ya que los selectores CSS suelen ser mucho más fáciles de leer y escribir que las consultas XPath. Por ejemplo, en este caso, podría usar ambos div[class~="Test"]y div.Testobtener el mismo resultado.

Algunas bibliotecas que he podido encontrar:

• Para JavaScript : css2xpath y css-to-xpath
• Para PHP : Componente CssSelector
• Para Python : cssselect
• Para C # : css2xpath Reloaded
• Para GO : css2xpath

Solo estoy proporcionando esto como respuesta, como Tomalak proporcionó como un comentario a la respuesta de Meder hace mucho tiempo

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

Se puede hacer una función útil a partir de respuestas anteriores:

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

Luego simplemente concat la llamada a la función en su consulta.

Empareja contra una clase que tenga espacios en blanco.

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

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

puedes encontrar elementos como este ejemplo (todos los elementos css)

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