Como você mapearia este elemento?

samuellucas

Boa tarde pessoal,

Como vocês mapeariam o elemento abaixo?

Não possui ID
Não possui name
As classes css são comuns a outros elementos
O placeholder default é comum a outros campos de horário no form
O valor default (vazio) é comum a outros campos do form

<div class="form-groups">
	<input type="text" class="form-controller" placeholder="00:00" value="">
</div>

Utilizei Xpath Axes mas gostaria de saber se, neste caso, existe uma alternativa mais coerente:

driver.findElement(By.xpath("//div[contains(text(), 'Horários')]/descendant::input[1]"));

Como vocês mapeiam/mapeariam?

stefanteixeira

Última pergunta: usando Selenium WebDriver em Java?

E cara, em vez de ficar sofrendo tanto, pq não ir no HTML e colocar um id nesse elemento? Ou pedir pra um dev fazer isso?

samuellucas

@stefanteixeira É Selenium WebDriver em Java. Não tenho acesso/autonomia sobre o código fonte… O ideal seria ter algum identificador único. Não é difícil fazer com xpath. Mas se houver algo mais coerente/performático/simples (como seria o id/name/css selector) seria bacana saber.

Obrigado pela sugestão!

stefanteixeira

Então XPath é o jeito mesmo… não tem muito pra onde fugir.

Saindo do escopo da sua pergunta, o problema disso é que esse tipo de coisa não deveria acontecer, se vc não tem autonomia sobre o código, alguém tem que ter. Não sei como é seu cenário, se vc trabalha em fábrica ou consultoria, mas isso tem que ser levado pra um líder de projeto e ser resolvido de alguma forma. Automação é pra ser algo efetivo, fácil de manter, não deveríamos ficar quebrando a cabeça pra automatizar um input de texto… tem muita coisa mais importante que pode ser feita, saca?

stefanteixeira

Vendo o resto do HTML talvez até dê pra pensar num seletor CSS…

Ramses Saccol de Almeida

Olha…ou pede ajuda ao dev para ter algum tipo de id ou estuda muito o css para descobrir algum tipo de padrão que possa te ajudar… Nessas horas só vendo muito o html para ter alguma idéia…

Paulo Gonçalves

Estive pensando em utilizar o css nesse caso, porém como não tenho prática com o Selenium e apenas com o Protractor, senti uma leve dificuldade pois a sintaxe é um pouco diferente e não pude testar.
Abaixo tentei implementar de forma com que ele selecione o primeiro input da lista:

driver.findElement(by.CssSelector('input[placeholder="00:00" ]:nth-of-type(1)'));
driver.findElement(by.CssSelector('input:nth-of-type(1)'));

Procurei entender com base nesses 2 sites:
https://saucelabs.com/resources/articles/selenium-tips-css-selectors
http://elementalselenium.com/tips/verifying-locators

Nesse caso, como o @Ramses-Saccol-de-Almeida e o @stefanteixeira disseram, é difícil fugir do Xpath por não ser um input ‘amigo do tester’. E creio que essa implementação em css que sugeri não muda muita coisa caso dê certo, pois continua oferecendo certa dificuldade de entendimento.

Depois me dá o retorno se algum desses foi útil, e se conseguiu fazer com que tornem esse trecho automatizável sem que passe por dificuldade.

samuellucas

@stefanteixeira @Ramses-Saccol-de-Almeida @Paulo-Gonçalves obrigado pelas dicas

Paulo, sua sugestão com css funcionou. Ficou assim, como no exemplo que você deu acima:

driver.findElement(By.cssSelector("input[placeholder='00:00']:nth-of-type(1)"))

Vou fazer mais alguns testes com os outros seletores que acabei conhecendo lendo melhor sobre o assunto (first-child, last-child, etc).

Valeu! o/

Paulo Gonçalves

@samuellucas said in Como você mapearia este elemento?:

@stefanteixeira @Ramses-Saccol-de-Almeida @Paulo-Gonçalves obrigado pelas dicas

Paulo, sua sugestão com css funcionou. Ficou assim, como no exemplo que você deu acima:
driver.findElement(By.cssSelector("input[placeholder='00:00']:nth-of-type(1)"))
Vou fazer mais alguns testes com os outros seletores que acabei conhecendo lendo melhor sobre o assunto (first-child, last-child, etc).

Valeu! o/

Bom saber que funcionaram , ~~o xpath é nosso inimigo,~~ tenta alterar todos os elementos que usam xpath por css no mínimo.
Claro que respeitando a ordem de preferência, que poderia ser da seguinte maneira:

Id
Name
css
Xpath

Deepak Kumar

Use basic XPath in Selenium. https://www.scientecheasy.com/2019/11/select-class-in-selenium.html

rodolfo farley

@samuellucas tenta fazer assim:

1 = Instalar o Selenium IDE na extensão do seu navegador.
2 = Abra o seu navegador botão direito inspecionar elemento depois no elemento do HTML clica em copy depois copy JS.
Vai fica assim.

document.querySelector("#description")

Depois você vai no seu console do navegador e cola o codigo e ve se vai selecionar.

Mas o ideal e você instalar o Selenium IDE uma extensão e fazer o teste gravando depois olhar o código.

Leonardo Galani

gente…esse post é de 2017 vou arquivar.