# Selenium with Python
# 基本介紹
模擬使用者操作網站的過程
# 前置作業 Install
* https://www.selenium.dev/documentation/webdriver/getting_started
* https://selenium-python.readthedocs.io/installation.html
## Install Python
```bash
❯ python3 abc.py
Hello World
```
## Install Selenium
https://pypi.org/project/selenium/
```bash
❯ python3 -m pip install selenium
```
Check if you have install selenium correct
```bash
❯ python3 -m pip list | grep selenium
selenium 4.7.2
```
## Install ChromeDriver
https://chromedriver.chromium.org/
檢查chrome的版本，在url裡面輸入`chrome://settings/help`
> Version 108.0.5359.124 (Official Build) (64-bit)
1. Put your python file with chromedriver
```bash
❯ pwd
/usr/local/google/home/chiaweichang/Downloads/test
❯ python3 -m pip list selenium
❯ ls -l
total 14136
-rwxr-xr-x 1 chiaweichang primarygroup 14468280 Nov 29 09:18 chromedriver
-rw-r--r-- 1 chiaweichang primarygroup 141 Jan 12 15:30 myfirstselenium.py
```
## Try to use selenium
```python
from selenium import webdriver
# from time import sleep
driver = webdriver.Chrome("./chromedriver")
driver.get("http://www.python.org")
# sleep(10)
driver.quit()
```
Using **with**
``` python
from selenium import webdriver
from time import sleep
with webdriver.Chrome("./chromedriver") as driver:
driver.get("http://www.python.org")
# sleep(10)
```
# Demo
## Html
* Run by `python -m http.server`
* http://127.0.0.1:8000/
``` xml
<!DOCTYPE html>
<script>
function myFunction() {
document.getElementById("button").innerHTML = "Login Successful";
}
</script>
<html>
<body>
<h1>Text, Passwd, Button</h1> username: <input type="text" id="username" value="12345678" />
<br> password: <input type="password" id="password" />
<br>
<button id="button" onclick="myFunction()">Login</button>
<br>
<h1>Checkbox</h1>
<div>
<input type="checkbox">checkbox 1 <br>
<input type="checkbox">checkbox 2 <br>
<input type="checkbox">checkbox 3 <br>
<input type="checkbox">checkbox 4 <br>
</div>
<h1>Radio</h1>
<div id=radio>
<input name="r" type="radio">radio 1 <br>
<input name="r" type="radio">radio 2 <br>
<input name="r" type="radio">radio 3 <br>
<input name="r" type="radio">radio 4 <br>
</div>
<h1>File upload</h1>
<input id="file" type="file">upload file1 <br>
<input id="file" type="file">upload file2 <br>
<h1>Select</h1>
<select name="pets">
<option value="">Animal</option>
<option value="dog">Dog</option>
<option value="cat" selected>Cat</option>
<option value="hamster">Hamster</option>
<option value="parrot">Parrot</option>
<option value="spider" disabled>Spider</option>
<option value="goldfish">Goldfish</option>
</select>
</body>
</html>
```
## Text, Passwd, Button
``` python
from selenium import webdriver
from selenium.webdriver.common.by import By
# from time import sleep
url = "http://127.0.0.1:8000"
with webdriver.Chrome("./chromedriver") as driver:
driver.get(url)
# sleep(1)
element = driver.find_element(By.ID, "username")
# print(element.get_attribute("value"))
# sleep(1)
element.clear()
# sleep(1)
element.send_keys("username")
# sleep(1)
element = driver.find_element(By.ID, "password")
element.send_keys("username")
# sleep(1)
element = driver.find_element(By.TAG_NAME, "button")
element.click()
# sleep(1)
```
# Checkbox
``` python
from selenium import webdriver
from selenium.webdriver.common.by import By
# from time import sleep
url = "http://127.0.0.1:8000"
with webdriver.Chrome("./chromedriver") as driver:
driver.get(url)
elements = driver.find_elements(By.XPATH, "//div[1]/input")
for e in elements:
print(e.is_selected())
e.click()
print(e.is_selected())
# sleep(1)
```
# Radio
``` python
from selenium import webdriver
from selenium.webdriver.common.by import By
# from time import sleep
url = "http://127.0.0.1:8000"
with webdriver.Chrome("./chromedriver") as driver:
driver.get(url)
element = driver.find_element(By.ID, "radio")
elements = element.find_elements(By.TAG_NAME, "input")
for e in elements:
print(e.is_selected())
e.click()
print(e.is_selected())
# sleep(1)
```
# File upload
``` python
from pathlib import Path
from selenium import webdriver
from selenium.webdriver.common.by import By
# from time import sleep
url = "http://127.0.0.1:8000"
with webdriver.Chrome("./chromedriver") as driver:
driver.get(url)
element = driver.find_element(By.ID, "file")
# element.click() # this is wrong
file_path = Path("selenium.png").resolve()
element.send_keys(str(file_path))
# sleep(5)
```
# Select
``` python
from selenium import webdriver
from selenium.webdriver.common.by import By
from time import sleep
from selenium.webdriver.support.ui import Select
url = "http://127.0.0.1:8000"
with webdriver.Chrome("./chromedriver") as driver:
driver.get(url)
sleep(1)
select_element = driver.find_element(By.NAME, 'pets')
select = Select(select_element)
print(select.options)
print(select.all_selected_options)
select.select_by_visible_text('Parrot')
sleep(1)
select.select_by_visible_text('Dog')
sleep(5)
```
# Finding web elements 操作手法
https://www.selenium.dev/documentation/webdriver/elements/interactions/
* click (applies to any element)
* send keys (only applies to text fields and content editable elements)
* clear (only applies to text fields and content editable elements)
* submit (only applies to form elements)
* select (see Select List Elements)
# Information about web elements 查看資訊
https://www.selenium.dev/documentation/webdriver/elements/information/
# Finding web elements 如何找元素
https://www.selenium.dev/documentation/webdriver/elements/finders/
```python
find_element(By.ID, "id")
find_element(By.NAME, "name")
find_element(By.XPATH, "xpath")
find_element(By.LINK_TEXT, "link text")
find_element(By.PARTIAL_LINK_TEXT, "partial link text")
find_element(By.TAG_NAME, "tag name")
find_element(By.CLASS_NAME, "class name")
find_element(By.CSS_SELECTOR, "css selector")
```
## 招式一 select an element in the page to inspect it (Ctrl + Shift + c)
## 招式二 Ruto - XPath Finder
[Ruto - XPath Finder](https://chrome.google.com/webstore/detail/ruto-xpath-finder/ilcoelkkcokgeeijnopjnolmmighnppp)
## 招式三 XPath Helper
[XPath Helper](https://chrome.google.com/webstore/detail/xpath-helper/hgimnogjllphhhkhlmebbmlgjoejdpjl/related)
1. Ctrl-Shift-X to open the XPath Helper console
2. Hold down Shift as you mouse over elements on the page.
# Learn more
1. [Page Object](https://selenium-python.readthedocs.io/page-objects.html)
2. Test framework([unittest](https://docs.python.org/3/library/unittest.html), [pytest](https://docs.pytest.org/en/7.2.x/), [nose](https://nose.readthedocs.io/en/latest/))
3. [Remote WebDriver](https://selenium-python.readthedocs.io/getting-started.html#using-selenium-with-remote-webdriver)
# 參考資源
* [selenium 官方網站](https://www.selenium.dev/documentation/)
* [selenium-python.readthedocs.io](https://selenium-python.readthedocs.io/index.html)
Sign in with Wallet
Connect another wallet