XPath em Selenium: Tutorial

O que é XPath em Selenium?

XPath em Selenium é um caminho XML usado para navegação pela estrutura HTML da página. É uma sintaxe ou linguagem para localizar qualquer elemento em uma página da web usando uma expressão de caminho XML. XPath pode ser usado para documentos HTML e XML para encontrar a localização de qualquer elemento em uma página da web usando a estrutura HTML DOM.

In Selenium Na automação, se os elementos não forem encontrados pelos localizadores gerais como id, classe, nome, etc., o XPath é usado para encontrar um elemento na página da web.

Neste tutorial, aprenderemos sobre o XPath e diferentes expressões XPath para encontrar os elementos complexos ou dinâmicos, cujos atributos mudam dinamicamente na atualização ou em qualquer operação.

Sintaxe XPath

XPath contém o caminho do elemento situado na página web. A sintaxe XPath padrão para criar XPath é.

Xpath=//tagname[@attribute='value']

O formato básico do XPath no Selenium é explicado abaixo com uma captura de tela.

• //: Selecione o nó atual.
• Nome da etiqueta: Tagname do nó específico.
• @: Selecione o atributo.
• Atributo: Nome do atributo do nó.
• Valor: Valor do atributo.

Para encontrar o elemento nas páginas da web com precisão, existem diferentes tipos de localizadores:

Localizadores XPath	Encontre diferentes elementos na página da web
ID	Para encontrar o elemento pelo ID do elemento
Nome da classe	Para encontrar o elemento pelo nome da classe do elemento
Nome	Para encontrar o elemento pelo nome do elemento
Texto do link	Para encontrar o elemento pelo texto do link
XPath	XPath necessário para encontrar o elemento dinâmico e percorrer vários elementos da página da web
Caminho CSS	O caminho CSS também localiza elementos sem nome, classe ou ID.

Tipos de caminho X

Existem dois tipos de XPath:

1) XPath absoluto

2) XPath relativo

XPath absoluto

É a maneira direta de encontrar o elemento, mas a desvantagem do XPath absoluto é que, se houver alguma alteração feita no caminho do elemento, o XPath falhará.

A principal característica do XPath é que ele começa com uma única barra (/), o que significa que você pode selecionar o elemento do nó raiz.

Abaixo está o exemplo de uma expressão Xpath absoluta do elemento mostrado na tela abaixo.

NOTA: Você pode praticar o seguinte exercício XPath neste https://demo.guru99.com/test/selenium-xpath.html

Clique aqui. se o vídeo não estiver acessível

XPath absoluto:

/html/body/div[2]/div[1]/div/h4[1]/b/html[1]/body[1]/div[2]/div[1]/div[1]/h4[1]/b[1]

Xpath Relativo

Xpath Relativo começa no meio da estrutura HTML DOM. Começa com barra dupla (//). Ele pode pesquisar elementos em qualquer lugar da página da web, o que significa que não há necessidade de escrever um xpath longo e você pode começar do meio da estrutura HTML DOM. O Xpath relativo é sempre preferido, pois não é um caminho completo do elemento raiz.

Abaixo está o exemplo de uma expressão XPath relativa do mesmo elemento mostrado na tela abaixo. Este é o formato comum usado para localizar elementos por XPath.

Clique aqui. se o vídeo não estiver acessível

Relative XPath: //div[@class='featured-box cloumnsize1']//h4[1]//b[1]

O que são eixos XPath?

Os Eixos XPath pesquisam diferentes nós no documento XML a partir do nó de contexto atual. Os Eixos XPath são os métodos usados ​​para encontrar elementos dinâmicos, o que de outra forma não seria possível com métodos XPath normais sem ID, nome de classe, nome, etc. XPath em Selenium inclui vários métodos, como Contains, AND, Absolute XPath e Relative XPath para identificar e localizar elementos dinâmicos com base em vários atributos e condições.

Os métodos de eixos são usados ​​para encontrar esses elementos, que mudam dinamicamente na atualização ou em qualquer outra operação. Existem poucos métodos de eixos comumente usados ​​em Selenium Driver da Web como filho, pai, ancestral, irmão, precedente, eu, etc.

Como escrever XPath dinâmico Selenium webdriver

1) XPath básico

A expressão XPath seleciona nós ou lista de nós com base em atributos como ID, Nome, Nome da Classe, etc. do documento XML, conforme ilustrado abaixo.

Xpath=//input[@name='uid']

Aqui está um link para acessar a página https://demo.guru99.com/test/selenium-xpath.html

Algumas expressões XPath mais básicas:

Xpath=//input[@type='text']
Xpath=//label[@id='message23']
Xpath=//input[@value='RESET']
Xpath=//*[@class='barone']
Xpath=//a[@href='https://demo.guru99.com/']
Xpath=//img[@src='//guru99.com/images/home/java.png']

2) Contém()

Contém() é um método usado na expressão XPath. É usado quando o valor de qualquer atributo muda dinamicamente, por exemplo, informações de login.

O recurso conter tem a capacidade de localizar o elemento com texto parcial, conforme mostrado no exemplo XPath abaixo.

Neste exemplo, tentamos identificar o elemento apenas usando o valor de texto parcial do atributo. Na expressão XPath abaixo, o valor parcial 'sub' é usado no lugar do botão enviar. Pode-se observar que o elemento foi encontrado com sucesso.

O valor completo de 'Tipo' é 'enviar', mas usando apenas o valor parcial 'sub'.

Xpath=//*[contains(@type,'sub')]

O valor completo de 'nome' é 'btnLogin', mas usando apenas o valor parcial 'btn'.

Xpath=//*[contains(@name,'btn')]

Na expressão acima, consideramos ‘nome’ como um atributo e ‘btn’ como um valor parcial, conforme mostrado na imagem abaixo. Isso encontrará 2 elementos (LOGIN e RESET), pois o atributo 'nome' começa com 'btn'.

Da mesma forma, na expressão abaixo, consideramos ‘id’ como um atributo e ‘message’ como um valor parcial. Isso encontrará 2 elementos ('ID do usuário não deve estar em branco' e 'A senha não deve estar em branco'), pois seu atributo 'id' começa com 'mensagem'.

Xpath=//*[contains(@id,'message')]

Na expressão abaixo, consideramos o “texto” do link como um atributo e 'aqui' como um valor parcial, conforme mostrado na imagem abaixo. Isso encontrará o link ('aqui'), pois exibe o texto 'aqui'.

Xpath=//*[contains(text(),'here')]
Xpath=//*[contains(@href,'guru99.com')]

3) Usando OU e E

Na expressão OR, duas condições são usadas, se a 1ª condição OU a 2ª condição deve ser verdadeira. Também é aplicável se alguma condição for verdadeira ou talvez ambas. Significa que qualquer condição deve ser verdadeira para encontrar o elemento.

Na expressão XPath abaixo, ela identifica os elementos cujas condições únicas ou ambas são verdadeiras.

Xpath=//*[@type='submit' or @name='btnReset']

Destacando ambos os elementos como sendo o elemento “LOGIN”, que possui o atributo 'type', e o elemento “RESET”, que possui o atributo 'name'.

Na expressão AND, duas condições são usadas, ambas as condições devem ser verdadeiras para encontrar o elemento. Ele não consegue encontrar o elemento se alguma condição for falsa.

Xpath=//input[@type='submit' and @name='btnLogin']

Na expressão abaixo, destacando o elemento 'LOGIN' por possuir os atributos 'tipo' e 'nome'.

4) XPath começa com

XPath começa com() é uma função usada para localizar o elemento da web cujo valor do atributo é alterado na atualização ou por outras operações dinâmicas na página da web. Neste método, o texto inicial do atributo é correspondido para encontrar o elemento cujo valor do atributo muda dinamicamente. Você também pode encontrar elementos cujo valor de atributo é estático (não alterado).

Por exemplo -: Suponha que o ID de um elemento específico mude dinamicamente como:

Id=”mensagem12″

Id=”mensagem345″

Id=”mensagem8769″

e assim por diante.. mas o texto inicial é o mesmo. Neste caso, usamos a expressão Start-with.

Na expressão abaixo, existem dois elementos com um id iniciando “mensagem” (ou seja, 'User-ID não deve estar em branco' e 'Senha não deve estar em branco'). No exemplo abaixo, XPath encontra aqueles elementos cujo 'ID' começa com 'message'.

Xpath=//label[starts-with(@id,'message')]

5) Função XPath Text()

O Função XPath texto() é uma função integrada do Selenium webdriver que é usada para localizar elementos com base no texto de um elemento da web. Ajuda a encontrar os elementos de texto exatos e localiza os elementos dentro do conjunto de nós de texto. Os elementos a serem localizados devem estar em formato de string.

Nesta expressão, com função de texto, encontramos o elemento com correspondência exata de texto conforme mostrado abaixo. No nosso caso, encontramos o elemento com o texto “UserID”.

Xpath=//td[text()='UserID']

Métodos de eixos XPath

Esses métodos de eixos XPath são usados ​​para encontrar os elementos complexos ou dinâmicos. Abaixo veremos alguns desses métodos.

Para ilustrar esse método de eixos XPath, usaremos o GuruSite de demonstração do banco 99.

1) Seguindo

Seleciona todos os elementos no documento do nó atual () [a caixa de entrada UserID é o nó atual] conforme mostrado na tela abaixo.

Xpath=//*[@type='text']//following::input

Existem 3 nós de “entrada” correspondentes usando o eixo “seguinte” - senha, login e botão de reset. Se quiser se concentrar em qualquer elemento específico, você pode usar o método XPath abaixo:

Xpath=//*[@type='text']//following::input[1]

Você pode alterar o XPath de acordo com o requisito colocando [1],[2]………… e assim por diante.

Com a entrada como '1', a captura de tela abaixo encontra o nó específico que é o elemento da caixa de entrada 'Senha'.

2) Ancestral

O eixo ancestral seleciona todos os elementos ancestrais (avô, pai, etc.) do nó atual, conforme mostrado na tela abaixo.

Na expressão abaixo, estamos encontrando o elemento ancestral do nó atual (nó “ENTERPRISE TESTING”).

Xpath=//*[text()='Enterprise Testing']//ancestor::div

Existem 13 nós “div” correspondentes usando o eixo “ancestral”. Se quiser se concentrar em qualquer elemento específico, você pode usar o XPath abaixo, onde altera o número 1, 2 conforme sua necessidade:

Xpath=//*[text()='Enterprise Testing']//ancestor::div[1]

Você pode alterar o XPath de acordo com o requisito colocando [1], [2]………… e assim por diante.

3) Criança

Seleciona todos os elementos filhos do nó atual (Java) conforme mostrado na tela abaixo.

Xpath=//*[@id='java_technologies']//child::li

Existem 71 nós “li” correspondentes usando o eixo “filho”. Se você quiser se concentrar em qualquer elemento específico, você pode usar o xpath abaixo:

Xpath=//*[@id='java_technologies']//child::li[1]

Você pode alterar o xpath de acordo com o requisito colocando [1],[2]………… e assim por diante.

4) Precedente

Selecione todos os nós anteriores ao nó atual, conforme mostrado na tela abaixo.

Na expressão abaixo, identifica todos os elementos de entrada antes do botão “LOGIN” que está ID do usuário e senha elemento de entrada.

Xpath=//*[@type='submit']//preceding::input

Existem 2 nós de “entrada” correspondentes usando o eixo “precedente”. Se quiser se concentrar em qualquer elemento específico, você pode usar o XPath abaixo:

Xpath=//*[@type='submit']//preceding::input[1]

Você pode alterar o xpath de acordo com o requisito colocando [1],[2]………… e assim por diante.

5) Irmão seguinte

Selecione os seguintes irmãos do nó de contexto. Os irmãos estão no mesmo nível do nó atual, conforme mostrado na tela abaixo. Ele encontrará o elemento após o nó atual.

xpath=//*[@type='submit']//following-sibling::input

Correspondência de nós de uma entrada usando o eixo “irmão seguinte”.

6) Pai

Seleciona o pai do nó atual conforme mostrado na tela abaixo.

Xpath=//*[@id='rt-feature']//parent::div

Existem 65 nós “div” correspondentes usando o eixo “pai”. Se quiser se concentrar em qualquer elemento específico, você pode usar o XPath abaixo:

Xpath=//*[@id='rt-feature']//parent::div[1]

Você pode alterar o XPath de acordo com o requisito colocando [1],[2]………… e assim por diante.

7) Eu

Seleciona o nó atual ou 'self' significa que indica o próprio nó conforme mostrado na tela abaixo.

Correspondência de um nó usando o eixo “self”. Ele sempre encontra apenas um nó, pois representa o elemento próprio.

Xpath =//*[@type='password']//self::input

8) Descendente

Seleciona os descendentes do nó atual conforme mostrado na tela abaixo.

Na expressão abaixo, ele identifica todos os elementos descendentes do elemento atual (elemento do quadro 'corpo principal surround'), o que significa abaixo do nó (nó filho, nó neto, etc.).

Xpath=//*[@id='rt-feature']//descendant::a

Existem 12 nós “link” correspondentes usando o eixo “descendente”. Se quiser se concentrar em qualquer elemento específico, você pode usar o XPath abaixo:

Xpath=//*[@id='rt-feature']//descendant::a[1]

Você pode alterar o XPath de acordo com o requisito colocando [1],[2]………… e assim por diante.

Perguntas Frequentes

Resumo

Verifique também: - Selenium Tutorial para iniciantes: Aprenda WebDriver em 7 dias