Nightwatch 使用 VS code 进行调试

除了通过增加

console.log('===========')

来调试 Nightwatch 代码,如何通过配置 VS code 来 Debug Nightwatch 代码?

Ctrl+Shift+D 打开 Debug 界面,配置如下:

{
// Use IntelliSense to learn about possible Node.js debug attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [

{
"type": "node",
"request": "launch",
"name": "npm test",
"program": "${workspaceRoot}/node_modules/nightwatch/bin/runner.js",
"args": [
"tests/DQA/DQA-221/login.js"
]
}
]
}

Nightwatch 持续集成问题

在持续集成执行自动化测试用例时候会遇到那些问题呢

  1. 运行时间过长
  2. 因为某些错误程序卡住
  3. 异常处理

针对以上三种情况,通过下面的三种方式进行解决

运行时间过长, E2E 测试脚本中难免需要时间等待,例如

this.pause(1000);
// 尽可能将说有的 pause 换成 wait,例如:
this.element('@columns').to.be.visible.before(2000);
// 或
this.waitForElementVisible('@columns', 5000);

因为某些错误程序卡住, 在 TestCase 中进行验证时,例如

this.assert.equal(result.value.length, 1);
// 如果只想标注失败,继续执行后面的代码,则需将 assert 换成 verify
this.veriry.equal(result.value.length, 1);

// 在 waitForElementVisible 中加 abortOnFailure 参数,当设置为 false,在 wait 超时时,就会标志为 false 继续继续执行
this.waitForElementVisible('@columns', 5000, false);

//还可以通过在 nightwatch.conf.js 设置全局变量
abortOnAssertionFailure: false

异常处理

当程序执行运行一次时,程序运行正常,一旦遇到异常时,下次执行就回出错。
例如:比如邀请账号登录系统的操作。管理员添加一个新用户,然后用这个新用户登录,之后管理员删除这个账户。但如果删除这个账号失败时,下次执行这个程序再邀请这个账号时就会提示这个账号存在的,可能这个时候这个程序就执行不下去了。这个时候就需要考虑这些异常情况处理,保证程序能够良好的执行下去。

Nightwatch 打开多个窗口

如果想打开两个窗口并控制那个窗口怎么办?

var url = process.env.BASE_URL, newWindow;

client.execute(function (url, newWindow) {
window.open(url, newWindow, 'height=768,width=1024');
}, [url, newWindow]);

client.window_handles(function(result) {
this.verify.equal(result.value.length, 2, 'There should be 2 windows open');
newWindow = result.value[1];
this.switchWindow(newWindow);
})

Ubuntu 上使用 VPN

如何在 Ubuntu 上连接 Cisco AnyConnect VPN

打开Terminal,执行:

sudo /sbin/modprobe tun

安装OpenConnect,执行:

sudo apt-get install openconnect

连接VPN,执行:

sudo openconnect yourvpn.example.com

将提示你输入用户名和密码,输入争取后,VPN连接成功。

原文 请点击

Ubuntu 上安装 VS Code

在 Ubuntu 下面安装 Visual Studio Code

sudo add-apt-repository ppa:ubuntu-desktop/ubuntu-make
sudo apt-get update
sudo apt-get install ubuntu-make
umake web visual-studio-code

亲测,好用。

Nightwatch wait For Text

在使用 Nightwatch 做自动化测试的时候,会遇到这样一种情况:
创建一个 query, 等待这个query的状态从 Wait 变成 Running 最后到 Available 时再执行操作。
Nightwatch 并没有提供这样的方法,可以通过下面的方式解决。

'Wait for text': function waitForText(client) {
const query = client.page.query();
query.navigate();
for (let i = 0; i <= 10; i++) {
client.getText('status', function (result) {
if (result.value.indexOf('Available') == 0) {
this.break;
} else {
client.pause(1000);
i++;
}
});
}
// TODO something
}

Nightwatch 元素判断

Nightwatch 元素常用验证方法

验证元素的值信息

andesFormSection
.assert.containsText('@errorMessage', 'The email address is invalid.')

验证元素是否可用

andesFormSection
.assert.attributeEquals('@continueBtn', 'disabled', 'true');

等待元素可用

andesFormSection
.expect.element('@signInBtn').to.be.visible.before(5000);

或者

andesFormSection
waitForElementVisible('signInBtn', 5000);

等待元素呈现

andesFormSection
.expect.element('@signInBtn').to.be.present.before(5000);

或者

andesFormSection
waitForElementPresent('signInBtn', 5000);

Nightwatch 得到和验证 cookies

测试用例

验证登录 cookies 和清除 access_token。测试用例设计如下

测试用例设计

登录系统时,不选择记住我按钮,验证 cookies

client.getCookies(function cb(result) {
this.assert.equal(result.value.length, 3);
this.assert.equal(result.value[0].name, 'domain');
this.assert.equal(result.value[1].name, 'user_id');
this.assert.equal(result.value[2].name, 'access_token');
});

登录系统时,选择记住我按钮,验证 cookies

client.getCookies(function cb(result) {
this.assert.equal(result.value.length, 5);
this.assert.equal(result.value[0].name, 'domain');
this.assert.equal(result.value[1].name, 'user_id');
this.assert.equal(result.value[2].name, 'identifier');
this.assert.equal(result.value[3].name, 'access_token');
this.assert.equal(result.value[4].name, 'persistent_token');
});

登录系统时,不选择记住我按钮,删除 cookies

let accesstoken;
client.getCookies(function cb(result) {
accesstoken = result.value[2].name;
this.deleteCookie(accesstoken, function () {
// refresh current page, logout
this.refresh().waitForElementVisible('div.login-form', 5000);
});
});

登录系统时,选择记住我按钮,删除 cookies

let accesstoken;
client.getCookies(function cb(result) {
accesstoken = result.value[3].name;
this.deleteCookie(accesstoken, function() {
// refresh current page, still login
this.refresh().waitForElementVisible('.andes-header', 5000);
});
});

如何知道登录都有哪些参数

事先在手动测试的时候打开 chrome 浏览器,然后按 F12,登录时查看 Network。

以成功百度登录时为例,可以看到 Headers 里的参数,我们可以通过验证这些参数来确定登录成功了。

这样我们就可以这些参数来实现对 cookie,token 等等参数进行自动化测试的验证。

度过工作中挫折心结

对于一个不善于言表的我工作中遇到过

  • 过度理解在与同事之间的Email和Chat中的意思;
  • 同事之间的沟通中出现的分歧事后还会继续琢磨;
  • 十分关注自己的工作失与得在上级领导中的看法。

以下方式对我来说还比较有效的

  • 让自己的精力更多的聚焦在工作上;
  • 工作中对事不对人,做对的事情;
  • 眼光放长远,不忘初心,专注应该做的事情上;
  • 领导说的一句“向前看”我印象深刻,过去的就过去了,别再纠结,向前看。

Change Hexo code highlight

Hexo 默认主题代码高亮是黑色的,如果想换个风格?具体操作如下:

# 修改 highlight.styl 文件,路径
themes/landscape/source/css/_partial/highlight.styl

修改默认代码主题 Tomorrow Night Eighties

highlight-background = #2d2d2d
highlight-current-line = #393939
highlight-selection = #515151
highlight-foreground = #cccccc
highlight-comment = #999999
highlight-red = #f2777a
highlight-orange = #f99157
highlight-yellow = #ffcc66
highlight-green = #99cc99
highlight-aqua = #66cccc
highlight-blue = #6699cc
highlight-purple = #cc99cc

为主题 Tomorrow

highlight-background = #ffffff
highlight-current-line = #efefef
highlight-selection = #d6d6d6
highlight-foreground = #4d4d4c
highlight-comment = #8e908c
highlight-red = #c82829
highlight-orange = #f5871f
highlight-yellow = #eab700
highlight-green = #718c00
highlight-aqua = #3e999f
highlight-blue = #4271ae
highlight-purple = #8959a8

更多详情请参考 tomorrow-theme 修改。