写在前面：

CodeceptJS是一个基于NodeJS验收测试框架，填坑指南只针对目前我遇到的问题提供解决方案和小技巧，按照官方文档的思路进行扩展。

！！！此指南仅针对「拥有阅读过官方文档基础」的同学。

一、安装和环境配置

系统：CentOS 7

1.安装nodejs：

wget https://nodejs.org/dist/v9.9.0/node-v9.9.0.tar.gz

yum install gcc openssl-devel gcc-c++ compat-gcc-34 compat-gcc-34-c++

tar -xf node-v9.9.0.tar.gz

cd node-v9.9.0

./configure --prefix=/usr/local/node

make && make install

ln -s /usr/local/node/bin/* /usr/sbin/

node -v 查看 NodeJS 版本大于8.9 就ok

2.安装selenium-standalone：

npm install selenium-standalone@latest -g

ln -s xxxxxx /usr/bin/

selenium-standalone install

selenium-standalone start

3.安装codeceptjs：

codeceptjs官网

快速开始：安装详细步骤

注意：安装codeceptjs指定版本1.1.6:

npm install -g codeceptjs@1.1.6

4.安装必需的module：

npm install -g mochawesome

npm install -g mocha-multi

npm install silly-datetime

二、填坑

1.配置文件codecept.json：

Helpers → WebDriverIO → Configuration

• timeouts（超时）: 在没有特殊情况的测试下，不需要设置超时时间 codecept.json中也不需要写这个配置。
• keepCookies（保存Cookies）：存在登录等需要cookie的操作，将这个配置设置为true，这样登录一次也可以后续的测试操作，减少重复的代码。

2.框架基本方法methods：

• acceptPopup：接受弹出框，相当于点击弹出窗口的确认键。（仅接受由于window.alert|window.confirm|window.prompt创建的窗口）
• cancelPopup：取消弹出框，相当于点击弹出窗口的取消键。（同理上述）
• checkOption：选择复选框或者单选按钮（相当于checkbox和radio），两个参数：第一个参数是该选择按钮想要点击的那个值的元素的CSS或者XPATH；第二个参数是第一个参数元素的父div（实际用处就是为了缩小范围的上下文）。
• click：简单的点击事件，但是坑大！因为实际操作时，点击按钮后，浏览器会有几秒的延迟，所以一般涉及network的点击动作完成后，等待几秒，给浏览器点时间: I.wait(2)，就能极大的降低脚本报错率（一般wait 2～3秒就行）。

see方法和dontSee方法的坑我就写在一条里了！

• seeCurrentUrlEquals / seeInCurrentUrl：前者是检查当前网页url是否与方法里的url相等，后者是检查当前网页url中是否包含方法里的url，（这两个方法对于检查点击跳转是否到正确的页面这个操作很有用）。

• switchToNextTab：这个方法很有用！因为一些a标签的跳转是打开的多一个标签页，这样在A页面click这个链接后，打开了标签页B页面，程序想要在B页面操作，就必须要使用这个函数切换到下一个页面，不然程序所认定的当前页面还是A页面。

3.页面对象：

Guides → page object

相当于一个仿类

'use strict';

let I;

module.exports = {

    _init() {

        I = actor()

    },

fields: {

        email: '#user_basic_email',

        password: '#user_basic_password',

    },

    submitButton: {css: 'xxxxxxxxxxxxx'},

sendForm(email, password) {

        I.fillField(this.fields.email, email);

        I.fillField(this.fields.password, password);

        I.click(this.submitButton);

    }

}

• sendForm：相当于类中的方法

• fields：相当于类中的变量

这样在*_test.js的测试脚本中可以直接调用类，使代码模块化。

注意：调用的对象默认是创建页面对象的名字后+Page

4.高级方法：

Guides → Advanced Usage

• Groups（组）：在每个Scenario(‘update user profile @组名’) @+组名 这样在运行的时候 codeceptjs run –grep @组名 就可以连续多个的执行这个组内的脚本（很好用）。并且支持正则。

5.报告：

Reference → Reporters
测试脚本跑完后，需要导出测试结果的报告，codeceptjs可以利用各种扩展包导出不同形式的报告（XML、HTML等），目前我觉得最好用的就是HTML

npm install -g mochawesome

npm install -g mocha-multi

codecept.json：

运行：

codeceptjs run --reporter mocha-multi

结果：

6.Helper:

Guides → Helpers

可以自定义全局方法，可以任意使用NodeJS的标准库，类似于amOnPage()

暂时没有引用太多，没有经验 - -

三、Bug case：

1.页面跳转类问题：

问题一：脚本运行后，浏览器驱动已经显示了脚本的运行步骤，浏览器页面已经跳转，但是输出日志上并没有执行。最后报错。

原因：网络问题，属于加载页面时间过长。

解决方案：不要设置retry、不要设置超时、不要加wait，等着就行。。。只要让脚本等页面加载完就可以继续运行测试程序了。。。（有的时候设置太多东西反而会出错）。

2.点击事件类问题：

问题一：当点击一个链接，跳转到下一个页面，成功跳转，元素或字符串存在，可报的错就是element is not found CSS or XPATH（这类报错信息）。

原因：网络问题，或者目的网页有外部资源需要加载，DOM还未加载完成。

解决方案：在跳转动作执行后，加上一句wait,2~3秒就行，例如：

I.click('/vuln/detail');I.wait(2);

问题二：当点击一个js事件，可能是弹出一个模块框等等，明明已经弹出，明明元素存在，可就是找不到。

原因：你还是太年轻，有的js效果可能是弹出，可能是淡出，可能是balabala的效果，效果也是需要时间的啊！，不是即点击即出的啊！！！

解决方案：这些没有卵用的但是为了用户体验却又不能删的js效果也是需要时间的，还是在click后加上wait，这个wait的目的就是等待js特效。

Anyway

持续更新…