0o酱

自动化测试：表单操作（7）

自动化测试：表单操作（7）

软件测试专题

前言

在自动化测试中，对于表单的操作是至关重要的。本文将介绍一些常见的表单操作技术，使你能够更好地应对测试中的表单交互。

知识点

  • 表单操作

    • 输入框操作

    • 单选框操作

    • 复选框操作

    • 下拉框操作

    • 文件上传处理

    • submit() 方法使用

  • 实例：使用 Selenium 进行表单操作

  • 实训：使用 Selenium 进行表单操作

表单操作

在自动化测试中，对表单的灵活操作是确保测试准确性和可靠性的关键。下面将介绍一些常见的表单操作技术，包括输入框、单选框、复选框、下拉框、文件上传处理以及 submit() 方法的使用。

输入框操作

输入框是用户与网页进行交互的主要方式之一。

在先前的章节中，我们已经介绍了如何使用 Selenium 模拟用户输入，此处使用的方法与之前相同，即使用 send_keys() 方法。

from selenium.webdriver.common.by import By

# 找到输入框元素
input_element = driver.find_element(By.ID, 'username')

# 在输入框中输入文本
input_element.send_keys('your_username')

单选框操作

单选框通常用于用户需要从一组互斥的选项中选择一个的情况。

在自动化测试中，我们可以直接定位到单选框元素，然后使用 click() 方法来选中单选框：

from selenium.webdriver.common.by import By

# 找到单选框元素
radio_button = driver.find_element(By.ID, 'male')

# 选中单选框
radio_button.click()

复选框操作

与单选框类似，复选框允许用户选择多个选项。

在自动化测试中，我们可以直接定位到复选框元素，然后使用 click() 方法来选中复选框：

from selenium.webdriver.common.by import By

# 找到复选框元素
checkbox = driver.find_element(By.ID, 'subscribe')

# 选中复选框
checkbox.click()

下拉框操作

下拉框（或选择框）是一种常见的表单元素，用户可以从中选择一个或多个选项。

在自动化测试中，我们可以使用 Selenium 的 Select 类来进行下拉框的操作：

from selenium.webdriver.support.ui import Select
from selenium.webdriver.common.by import By

# 找到下拉框元素
dropdown = driver.find_element(By.ID, 'country')

# 实例化 Select 对象
select = Select(dropdown)

# 选择下拉框中的选项
select.select_by_value('your_option_value')

Select 类提供了多种方法来选择下拉框中的选项，包括：

  • select_by_index()：通过选项的索引来选择选项。

  • select_by_value()：通过选项的值来选择选项。

  • select_by_visible_text()：通过选项的可见文本来选择选项。

文件上传处理

在网页中，文件上传是一种常见的表单操作。

通常情况下，上传文件的表单元素是一个 <input> 标签，其 type 属性值为 file。

我们可以直接定位到该元素，然后使用 send_keys() 方法向该元素发送文件路径，即可完成文件上传操作：

from selenium.webdriver.common.by import By

# 找到文件上传的输入框元素
file_input = driver.find_element(By.ID, 'fileUpload')

# 上传文件
file_input.send_keys('path/to/your/file.txt')

但有些网页会使用 JavaScript 或其他技术来隐藏文件上传的输入框元素，此时就需要第三方库来模拟文件上传操作。

submit() 方法使用

submit() 方法用于模拟用户点击表单的提交按钮。

通过找到表单元素，我们可以直接调用该元素的 submit() 方法：

from selenium.webdriver.common.by import By

# 找到表单元素
form_element = driver.find_element(By.ID, 'myForm')

# 提交表单
form_element.submit()

实例：使用 Selenium 进行表单操作

在配套网页——实训：使用 Selenium 进行表单操作 中，我们将演示如何使用 Selenium 进行表单操作。

打开配套网页

打开 实训：使用 Selenium 进行表单操作 网页：

如上图所示，网页中有一个表单，包含了文本输入（输入框）、单选框、复选框、下拉框、文件上传等表单元素。

在上传图片 (png, jpeg) 时，网页将显示图片：

在上传其他文件时，网页将显示 <a> 标签，地址指向上传的文件：

由于网页项目是无后端的，因此上传的文件不会真正保存到服务器上。

提交表单后，网页将显示表单中的数据：

编写脚本

1. 前置操作

from selenium import webdriver  # 导入 webdriver
from selenium.webdriver.common.by import By  # 导入 By
from selenium.webdriver.support.ui import Select  # 导入 Select

# 创建浏览器驱动
driver = webdriver.Chrome()

# 打开网页
driver.get("https://selenium-app.im0o.top/form-example")

2. 获取表单元素

# 获取表单元素
form_element = driver.find_element(By.XPATH, '//*[@id="app"]/div/form')

3. 向输入框中输入文本

# 获取输入框元素
input_element = driver.find_element(By.ID, 'textinput')

# 向输入框中输入文本
input_element.send_keys('这是内容')

4. 选择单选项

# 获取单选项元素
radio_button = driver.find_element(By.ID, 'radio-1')

# 选中单选项
radio_button.click()

5. 选择复选项

# 获取复选项元素
checkbox = driver.find_element(By.ID, 'checkbox-1')

# 选中复选项
checkbox.click()

6. 选择下拉框选项

# 获取下拉框元素
dropdown = driver.find_element(By.ID, 'select')

# 实例化 Select 对象
select = Select(dropdown)

# 选择下拉框中的选项
select.select_by_value('选项 2')

7. 上传文件

# 获取文件上传输入框元素
file_input = driver.find_element(By.ID, 'file')

# 上传 D:/test.txt 文件
file_input.send_keys('D:/test.txt')

8. 提交表单

# 提交表单
form_element.submit()

9. 关闭浏览器

# 关闭浏览器
driver.quit()

完整代码

from selenium import webdriver  # 导入 webdriver
from selenium.webdriver.common.by import By  # 导入 By
from selenium.webdriver.support.ui import Select  # 导入 Select

# 创建浏览器驱动
driver = webdriver.Chrome()

# 打开网页
driver.get("https://selenium-app.im0o.top/form-example")

# 获取表单元素
form_element = driver.find_element(By.XPATH, '//*[@id="app"]/div/form')

# 获取输入框元素
input_element = driver.find_element(By.ID, 'textinput')

# 向输入框中输入文本
input_element.send_keys('这是内容')

# 获取单选项元素
radio_button = driver.find_element(By.ID, 'radio-1')

# 选中单选项
radio_button.click()

# 获取复选项元素
checkbox = driver.find_element(By.ID, 'checkbox-1')

# 选中复选项
checkbox.click()

# 获取下拉框元素
dropdown = driver.find_element(By.ID, 'select')

# 实例化 Select 对象
select = Select(dropdown)

# 选择下拉框中的选项
select.select_by_value('选项 2')

# 获取文件上传输入框元素
file_input = driver.find_element(By.ID, 'file')

# 上传文件（文件不能不存在）
file_input.send_keys('D:/test.txt')
# 提交表单
form_element.submit()

input("按 Enter 键退出")

# 关闭浏览器
driver.quit()

运行脚本

实训：使用 Selenium 进行表单操作

在同样的页面中，请编写脚本，完成以下操作：

  1. 引入 By 类和 Select 类。

  2. 通过 ID 定位到输入框元素，向输入框中输入文本 Sample。

  3. 通过 XPATH 定位到第二个单选框元素，选中该单选框。

  4. 通过 XPATH 定位到第二、三个复选框元素，选中这两个复选框。

  5. 通过 ID 定位到下拉框元素，选择第三个选项。

  6. 定位到文件上传输入框元素，上传任意 jpeg/png 文件。

  7. 定位到表单元素并提交表单。

  8. 获取跳转后的内容，输出到控制台。

提示

  1. 对于下拉框，使用 Select 类的方法进行选项选择。

  2. 文件上传时，使用 send_keys 方法发送文件路径，确保文件存在。

参考答案

点击展开 
from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import Select

# 创建浏览器驱动
driver = webdriver.Chrome()

# 打开网页
driver.get("https://selenium-app.im0o.top/form-example")

# 通过 ID 定位到输入框元素，向输入框中输入文本 `Sample`
input_element = driver.find_element(By.ID, 'textinput')
input_element.send_keys('Sample')

# 通过 XPATH 定位到第二个单选框元素，选中该单选框
radio_button = driver.find_element(By.XPATH, '//*[@id="radio-2"]')
radio_button.click()

# 通过 XPATH 定位到第二、三个复选框元素，选中这两个复选框
checkbox1 = driver.find_element(By.XPATH, '//*[@id="checkbox-2"]')
checkbox2 = driver.find_element(By.XPATH, '//*[@id="checkbox-3"]')
checkbox1.click()
checkbox2.click()

# 通过 ID 定位到下拉框元素，选择第三个选项
dropdown = driver.find_element(By.ID, 'select')
select = Select(dropdown)
select.select_by_value('选项 3')

# 定位到文件上传输入框元素，上传任意 `jpeg/png` 文件
# 此处请根据实际情况修改文件路径
file_input = driver.find_element(By.ID, 'file')
file_input.send_keys("D:\\UserData\\Pictures\\icon\\smile.png")

# 定位到表单元素并提交表单
form_element = driver.find_element(By.XPATH, '//*[@id="app"]/div/form')
form_element.submit()

# 获取跳转后的内容，输出到控制台
result_element = driver.find_element(By.ID, 'form-example-result')
print(result_element.text)

input("按 Enter 键退出")

# 关闭浏览器
driver.quit()

At Last

头图/封面素材来源：Photo by Kelly Sikkema on Unsplash

评论

评论加载中…

© 2019 - 2025 0o酱. All rights reserved.

输入关键词开始搜索。

选择Enter 打开Esc 关闭CtrlK 唤起

Cookie 设置

本站不使用第三方 Cookie