cypress/support/commands.js
Cypress.Commands.add(name, callbackFn)
Cypress.Commands.add(name, options, callbackFn)
Cypress.Commands.overwrite(name, callbackFn)
参数 | 可接受的值类型 | 默认 | 描述 |
---|---|---|---|
prevSubject | Boolean, String or Array | false | 如何处理前面产生的对象 |
除了控制命令的隐式行为,您还可以添加声明性主题验证,例如:
Cypress 内置命令利用了上述可选值组合中的每一个
注意:仅在 Cypress.Commands.add() 中支持使用options,而在 Cypress.Commands.overwrite() 中不支持使用options
Cypress.Commands.add('login', (email, pw) => {})
Cypress.Commands.overwrite('visit', (orig, url, options) => {})
cmd 窗口进入下面的文件夹
执行下面的命令
npm start
在 cypress/support/commands.js 中写如下代码
Cypress.Commands.add('login', (username, pwd) => {
cy.get('input[name=username]').type(username)
cy.get('input[name=password]').type(`${pwd}{enter}`)
})
context('登录测试,PO 模式', function () {
const username = 'jane.lane'
const pwd = 'password123'
it('登录成功', function () {
// 创建 po 实例
const loginInstance = new LoginPage()
loginInstance.visitPage()
loginInstance.isTargetPage()
// 调用 Custom Commands 的命令
cy.login(username, pwd)
cy.url().should('include', '/dashboard')
const manInstance = new mainPage()
manInstance.isTargetPage()
manInstance.welComeText.should('contain', 'jane.lane')
});
})
cypress/support/command.js
在 cypress/support/commands.js 中写如下代码
Cypress.Commands.add('login', (username, pwd) => {
Cypress.log({
name: 'login',
message: `${username} | ${pwd}`
})
return cy.request({
method: 'POST',
url: '/login',
form: true,
body: {
username: username,
password: pwd
}
})
})
.request() 命令在后面文章会继续介绍
无须 PageObject 模型,直接在 integration 文件夹下建立 testLogin.js 测试用例文件
context('登录测试,PO 模式', function () {
const username = 'jane.lane'
const pwd = 'password123'
beforeEach(function () {
cy.login(username, pwd)
})
it('访问受保护页', function () {
// cy.request() 登录成功后,cypress 会自动保存 session cookie
// 所以下面就可以访问登录后才能访问的页面
cy.visit('/dashboard')
cy.url().should('eq', 'http://localhost:7077/dashboard')
cy.get('h1').should('contain', 'jane.lane')
});
})
// 第一个参数代表需要覆盖的命令
Cypress.Commands.overwrite('visit', (originalFn, url, options) => {
const domain = Cypress.env('BASE_DOMAIN')
if (domain === '...') {
url = '...'
}
if (options.something === 'else') {
url = '...'
}
// originalFn 代表传入进来的原 visit 命令
//
// 记得需要在最后 return
return originalFn(url, options)
})
如果在密码字段中键入内容,密码输入将在应用程序中自动屏蔽。但是 .type() 会自动将所有键入的内容记录到测试运行程序的命令日志中
cy.get('#username').type('username@email.com')
cy.get('#password').type('superSecret123')
.type()
.type()
Cypress.Commands.overwrite('type', (originalFn, element, text, options) => {
if (options && options.sensitive) {
options.log = false
// 创建自己的日志
Cypress.log({
$el: element,
name: 'type',
message: '*'.repeat(text.length),
})
}
return originalFn(element, text, options)
})
cy.get('input[name=username]').type(username)
cy.get('input[name=password]').type(pwd, {sensitive: true})