前言
WebdriverIO (即 wdio) 是一个Node.js的智能自动化测试框架，该框架为用户带来了优美的编写UI自动化的api和链式语法，专注于优化开发者的持续集成和持续交付测试，是前端自动化测试必备框架之一。
安装
使用以下命令在你的项目中安装WebdriverIO：
- -- --- -- --- ---- -- --- ------- -----------
使用
配置
配置文件，可以帮助我们在文件头部设置默认的driver对象，添加各种hooks，同时可以方便的管理我们的浏览器进程等。
在项目根目录下创建 wdio.conf.js 的配置文件，点击这里学习如何配置自己的 WebdriverIO。
编写测试用例
- 导入模块
首先，我们需要导入
webdriverio模块以及它的浏览器驱动程序。同时为了了解更多api的使用，我们可以将其它常用模块导入。
----- ------ - ----------------- ----- - ------ - - ----------------------
- 启动 Selenium Server 在使用 WebdriverIO 前，需要通过 WebdriverIO 的 API 初始化RemoteWebDriver对象，并启动浏览器。为了便于控制浏览器，我们需要借助Selenium Server启用之。
----- ------- - ----- --------
--------- --------
------------- -
------------ --------
--
----- -----
----- ---
--- WebdriverIO API 接着，就可以使用 WebdriverIO 的 API 编写测试用例了。
- 打开网站
----- -----------------------------------
- 查找元素
----- ---- - ----- ----------------------
- 对元素进行操作
----- ------------
- 断言
----- ----- - ----- ------------------ ------------------------- ------------ - -------- ------- --- ------ ---------- ---- --------- --- ------- - -------------
- 结束 注意及时释放资源，确保Selenium Server和浏览器正常退出。
----- -----------------------
立即执行
在 wdio.conf.js 的 specs 属性中指定测试文件的路径。使用以下命令可以立即开始工作：
------------------------ ------------
注意查看控制台输出，当然为了更好的体验一般会打开生产环境的web页面来运行，这里就不再赘述。
使用示例
我们使用UI库 Ant Design 在 http://localhost:8000/login 页面中测试。具体的代码逻辑如下：
------------------ ---------- -
------------ ----- ---------- -
----- ------------------------------------------
--
------------- ----- ---------- -
----- ------------ - ----- ----------------------
----- ------------ - ----- ----------------------
----- ---------- - ----- ----------------------------------
----- -----------------------------
----- ------------------------------
----- -----------------------------
----- -------------------------------
----- ---------------------------
----- ------------------
--
------------ ----- ---------- -
----- ---------- - ----- -------------------------
----- ---- - ----- --------------------
------------------------ -------
--
--通过本文的介绍，相信你已经可以使用 WebdriverIO 对你的前端系统进行自动化测试啦。快去试试吧！
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/5f216bcc403f2923b035c6a7