WebdriverIO入门 —— 编写首个Script

Introduction

WebdriverIO是一个用javascript编写的，运行在Nodejs的自动化测试框架，它是可集成可扩展的自动化测试框架。

WebdriverIO能什么

• Native移动端测试 📱
• electron开发的桌面端应用测试 💻
• web应用自动化测试 🕸

WebdriverIO vs Selenium

• selenium使用webdriver协议与浏览器交互
• webdriverIO更灵活，可以选择WebDriver协议或Chrome DevTools协议的方式和浏览器交互

• selenium更多的是一个tool，而webdriverIO是一个可灵活可配置的测试框架。

webdriver协议和chrome devtools协议有什么区别

• webdriver协议会通过一个中间方，比如chromedriver去驱动浏览器。
• webdriver协议可支持多种浏览器，但相对执行速度较慢.
• chrome devtools协议直接与浏览器交互。它可以对浏览器获得更多的控制权，执行速度更快.

Tutorial

Get started

1. 安装Nodejs
2. 初始化wdio项目npm init wdio ./path/to/new/project
3. 根据提示完成配置(先暂时按默认配置)

   

4. 使用vscode或ide打开wdio项目,以下是项目目录

├── package-lock.json

├── package.json

├── test

│ ├── pageobjects

│ │ ├── login.page.js

│ │ ├── page.js

│ │ └── secure.page.js

│ └── specs

│ └── example.e2e.js

└── wdio.conf.js

第一个测试用例

现在开始编写第一个测试，在test/specs目录下新建一个exercise.js文件

测试脚本完成以下操作(操作步骤与自动生成的example.e2e.js一致）

• 打开网址 ：The Internethttp://the-internet.herokuapp.com/login
• 输入用户名tomsmith密码SuperSecretPassword
• 点击Login按钮
• 验证登录成功，页面出现以下内容

先打开网页定位一下需要操作的元素

• 用户名输入框 - <input type="text" name="username" id="username">
• 密码输入框 - <input type="password" name="password" id="password">
• 登录提交按钮 - <button class="radius" type="submit">
• 登录成功提示 - <div data-alert="" id="flash" class="flash success" xpath="1">

测试脚本完整代码如下

describe('sample',() => {
    it('sample login test',async () => {
        await browser.url('https://the-internet.herokuapp.com/login');//打开网址

        await $('#username').setValue('tomsmith');//输入用户名
        await $('#password').setValue('SuperSecretPassword!');//输入密码

        await $('button.radius').click();//点击登录按钮

        const successMessageELement = await $('div#flash');//获取成功提示框元素

        await successMessageELement.waitForExist();//等待成功提示框出现

        await expect(successMessageELement).toHaveTextContaining('You logged into a secure area!');//验证提示信息
    });
});

Now，执行测试脚本！

npx wdio run ./wdio.conf.js --spec exercise.js

最后看到控制台输出结果表示测试通过✅

------------------------------------------------------------------
[chrome 98.0.4758.80 mac os x #0-0] Running: chrome (v98.0.4758.80) on mac os x
[chrome 98.0.4758.80 mac os x #0-0] Session ID: 99da6434cc3b7429c4a09fd7c425253c
[chrome 98.0.4758.80 mac os x #0-0]
[chrome 98.0.4758.80 mac os x #0-0] » /test/specs/exercise.js
[chrome 98.0.4758.80 mac os x #0-0] sample
[chrome 98.0.4758.80 mac os x #0-0]    ✓ sample login test
[chrome 98.0.4758.80 mac os x #0-0]
[chrome 98.0.4758.80 mac os x #0-0] 1 passing (6.2s)