Mocha:第一个UI自动化case

Mocha

Mocha(发音"摩卡")诞生于2011年,是现在最流行的JavaScript测试框架之一,在浏览器和Node环境都可以使用。

mocha提供了BDD（Behavior Driven Develop）和TDD（Test Driven Develop）风格的接口，默认是BDD风格的。

mocha的特点主要有：

• 既可以测试简单的JavaScript函数，又可以测试异步代码，因为异步是JavaScript的特性之一；
• 可以自动运行所有测试，也可以只运行特定的测试；
• 可以支持before、after、beforeEach和afterEach来编写初始化代码。

BDD风格主要提供以下6个接口before()、after() 、beforeEach() 、afterEach() 、describe()、it()。

其中before() 、after() 、beforeEach() 、afterEach() 是用于预处理和test后的处理。
before：在执行所有的测试用例前 函数会被调用一次；
after：在执行完所有的测试用例后 函数会被调用一次；
beforeEach：在执行每个测试用例前 函数会被调用一次；
afterEach：在执行每个测试用例后 函数会被调用一次；
describe：声明了一个测试集合，describe是可以嵌套的；
it：声明定义了一个具体的测试用例，一个it对应一个实际的test case；

Test Hooks方法的几个注意点：
· beforeEach会对当前describe下的所有子case生效；
· before和after的代码没有特殊顺序要求；
· 同一个describe下的执行顺序为before、beforeEach、afterEach、after；
· 当一个it有多个before的时候，执行顺序是从最外围的describe的before开始，其他同理。

官方文档 ： https://mochajs.org/

How to create a project

• Install node JS environment first
• mkdir [your_project_name]
• npm init -y
• npm i --save-dev @wdio/cli
• mkdir -p ./test/specs
• use npx wdio wdio.conf.js to create the wdio.conf.js

IDE : Vscode

npm

在正式开始Node.js学习之前，我们先认识一下npm
npm其实是Node.js的包管理工具（package manager）

我们在Node.js上开发时，会用到很多别人写的JavaScript代码。如果我们要使用别人写的某个包，每次都根据名称搜索一下官方网站，下载代码，解压，再使用，非常繁琐。于是一个集中管理的工具应运而生：大家都把自己开发的模块打包后放到npm官网上，如果要使用，直接通过npm安装就可以直接用，不用管代码存在哪，应该从哪下载。

更重要的是，如果我们要使用模块A，而模块A又依赖于模块B，模块B又依赖于模块X和模块Y，npm可以根据依赖关系，把所有依赖的包都下载下来并管理起来。否则，靠我们自己手动管理，肯定既麻烦又容易出错。

其实npm已经在Node.js安装的时候顺带装好了。我们在命令提示符或者终端输入npm -v，应该看到类似的输出：

C:\>npm -v
4.1.2

如果直接输入npm，你会看到类似下面的输出：

C:\> npm
Usage: npm <command>
where <command> is one of:

上面的一大堆文字告诉你，npm需要跟上命令。现在我们不用关心这些命令，后面会一一讲到。目前，你只需要确保npm正确安装了，能运行就行。

knowledge about webdriver

we can use the APIs (https://webdriver.io/docs/api.html) to:

relate elements: xpath, css selector
control some browser’s API: visit url, maximize window
simulate the mouse actions: click, hover
wait until: displayed, clickable, enabled, exist
get the attributes of elements, browser

指定需要运行的case：

First PageObject

import BasePageObject from 'xxxxx/dist'
 
export default class LoginPageObject {
   
   
    private basePageObject = new BasePageObject()
    private url =