尧图网站建设 尧图网络
  • 首页
  • 关于我们
  • 服务项目
  • 案例展示
  • 建站流程
  • 资讯中心
  • 联系我们
首页/资讯中心/详情

Web UI 自动化测试 Skill 完整实战:从一个空项目到一份中文测试报告

Web UI 自动化测试 Skill 完整实战:从一个空项目到一份中文测试报告
📅 发布时间:2026/6/20 19:13:11

关注 霍格沃兹软件测试开发 公众号,回复「资料」, 领取人工智能测试开发技术合集

去年这个时候,我帮一个团队做了一次技术评审。他们的自动化用例有八百多条,但每次跑完,开发团队基本不看报告——太长了,全是英文堆砌,失败原因写着“Element not found”,没人知道是定位器变了还是页面没加载完。

上个月再见到他们,自动化用例已经砍到两百条,但通过率从72%涨到了94%。问他们怎么做到的,负责人说了一句话:“我们把重心从'写用例'挪到了'搭框架'。”

这件事让我想明白了一个道理:Web UI 自动化测试的问题,从来不是会不会写脚本。问题是你有没有一个能让你安心写脚本的框架。

目录

一、从零开始,到底需要什么

二、选 Selenium 还是 Playwright,本质是选一种工程方式

三、框架的核心机制,拆开看就三件事

四、一个真实的对比:有框架 vs 没框架

五、报告不只是给测试看的

六、你的框架,现在卡在哪一层?

一、从零开始,到底需要什么
很多人觉得 Web UI 自动化就是“打开浏览器、点按钮、填表单、关浏览器”。这话没错,但只对了一半。

真正从零开始搭一套能用的自动化框架,你需要回答的问题远不止这些:

测试代码放哪?页面元素怎么管理?不同浏览器怎么切换?测试数据写死在脚本里还是外置?跑完的测试结果谁来存?报告长什么样?失败了怎么定位?

这些问题不解决,写再多用例也是给自己挖坑。

自动化测试就像一个不知疲倦的测试助手,能自动执行预设用例、精准捕获异常、生成测试报告。但前提是——你得先把它的“工作环境”搭好。

二、选 Selenium 还是 Playwright,本质是选一种工程方式
这是每个从零开始的人都会遇到的第一个选择。

Selenium 是老牌选手,支持几乎所有编程语言,生态成熟。但它的代价是:你得单独下载浏览器驱动,版本还得跟浏览器严格匹配。每次 Chrome 自动更新,你的 CI 就可能挂掉一批用例。

Playwright 是微软开源的新一代框架,原生支持 Chromium、Firefox 和 WebKit 三大浏览器引擎。它的核心差异在于:采用进程外通信模型,通过 WebSocket 协议与浏览器驱动交互,而不是 Selenium 那种 HTTP 协议。这意味着更低的延迟和更稳定的连接。

Playwright 的“开箱即用”体验非常明显。你不需要单独装驱动,框架自己管理浏览器版本。内置的智能等待机制能自动检测元素的可交互状态——比如是否可见、是否可点击、是否被遮挡。你不再需要写一堆 time.sleep() 和 WebDriverWait。

选哪个?我的判断是:新项目直接用 Playwright,维护中的老项目继续用 Selenium。 这不是技术优劣的问题,是工程成本的问题。

三、框架的核心机制,拆开看就三件事
不管用哪个工具,一个可维护的 Web UI 自动化框架,核心就是三件事。

第一,页面对象模型(Page Object Model)
这是 UI 自动化里最经典的设计模式。每个页面封装成一个类,类里包含这个页面的元素定位和操作方法。测试用例只调用这些封装好的方法,不直接写定位器。

好处是什么?页面改了,你只改一个文件。而不是去几十个用例里找定位器。

第二,分层架构
测试代码、页面操作、配置数据,三层分开。

测试层放用例逻辑,页面层封装元素操作,配置层管环境地址、账号密码、浏览器选项这些可变的东西。三层之间通过接口调用,不互相依赖实现细节。

第三,等待策略
这是新手最容易踩的坑。元素还没加载完就开始操作,用例就挂了。

Playwright 的做法是:每个操作(click、fill)都内置智能等待,自动等到元素可操作为止。你不用手动加等待,框架替你处理。

080bb679-eb87-4b65-a9b1-f9cf356523e9

这三件事做扎实了,框架就有了骨架。剩下的就是往里填用例。

四、一个真实的对比:有框架 vs 没框架
同一个登录功能的测试,两种写法。

没框架的写法(新手常见) :

from selenium import webdriver
import time

driver = webdriver.Chrome()
driver.get("https://example.com/login")
time.sleep(3)
driver.find_element_by_id("username").send_keys("testuser")
time.sleep(1)
driver.find_element_by_id("password").send_keys("123456")
time.sleep(1)
driver.find_element_by_id("login-btn").click()
time.sleep(2)
assert"Welcome"in driver.page_source
driver.quit()
这段代码能跑,但问题一堆:到处是 time.sleep,定位器散落在脚本里,换个页面就要重写。

有框架的写法(Page Object) :

login_page.py

class LoginPage:
def init(self, page):
self.page = page
self.username = page.get_by_label("用户名")
self.password = page.get_by_label("密码")
self.login_btn = page.locator("text=登录")

def login(self, user, pwd):
self.username.fill(user)
self.password.fill(pwd)
self.login_btn.click()

test_login.py

def test_login_success(login_page):
login_page.login("testuser", "123456")
expect(login_page.page).to_have_url("/dashboard")
区别在哪儿?前者把逻辑和细节混在一起,后者把细节封装起来。页面改了,你只需要改 login_page.py,测试用例一行不动。

这就是框架的价值——不是为了写得快,是为了改得快。

五、报告不只是给测试看的
很多团队的测试报告长这样:一个巨大的 HTML 文件,满屏英文,失败信息写着“AssertionError”。

这种报告,开发不看,产品不看,只有测试自己硬着头皮翻。

一份能用的报告,至少要做到三件事。

中文。 不是崇洋媚外,是降低阅读门槛。Allure 支持定制报告语言为中文。团队成员不需要懂英文也能看懂测试结果。

截图。 失败用例自动截图,附在报告里。开发拿到报告第一眼就知道页面长什么样,不用再去复现。

步骤清晰。 报告里能看到每一步执行了什么操作、传了什么参数、在哪个环节失败的。定位问题的时间从小时级降到分钟级。

Allure 是目前最成熟的方案。它支持绝大多数测试框架,能生成美观的可视化报告。配置不复杂,半小时能搞定。

报告做好,自动化测试的价值才能被团队看见。

六、你的框架,现在卡在哪一层?
从零到一搭一套 Web UI 自动化框架,技术门槛其实不高。Python 加 Playwright,半小时就能跑通第一个用例。

真正的门槛在后面——当你的用例从 10 条涨到 100 条的时候,框架还能不能撑住?

页面对象有没有规范?元素定位有没有统一策略?测试数据有没有外置?报告有没有人看?失败用例有没有人跟进?

这些问题,比“会不会写脚本”重要得多。

很多团队的自动化停在“能跑”的阶段,就因为只关注了“怎么写”,没关注“怎么长”。

你的框架,现在卡在哪一层?

是还没开始搭?是搭了一半发现维护不动?还是跑起来了但没人看报告?

欢迎在评论区聊聊你踩过的坑。

推荐学习
软件测试开发快速落地智能化测试公开课,从Web/App/接口测试智能体,再到业务测试用例生成,爱测智能化测试平台,手把手带你掌握AI智能体与智能化测试平台!

👇扫码进群,报名学习!

image

关于我们
霍格沃兹测试开发学社,隶属于 测吧(北京)科技有限公司,是一个面向软件测试爱好者的技术交流社区。

学社围绕现代软件测试工程体系展开,内容涵盖软件测试入门、自动化测试、性能测试、接口测试、测试开发、全栈测试,以及人工智能测试与 AI 在测试工程中的应用实践。

我们关注测试工程能力的系统化建设,包括 Python 自动化测试、Java 自动化测试、Web 与 App 自动化、持续集成与质量体系建设,同时探索 AI 驱动的测试设计、用例生成、自动化执行与质量分析方法,沉淀可复用、可落地的测试开发工程经验。

在技术社区与工程实践之外,学社还参与测试工程人才培养体系建设,面向高校提供测试实训平台与实践支持,组织开展 “火焰杯” 软件测试相关技术赛事,并探索以能力为导向的人才培养模式,包括高校学员先学习、就业后付款的实践路径。

同时,学社结合真实行业需求,为在职测试工程师与高潜学员提供名企大厂 1v1 私教服务,用于个性化能力提升与工程实践指导。

相关新闻

  • 3步搞定B站抢票难题:biliTickerBuy终极使用指南
  • 2026效率榜!好用的降AIGC工具实测,效率直接拉满!
  • 2026年10款论文降AIGC网站亲测:从90%降至10%的宝藏之选 - 降AI小能手

最新新闻

  • 智能体资源激增,智能体资源发现规范(ARD)如何解决发现难题?
  • Windows和Office激活难题终极解决方案:KMS智能激活脚本完整指南
  • 2026香港装修公司哪家好?设计情报中心值得推荐 - 资讯速览
  • Unity Mod Manager:游戏模组管理的终极技术架构解决方案
  • LVGL布局进阶:从Flex到Grid构建复杂界面
  • 2026年AI生产力实操地图:四类高鲁棒性工具落地指南

日新闻

  • 信任的进化:技术实现详解——如何用JavaScript构建博弈论模拟器
  • Terrakube自定义工作流:如何集成OPA、Infracost等工具扩展IaC能力
  • grunt-concurrent快速入门:5分钟学会并行运行Grunt任务

周新闻

  • 3步解锁iOS设备:applera1n激活锁绕过完全指南
  • 39 2026 人工智能证书终极盘点,普通人选 AI 证书可以从这些方向入手
  • Redis 暴露公网有多危险?从端口检查到补救步骤

月新闻

  • 【总结】入门篇:50句话让你记住架构核心概念
  • WeChatMsg技术方案解析:实现Mac微信数据自主管理的完整解决方案
  • WeChatMsg:革新性微信数据备份方案,打造你的专属数字记忆库

关于尧图

  • 公司简介
  • 团队介绍
  • 企业文化
  • 荣誉资质

服务项目

  • 定制开发
  • 电商建站
  • UI 设计
  • 运维服务

快速链接

  • 案例展示
  • 建站流程
  • 常见问题
  • 资讯中心

联系方式

  • 📍北京市朝阳区互联网产业园 A 座 10 层
  • 📞400-888-8888
  • ✉️contact@rkmt.cn
  • 🕐周一至周日 9:00-21:00

© 2024 北京尧图网络科技有限公司 版权所有 | 京 ICP 备 XXXXXXXX 号