Como pode identificar um elemento usando um seletor CSS ou XPath?

Para determinar um elemento usando um seletor CSS, utilizam-se diferentes métodos baseados na estrutura e atributos do HTML:

• Por tag: div, input, button, etc.
• Por classe: .nomeClasse (por exemplo, .btn-primary)
• Por identificador: #idElemento
• Por atributos: [type='text'], [name='nomeDeUtilizador']
• Combinações: div.nomeClasse, ul > li:first-child

Exemplo de seletor CSS:

input[type='submit'].btn

O XPath permite encontrar elementos de forma mais flexível e precisa, usando o caminho no DOM e condições:

• Por tag: //div
• Por atributo: //input[@type='text']
• Por texto: //button[text()='Enviar']
• Por índice: (//li)[3] — terceiro elemento li
• Relacionado a outros elementos: //div[@id='principal']//a[@class='link']

Exemplo de XPath:

//input[@name='utilizador' and @type='text']

Assim, a escolha entre CSS e XPath depende da tarefa e da estrutura da página. CSS é mais simples e rápido, XPath é mais poderoso para condições complexas.