在现代软件开发中，自动化测试已成为保障软件质量的关键环节。而在众多测试框架中，WebdriverIO凭借其强大的功能和简洁的语法，成为Node.js生态中备受瞩目的浏览器和移动自动化测试框架。那么，WebdriverIO究竟有哪些独特之处，它如何助力开发者实现高效的自动化测试？
什么使WebdriverIO脱颖而出，成为下一代浏览器和移动自动化测试的首选？它有哪些核心功能和优势？
1、前言
web自动化测试工具Selenium支持多种语言，如Python、Java、Ruby、JavaScript等，大多数测试人员使用最多的语言就是Python、Java了，并且很多技术社区与网上的学习资料查找起来很方便，很容易上手。但对于其他语言，比如JavaScript，相对来说资源就少很多了，针对JavaScript本篇将介绍一款在Node.js环境下的web与移动自动化测试框架 - WebdriverIO。
2、简介
WebdriverIO是一个测试自动化框架，用于e2e以及浏览器中的单元和组件测试，它允许你运行基于WebDriver和WebDriver BiDi以及Appium自动化技术的测试。为BDD/TDD测试框架提供支持，并将使用Sauce Labs、BrowserStack、TestingBot或LambdaTest在本地或云端运行测试。
WebdriverIO是一个先进的自动化框架，专为现代网络和移动应用的自动化而设计。它简化了与应用的交互，并提供了一系列插件，帮助你构建可扩展、健壮且稳定的测试套件。
功能特点：
-
可扩展：添加助手函数或更复杂的命令集和组合。
-
兼容性：WebdriverIO可以在WebDriver协议上运行以进行真正的跨浏览器测试，也可以在Chrome DevTools协议上运行，以使用Puppeter实现基于Chrome的自动化。
-
功能性：各种内置和社区插件允许你轻松集成和扩展设置，以满足你的需求。
你可以使用WebdriverIO进行自动化：
-
用React、Vue、Angular、Svelte或其他前端框架编写的web应用程序。
-
在模拟器或真实设备上运行的混合或本机移动应用程序。
-
本机桌面应用程序（例如，使用Electron.js编写）。
-
在浏览器中对web组件进行单元或组件测试。
官方网址：
https://webdriver.io/
3、安装
代码库包含了WebdriverIO项目的一些核心包。WebdriverIO社区整理了许多精选资源。
以下列举比较典型的代码库。
1、核心包：
webdriver - W3C WebDriver和Mobile JSONWire协议的Node.js绑定实现。
github地址：
https://github.com/webdriverio/webdriverio/tree/main/packages/webdriver
webdriverio - Node.js的下一代浏览器和移动自动化测试框架。
github地址：
https://github.com/webdriverio/webdriverio/tree/main/packages/webdriverio
@wdio/cli - WebdriverIO testrunner命令行界面。
github地址：
https://github.com/webdriverio/webdriverio/tree/main/packages/wdio-cli
2、报告包：
@wdio/allure-reporter - 用于创建allure测试报告的WebdriverIO报告插件。
github地址：
https://github.com/webdriverio/webdriverio/tree/main/packages/wdio-allure-reporter
@wdio/junit-reporter - 以XML格式创建测试结果的WebdriverIO报告插件。
github地址：
https://github.com/webdriverio/webdriverio/tree/main/packages/wdio-junit-reporter
3、服务包：
@wdio/appium-service - 用于启动和停止Appium服务器的WebdriverIO服务。
github地址：
https://github.com/webdriverio/webdriverio/tree/main/packages/wdio-appium-service
@wdio/lighthouse-service - WebdriverIO服务，集成了Google Lighthouse命令以将其用于自动化测试。
github地址：
https://github.com/webdriverio/webdriverio/tree/main/packages/wdio-lighthouse-service
@wdio/firefox-profile-service - WebdriverIO服务，允许你在wdio.conf.js中定义Firefox配置文件。
github地址：
https://github.com/webdriverio/webdriverio/tree/main/packages/wdio-firefox-profile-service
4、框架包：
@wdio/cucumber-framework - cucumber测试框架适配器。
github地址：
https://github.com/webdriverio/webdriverio/tree/main/packages/wdio-cucumber-framework
@wdio/jasmine-framework - jasmine测试框架适配器。
github地址：
https://github.com/webdriverio/webdriverio/tree/main/packages/wdio-jasmine-framework
@wdio/mocha-framework - mocha测试框架适配器。
github地址：
https://github.com/webdriverio/webdriverio/tree/main/packages/wdio-mocha-framework
4、快速上手
安装核心包webdriverio
此软件包提供了一个易于管理的API和大量基于WebDriver规范的语法。你可以将 WebdriverIO 作为独立软件包使用，或通过@wdio/cli在测试运行器中使用。WebdriverIO允许你使用WebDriver本地运行测试，也可以通过像Sauce Labs这样的云提供商使用远程用户代理进行测试。
npm install webdriverio默认情况下，WebdriverIO使用Puppeteer自动化浏览器，如Chrome、Firefox或Chromium Edge。
官方示例：启动一个Chrome浏览器，并获取页面的标题。
import { remote } from 'webdriverio'
const browser = await remote({
capabilities: { browserName: 'chrome' }
})
await browser.navigateTo('https://www.google.com/ncr')
const searchInput = await browser.$('#lst-ib')
await searchInput.setValue('WebdriverIO')
const searchBtn = await browser.$('input[value="Google Search"]')
await searchBtn.click()
console.log(await browser.getTitle()) // outputs "WebdriverIO - Google Search"
await browser.deleteSession()
-
WebdriverIO的核心功能
- 观点：WebdriverIO是一款基于Node.js的开放源代码测试框架，支持多种浏览器和移动设备测试。其核心功能包括与Selenium的无缝集成、强大的插件系统和丰富的API。
const { remote } = require('webdriverio');
(async () => {
const browser = await remote({
capabilities: { browserName: 'chrome' }
});
await browser.url('https://example.com');
const title = await browser.getTitle();
console.log('Title:', title);
await browser.deleteSession();
})();
-
与Selenium的无缝集成
- 观点：WebdriverIO与Selenium无缝集成，利用Selenium WebDriver协议进行操作，确保兼容性和稳定性，同时提供更简洁的API和更高效的测试执行。
- 案例：通过WebdriverIO与Selenium Grid的集成，进行分布式测试，提高测试效率和覆盖率。
-
强大的插件系统
- 观点：WebdriverIO拥有丰富的插件系统，支持各种测试工具和框架，如Mocha、Jasmine、Cucumber等，极大地扩展了其功能和应用场景。
- 案例：在WebdriverIO中使用Mocha进行行为驱动开发（BDD）测试：
describe('My Google Search', () => {
it('should open google and search', async () => {
await browser.url('https://www.google.com');
const input = await $('[name="q"]');
await input.setValue('WebdriverIO');
await browser.keys('Enter');
await expect(browser).toHaveTitleContaining('WebdriverIO');
});
});
随着前端和移动应用开发的快速发展，自动化测试的需求也在不断增加。WebdriverIO作为一款新兴的测试框架，以其强大的功能和灵活性，迅速赢得了开发者的青睐。无论是在企业项目还是开源社区，WebdriverIO的应用场景和影响力都在不断扩大，推动着自动化测试技术的进步。
WebdriverIO作为Node.js生态中的下一代自动化测试框架，以其强大的功能和灵活性，为开发者提供了高效的测试解决方案。通过掌握WebdriverIO，你可以轻松实现浏览器和移动设备的自动化测试，提升软件质量和开发效率。
拥抱WebdriverIO，让自动化测试变得更简单、更高效，为你的开发工作注入新的动力。
