Comprendre en 10 minutes le sélénium

Qu'est-ce que Selenium?

Selenium est un framework pour automatiser les opérations du navigateur Web. Développé en 2004 par ThoughtWorks pour automatiser les tests d'interface utilisateur des applications Web. https://selenium.dev/history/

Développé à l'origine à des fins de test d'interface utilisateur et de test JavaScript d'applications Web, il est utilisé à des fins autres que les tests, telles que l'automatisation des tâches et l'exploration de sites Web.

Cet article décrit comment créer un environnement et l'utiliser pour faire fonctionner Chrome via Selenium en Python.

TL;DR

Environnement

Pour faire fonctionner le navigateur automatiquement à l'aide de Selenium, vous devez installer ce qui suit.

Ici, nous allons introduire deux types de construction d'environnement lors de l'utilisation de Selenium avec Python, l'un consiste à utiliser Docker et l'autre à créer un environnement directement sur le PC local.

(Méthode 1) Créer un environnement avec Doceker

Il est très facile de configurer en utilisant l'image Docker officiellement publiée par Selenium. https://github.com/SeleniumHQ/docker-selenium

Cette méthode a une telle configuration.

Le navigateur et Remote WebDriver s'exécutent sur le conteneur Docker et Selenium se connecte au Remote WebDriver à partir d'un autre hôte sur le réseau.

Personnellement, cette méthode est la plus simple à mettre en place et la plus recommandée.

Installez Chrome et WebDriver

Exécutez simplement la commande suivante pour démarrer l'environnement Chrome qui peut être utilisé à partir de Selenium.

$ docker run -d -p 4444:4444 -v /dev/shm:/dev/shm selenium/standalone-chrome:3.141.59-xenon

WebDriver a un problème légèrement ennuyeux: cela ne fonctionne pas à moins que vous ne choisissiez la version qui correspond à la version de votre navigateur, mais l'image officielle de Docker a à la fois le navigateur et WebDriver installés afin que vous puissiez l'utiliser immédiatement.

Installer les liaisons Python Selenium

Installez la bibliothèque pour utiliser Selenium sur la machine qui exécute le code Python de Selenium. Les liaisons Selenium de Python peuvent être installées avec pip.

$ pip install selenium

Essayez de bouger

Vous pouvez exécuter Selenium à partir de Python avec un code comme celui-ci:

from selenium import webdriver

#Définir les options de Chrome
options = webdriver.ChromeOptions()
options.add_argument('--headless')

#Connectez-vous au serveur Selenium
driver = webdriver.Remote(
    command_executor='http://localhost:4444/wd/hub',
    desired_capabilities=options.to_capabilities(),
    options=options,
)

#Utilisez le navigateur via Selenium
driver.get('https://qiita.com')
print(driver.current_url)

#Quittez le navigateur
driver.quit()

(Méthode 2) Construire un environnement localement

Ensuite, j'écrirai comment créer un environnement pour exécuter Selenium localement sur le Mac.

Cette méthode a une telle configuration.

Le navigateur et WebDriver fonctionnent tous localement et Selenium se connecte au pilote local.

Installez Chrome

De nombreuses personnes peuvent déjà avoir installé Chrome, mais installent Chrome normalement.

Vérifiez ensuite la version de Chrome installée pour déterminer la version de WebDirver à installer. Dans mon environnement, «78.0.3904.108» a été installé.

image.png

Installez WebDriver

Téléchargez le binaire Chrome WebDriver. En Python, il y a une personne qui a publié une bibliothèque pratique appelée chromedriver-binary qui télécharge le binaire WebDriver et définit le chemin, je vais donc l'utiliser.

https://github.com/danielkaiser/python-chromedriver-binary

Puisqu'il est nécessaire d'installer WebDriver correspondant à la version de Chrome, installez WebDriver en spécifiant uniquement la version majeure avec pip comme suit.

$ pip install chromedriver-binary==78.*

Installer les liaisons Python Selenium

Les liaisons Selenium de Python sont installées avec pip.

$ pip install selenium

Essayez de bouger

Dans l'environnement local, vous pouvez exécuter Selenium avec le code suivant.

import chromedriver_binary # nopa
from selenium import webdriver

#Définir les options de WebDriver
options = webdriver.ChromeOptions()
options.add_argument('--headless')

print('connectiong to remote browser...')
driver = webdriver.Chrome(options=options)

driver.get('https://qiita.com')
print(driver.current_url)

#Quittez le navigateur
driver.quit()

Par rapport à l'exemple précédent dans Docker, la différence est que la classe Chrome est spécifiée pour WebDriver.

L'exécution du code ci-dessus lancera Chrome sur votre PC. Si vous commentez la partie ʻoptions.add_argument ('--headless') `, vous pouvez voir comment l'écran du navigateur est affiché et se déplace.

Utilisation de base

Maintenant que vous pouvez créer un environnement pour utiliser Selenium, voyons comment l'utiliser réellement.

Chose que tu veux faire

Maintenant, exécutons Chrome sur Selenium et essayons les opérations suivantes.

  1. Visitez la page de profil Chanmoro de Qiita https://qiita.com/Chanmoro

  2. Accédez à la deuxième page de la liste d'articles affichée dans "Articles récents"

  3. Obtenez l'URL et affichez le titre de l'article affiché au tout début de la deuxième page

Exécutez Selenium en Python

Ici, nous utiliserons Selenium Server avec Docker introduit dans la construction de l'environnement au début. Même dans un environnement local, la seule différence est la partie qui configure WebDrive, et le même code peut être utilisé pour les opérations suivantes.

Tout d'abord, je vais vous montrer tout le code.

from selenium import webdriver
from selenium.webdriver.common.by import By

# x.Définir les options de lancement de Chrome
options = webdriver.ChromeOptions()
options.add_argument('--headless')

# x.Ouvrez une nouvelle fenêtre de navigateur
print('connectiong to remote browser...')
driver = webdriver.Remote(
    command_executor='http://localhost:4444/wd/hub',
    desired_capabilities=options.to_capabilities(),
    options=options,
)

# 1.Visitez la page de profil de Qiita Chanmoro
driver.get('https://qiita.com/Chanmoro')
print(driver.current_url)
# > https://qiita.com/Chanmoro

# 2.Aller à la deuxième page de la liste d'articles affichée dans "Articles récents"
driver.find_element(By.XPATH, '//a[@rel="next" and text()="2"]').click()
print(driver.current_url)
# > https://qiita.com/Chanmoro?page=2

# 3.Obtenez l'URL du titre de l'article affiché au tout début de la deuxième page
article_links = driver.find_elements(By.XPATH, '//div[@class="ItemLink__title"]/a')
print(article_links[0].text)
# > Python -Appeler dynamiquement une fonction à partir d'une chaîne
print(article_links[0].get_attribute('href'))
# > https://qiita.com/Chanmoro/items/9b0105e4c18bb76ed4e9

# x.Quittez le navigateur
driver.quit()

Expliquons étape par étape.

x. Définir les options de Chrome

Tout d'abord, définissez les options de démarrage de Chrome avant de lancer Chrome. Les classes facultatives sont séparées pour chaque navigateur, et il existe des classes compatibles avec les navigateurs telles que «ChromeOptions» pour Chrome et «FirefoxOptions» pour Firefox.

Dans Chrome, l'option sans tête lance le navigateur sans afficher l'écran. Fondamentalement, je pense qu'il est principalement utilisé en mode sans tête, mais si vous voulez vérifier visuellement comment l'écran fonctionne pendant le débogage, etc., vous pouvez également l'utiliser sans spécifier cette option.

options = webdriver.ChromeOptions()
options.add_argument('--headless')

x. Ouvrir une nouvelle fenêtre de navigateur

Ensuite, ouvrez une nouvelle fenêtre de Selenium. Si le navigateur n'est pas en cours d'exécution à ce moment, il sera démarré.

Si vous utilisez Selenium Server tel qu'introduit dans la construction de l'environnement au début, utilisez la classe Remote et spécifiez le type de navigateur avec l'argument de désirées_capabilities. Dans cet exemple, ʻoptions contient l'objet ChromeOptions`, donc Chrome est spécifié.

# NOTE:Pour exécuter Selenium à distance, spécifiez le WebDriver distant comme suit:
driver = webdriver.Remote(
    command_executor='http://localhost:4444/wd/hub',
    desired_capabilities=options.to_capabilities(),
    options=options,
)

1. Visitez la page de profil Chanmoro de Qiita

Accédez à l'URL spécifiée en appelant la méthode get () de l'objet WebDriver.

driver.get('https://qiita.com/Chanmoro')

Vous pouvez accéder à l'URL actuellement affichée par la fenêtre avec current_url et au HTML affiché avec page_source.

print(driver.current_url)
print(driver.page_source)

2. Accédez à la deuxième page de la liste d'articles affichée dans "Articles récents"

Accédez à la deuxième page au bas des «Articles récents» sur l'écran de votre profil Cliquez sur le lien pour accéder à la page.

image.png

Dans Selenium, récupérez l'élément cible avec find_element comme indiqué ci-dessous, et cliquez en appelant click () pour cet élément. Ici, la balise a qui a l'attribut rel =" next " et contient la chaîne de caractères 2 est spécifiée et cliquée.

driver.find_element(By.XPATH, '//a[@rel="next" and text()="2"]').click()

En plus de XPath, Selenium vous permet de spécifier l'élément cible de différentes manières telles que le sélecteur CSS, la spécification d'ID, la spécification d'attribut de nom et la spécification de classe. Personnellement, j'aime le plus XPath car il peut tuer n'importe quel élément en un seul coup. C'est un peu délicat pour le premier moment jusqu'à ce que je m'habitue à l'écriture.

Dans cet exemple, XPath est écrit en spécifiant By.XPATH dans find_element (), mais la même chose est faite en spécifiant XPath en utilisantfind_element_by_xpath ().

Consultez ce document pour plus d'informations sur les méthodes de spécification des éléments. https://selenium-python.readthedocs.io/locating-elements.html

3. Obtenez l'URL du titre de l'article affiché au tout début de la deuxième page

Cette fois, nous obtiendrons plusieurs éléments spécifiés par find_elements (). Le find_element () utilisé au moment du clic ne retourne que le premier élément qui correspond à la condition spécifiée, mais find_elements () retourne un tableau d'éléments même s'il y a plusieurs correspondances.

Sur la page de profil, ʻItemLink__title` est donné à la classe de l'élément du titre de l'article dans la liste, donc je me suis appuyé dessus pour obtenir la liste des titres des articles.

article_links = driver.find_elements(By.XPATH, '//div[@class="ItemLink__title"]/a')

Vous pouvez utiliser text pour obtenir le texte écrit dans la balise de l'élément récupéré, et vous pouvez obtenir des attributs tels que href avecget_attribute ().

print(article_links[0].text)
print(article_links[0].get_attribute('href'))

x. Quittez le navigateur

Enfin, lorsque le processus est terminé, appelez quit () pour quitter le navigateur.

driver.quit()

Si vous oubliez d'appeler quit () lorsqu'une erreur se produit pendant le traitement de Selenium, le navigateur restera en marche et cela conduira à un bogue que la consommation de mémoire augmentera régulièrement, alors essayez- Assurez-vous de gérer l'erreur avec catch etc. et appelez toujours quit () à la fin du programme.

(Astuces) Créez un robot d'exploration avec Selenium

Le sélénium peut également être utilisé pour les applications de robot. Utilisez Selenium pour effectuer des opérations de dessin JavaScript et de clic sur des boutons, et utilisez un analyseur HTML pour obtenir les éléments de la page affichée.

Vous pouvez utiliser l'analyseur HTML fourni par Selenium lui-même pour l'analyse, mais il est recommandé d'utiliser une bibliothèque telle que BeautifulSoup car elle possède des fonctions utiles pour l'analyse et peut être implémentée de manière plus flexible.

Plus précisément, le HTML obtenu par driver.page_source est analysé et les données sont obtenues comme indiqué dans le code ci-dessous.

from bs4 import BeautifulSoup
from selenium import webdriver


options = webdriver.ChromeOptions()
options.add_argument('--headless')

driver = webdriver.Remote(
    command_executor='http://localhost:4444/wd/hub',
    desired_capabilities=options.to_capabilities(),
    options=options,
)

driver.get('https://qiita.com/Chanmoro')

#Créez un objet BeautifulSoup à partir du code HTML affiché dans le navigateur et analysez-le
soup = BeautifulSoup(driver.page_source, 'html.parser')

articles = soup.select('.ItemLink')
for article in soup.select('.ItemLink'):
    #Obtenez une liste des titres d'articles affichés sur votre page de profil
    print(article.select_one('.ItemLink__title a').get_text())

driver.quit()

Pour plus d'informations sur l'utilisation de Beautiful Soup, veuillez lire le merveilleux article "Belle soupe en 10 minutes"! (ennuyeux) https://qiita.com/Chanmoro/items/db51658b073acddea4ac

Résumé

En passant, dans cet article, j'ai présenté le paramètre d'environnement et l'utilisation de base de Selenium. Il est très facile de créer un environnement à l'aide de Docker, mais il n'est pas trop difficile de créer un environnement sur votre PC local, vous pouvez donc essayer l'une ou l'autre méthode immédiatement.

Selenium peut être utilisé non seulement pour automatiser les tests d'interface utilisateur et les opérations du navigateur, mais également pour explorer des sites comme SPA, qui est rendu avec JavaScript, comme je l'ai mentionné à la fin.

De plus, à des fins de test de l'interface utilisateur, il existe un mécanisme très utile appelé Selenium Grid qui vous permet d'exécuter des tests sur plusieurs types de navigateurs en même temps. Selenium Grid est un excellent mécanisme qui vous permet de regrouper plusieurs types de navigateurs tels que Chrome, Firefox, IE et plusieurs versions de navigateurs, et d'exécuter le même test en parallèle sur ces multiples navigateurs via Hub. est.

Selenium Grid facilite également la création d'un environnement à l'aide de docker, veuillez donc consulter la documentation de Selenium Grid et le fichier README de docker-selenium pour plus de détails. https://selenium.dev/documentation/en/grid/ https://github.com/SeleniumHQ/docker-selenium

En écrivant cet article, j'ai lu History of Selenium et j'ai appris que les ingénieurs de ThoughtWorks avaient d'abord créé le concept et les fonctionnalités de base de Selenium. Personnellement, je pense que c'est soudainement cool simplement parce qu'il a été fait par une personne de ThoughtWorks.

Il existe également une extension de navigateur très utile appelée Selenium IDE qui vous permet de déplacer manuellement le navigateur pour enregistrer et lire ses opérations, à savoir le Japon. Il semble qu'une personne Shinya Kasatani (@shinya) a été développée.

Selenium devrait avoir un impact révolutionnaire sur le développement d'applications Web, et il est vraiment étonnant qu'un tel logiciel ait été créé et publié en tant que OSS et soit largement utilisé dans le monde entier.

Maintenant, comprenons tous comment utiliser Selenium, reposons-nous sur les épaules de géants et vivons une vie d'automatisation de navigateur amusante aujourd'hui!

Recommended Posts

Comprendre en 10 minutes le sélénium
Le sélénium fonctionne en 15 minutes
[Python] pandas à bien comprendre en 10 minutes
Apprenez les pandas en 10 minutes
Grattage au sélénium en Python
Grattage avec du sélénium en Python
Je comprends Python en japonais!
Commencez dans 5 minutes GIMP Python-Fu
Scraping avec Selenium en Python (Basic)
Faisons l'expérience de BERT dans environ 30 minutes.
Gratter avec une belle soupe en 10 minutes
Ecrire le code de test du sélénium en python
Comprendre Kullback-Leibler parlé dans le modèle de génération
Rendre matplotlib compatible avec le japonais en 3 minutes
Comprendre les rouages et les extensions dans discord.py
Déployez Django en 3 minutes à l'aide de docker-compose
[Comprendre en 3 minutes] Le début de Linux
Implémenter et comprendre l'arborescence de recherche d'union dans Go
Je ne peux pas obtenir l'élément dans Selenium!
Tutoriel de clé externe de Django en 10 minutes
Captures d'écran de la pêche sur le Web avec du sélénium et Chrome.
Obtenez Cloud Logging disponible en Python en 10 minutes
[Python] Comprendre le fonctionnement des tranches de liste en quelques secondes