2
votes

Comment rechercher et cliquer sur un élément de bouton contenant plusieurs classes

Utilisation de python + sélénium chromedriver. Sur un écran de connexion et en essayant de cliquer sur le bouton de connexion, je n'arrive pas à identifier l'élément correctement.

Essai de code:

<button type="submit" class="tv-button tv-button--no-border-radius tv-button--size_large tv-button--primary_ghost tv-button--loader">
<span class="tv-button__text">Log In</span>
<span class="tv-button__loader"><span class="tv-button__loader-item"></span><span class="tv-button__loader-item"></span><span class="tv-button__loader-item"></span></span></button>

HTML:

login = driver.find_element_by_css_selector('tv-button.tv-button--no-border-radius.tv-button--size_large.tv-button--primary_ghost.tv-button--loader')
click(login)


0 commentaires

5 Réponses :


1
votes

Il semble que vous manquez le . au début, donc le sélecteur Css cherchera la balise tv-button au lieu de class. Essayez ceci:

login = driver.find_element_by_css_selector('.tv-button.tv-button--no-border-radius.tv-button--size_large.tv-button--primary_ghost.tv-button--loader')
click(login)


0 commentaires

1
votes

Il ne fait aucun doute que nous devrions toujours choisir le sélecteur css plutôt que xpath.

Mais le sélecteur css que vous utilisez: .tv-button.tv-button - no-border-radius.tv-button - size_large.tv-button - primary_ghost.tv-button - loader semble très instable.

Pour juste le bouton de connexion, vous pouvez utiliser:

xpath: // span [contient (text (), 'Connexion')] / parent :: bouton

La raison pour laquelle vous devriez éviter le sélecteur css est que (dans ce cas), ce sélecteur css est une combinaison de nom de classe, donc si un nom de classe change, vous devrez changer le localisateur.

La probabilité de changer le nom de la classe dans ce cas est très probable. Parce qu'il est composé de 5 classes.

J'espère que cela vous aidera.


0 commentaires

1
votes

J'essaierais un sélecteur de classe plus court de

driver.find_element_by_css_selector('.tv-button').click()


0 commentaires

0
votes

Essayez Induce WebDriverWait pour identifier l'élément, puis cliquez dessus.

from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.common.by import By

element=WebDriverWait(driver,30).until(EC.element_to_be_clickable((By.CSS_SELECTOR,'button.tv-button span')))
print(element.text)
element.click()


2 commentaires

Cela contrôlera-t-il essentiellement le bouton jusqu'à ce qu'il soit cliquable? Cela pourrait-il être utilisé avec une page Web dont le bouton d'envoi est grisé jusqu'à ce qu'une condition soit remplie, puis cliquable?


Il s'agit de la meilleure pratique pour utiliser WebDriverWait au cas où votre page ne puisse pas se charger à temps, il s'agit d'une attente explicite pour vérifier si l'élément est cliquable et attendre le temps spécifié.



0
votes

L'élément est un élément dynamique donc pour localiser et cliquer sur l'élément vous devez induire WebDriverWait pour le element_to_be_clickable () et vous pouvez utiliser l'une des solutions suivantes :

  • Utilisation de CSS_SELECTOR :

    from selenium.webdriver.support.ui import WebDriverWait
    from selenium.webdriver.common.by import By
    from selenium.webdriver.support import expected_conditions as EC
    
  • Utilisation de XPATH :

    WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//button[@class='tv-button tv-button--no-border-radius tv-button--size_large tv-button--primary_ghost tv-button--loader']/span[@class='tv-button__text' and text()='Log In']"))).click()
    
  • Remarque : Vous devez ajouter les importations suivantes:

    WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "button.tv-button--no-border-radius.tv-button--loader>span.tv-button__text"))).click()
    


0 commentaires