如何用page-object配合Cucumber写出BDD风格的UI测试

如何用page-object配合Cucumber写出BDD风格的UI测试【免费下载链接】page-objectGem to implement PageObject pattern in watir-webdriver and selenium-webdriver项目地址: https://gitcode.com/gh_mirrors/pa/page-objectpage-object是一款经典的 Ruby 页面对象模式实现库能让你的 UI 自动化测试代码与页面结构彻底解耦。本文将以Cucumber page-object为例手把手教你搭建一套可读性强、易于维护的BDD 风格 UI 测试即使你从未写过 Ruby 测试也能在半小时内跑通第一个场景。无论是基于 Watir 还是 Selenium WebDriverpage-object 都能无缝支持是新手入门 UI 自动化的理想选择。为什么 BDD 风格 UI 测试要用 page-object很多测试新手习惯把元素定位、操作逻辑直接堆在 Step Definitions 里结果脚本越写越长、改一个按钮 ID 就要全局搜索替换。BDD 的核心思想是用业务语言描述行为而page-object页面对象模式正是把页面上有什么、能做什么封装成独立类让测试步骤只关心业务动作不关心 HTML 细节。page-object 的三大好处解耦页面结构调整时只需改页面类测试用例零改动可读Cucumber 特性文件像需求文档业务人员也能看懂♻️复用同一页面对象可供多个场景共享大幅减少重复代码第一步快速安装 page-object 测试环境安装 page-object 非常简单你只需要 Ruby 环境和两个 gemgem install page-object gem install cucumber gem install watir # 或 gem install selenium-webdriver如果你要克隆项目源码自己研究可以执行git clone https://gitcode.com/gh_mirrors/pa/page-object安装完成后在测试入口文件如features/support/env.rb中引入依赖并注册页面工厂参考项目中的 env.rb 写法require page-object World(PageObject::PageFactory)World注册后你就能在所有 Step Definitions 中直接使用visit_page、on_page等快捷方法。第二步用 page-object 定义页面对象页面对象的核心就是一个页面一个类。以登录页为例在类中声明元素访问器即可class LoginPage include PageObject page_url http://example.com/login text_field(:username, id: username) text_field(:password, id: password) button(:login, value: 登录) def login_with(name, pwd) self.username name self.password pwd login end end仅仅三行声明page-object 就为你自动生成了username、password、login、username_element等一系列方法你完全不需要手写 find_element。项目的 page.rb 就是一份真实的大型示例展示了文本框、复选框、下拉框、表格等几十种元素的声明方式非常适合照抄模仿。page_url会额外生成goto方法用于打开页面。还支持expected_title、expected_element等校验方法可以在页面加载完成后自动验证是否进入正确页面。第三步编写 BDD 风格的 Cucumber 特性文件BDD 的关键是特性文件要像人话。参考项目中的 check_box.feature一个场景可以这样写功能: 登录 背景: 假如 我在登录页面 场景: 使用正确账号密码登录成功 当 我输入用户名 cheezy 和密码 secret 并且 我点击登录按钮 那么 我应该看到欢迎信息注意特性文件里绝不出现id、xpath 等元素定位信息只用业务词汇描述这正是 BDD 风格的 UI 测试与普通自动化脚本的最大区别。第四步编写 Step Definitions 调用页面对象接下来把业务语言翻译成页面对象动作。因为 PageFactory 已注册可以这样写假如(/^我在登录页面$/) do visit_page LoginPage end 当(/^我输入用户名 ([^]*) 和密码 ([^]*)$/) do |user, pwd| on_page(LoginPage).login_with user, pwd end 当(/^我点击登录按钮$/) do on_page(LoginPage).login end 那么(/^我应该看到欢迎信息$/) do on_page(HomePage) do |page| expect(page.welcome_message).to include 欢迎 end endvisit_page负责打开页面并返回页面对象on_page负责在已打开的页面上执行操作并自动把当前页面对象缓存到current_page中。项目中的 check_box_steps.rb 展示了完整的步骤定义示例可以看到每个步骤都极其简短。第五步用 PageFactory 管理页面跳转进阶当测试流程跨多个页面时navigate_to可以帮你按预设路由自动跳转。在env.rb中定义路由表PageObject::PageFactory.routes { default: [ [LoginPage, :login_with, cheezy, secret], [HomePage, :goto] ] }然后在步骤中一句navigate_to HomePage就能按路由自动完成前置操作具体实现可查阅 page_factory.rb。这一技巧在长流程回归测试中能显著减少重复代码。第六步让测试更健壮的三个小技巧统一等待策略page-object 内置wait_until和wait_for_ajax方法见 page-object.rb处理异步加载页面时非常可靠批量填充表单用populate_page_with方法一次传入 Hash 即可批量填写文本框、下拉框和勾选复选框实现细节在 page_populator.rb面向对象封装业务动作像login_with这样把多步操作封装成高层方法是页面对象模式的最佳实践能让步骤定义保持一行一个动作总结page-object 配合 Cucumber 的组合本质上是页面对象模式 BDD 框架的黄金搭档Cucumber 负责把测试写成需求文档page-object 负责把页面封装成可复用的对象两者结合后你的 UI 测试会变得像文档一样清晰、像积木一样易拼装。从一个小登录页开始尝试吧相信你会很快爱上这种 BDD 风格的 UI 测试方式。【免费下载链接】page-objectGem to implement PageObject pattern in watir-webdriver and selenium-webdriver项目地址: https://gitcode.com/gh_mirrors/pa/page-object创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考