Selenium 網頁元件定位的基礎 (Python程式範例)
這篇文章主要以一個登入頁面說明 Selenium幾種網頁元件定位的方式
ID, Name, ClassName, Tag , LinkText, CSS, Xpath 等
當每個網頁元件被選取到的時候, 就用黃色框框閃爍,
最後會舉一個Python完整範例示範說明
測試情境
HTML範例
[pastacode lang=”markup” message=”” highlight=”” provider=”manual”]
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>Form</title>
<script type="text/javascript" async="" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" />
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
</head>
<body>
<h3>simple login form</h3>
<form class="form-horizontal">
<div class="control-group">
<label class="control-label" for="inputEmail">Email</label>
<div class="controls">
<input type="text" id="inputEmail" placeholder="Email" name="email">
</div>
</div>
<div class="control-group">
<label class="control-label" for="inputPassword">Password</label>
<div class="controls">
<input type="password" id="inputPassword" placeholder="Password" name="password">
</div>
</div>
<div class="control-group">
<div class="controls">
<label class="checkbox">
<input type="checkbox"> Remember me
</label>
<button type="submit" class="btn">Sign in</button>
<a href="#">register</a>
</div>
</div>
</form>
</body>
</html>[/pastacode]
Python程式範例
[pastacode lang=”python” message=”” highlight=”” provider=”manual”]
from selenium import webdriver
from time import sleep
import os
dr = webdriver.Chrome()
file_path = 'file:///' + os.path.abspath('form.html')
print file_path
dr.get(file_path)
# by id
dr.find_element_by_id('inputEmail').click()
dr.find_element_by_id('inputEmail').send_keys("myEmail@email.com")
# by name
dr.find_element_by_name('password').click()
dr.find_element_by_name('password').send_keys("MyPassword")
# by tagname
print dr.find_element_by_tag_name('form').get_attribute('class')
# by class_name
e = dr.find_element_by_class_name('controls')
dr.execute_script('$(arguments[0]).fadeOut().fadeIn()', e)
dr.execute_script('arguments[0].setAttribute("style", "color: yellow; border: 2px solid yellow;")', e)
sleep(1)
# by link text
link = dr.find_element_by_link_text('register')
dr.execute_script('$(arguments[0]).fadeOut().fadeIn()', link)
dr.execute_script('arguments[0].setAttribute("style", "color: yellow; border: 2px solid yellow;")', link)
sleep(1)
# by partial link text
link = dr.find_element_by_partial_link_text('regist')
dr.execute_script('$(arguments[0]).fadeOut().fadeIn()', link)
dr.execute_script('arguments[0].setAttribute("style", "color: red; border: 2px solid red;")', link)
sleep(1)
# by css selector
div = dr.find_element_by_css_selector('.controls')
dr.execute_script('$(arguments[0]).fadeOut().fadeIn()', div)
dr.execute_script('arguments[0].setAttribute("style", "color: yellow; border: 2px solid yellow;")', div)
sleep(1)
# by xpath
dr.find_element_by_xpath('/html/body/form/div[3]/div/label/input').click()
sleep(2)
dr.quit()[/pastacode]