Cypress - 断言

Cypress 拥有多种类型的断言，这些断言来自 Mocha、Chai 等各种库。断言类型有显式和隐式。

隐式断言

如果断言适用于从链中的父命令获得的对象，则称为隐式断言。流行的隐式断言包括 .and/.should。

这些命令不能单独使用。通常，当我们必须对特定对象进行多项检查时，会使用它们。

让我们通过下面给出的示例来说明隐式断言 −

// 测试套件
describe('Tutorialspoint', function () {
    it('Scenario 1', function (){
        // 启动 URL 的测试步骤
        cy.visit("https://www.tutorialspoint.com/videotutorials/index.php")
        // 断言以验证子元素的数量和类属性值
        cy.get('.toc chapters').find('li').should('have.length',5)
        .and('have.class', 'dropdown')
    });
});

执行结果

输出如下 −

输出日志显示了使用 should 和 command 获得的两个断言。

显式断言

如果断言直接适用于对象，则称为显式​​断言。常用的显式断言包括assert/expect。

显式断言的命令如下 −

// 测试套件
describe('Tutorialspoint', function () {
    // it 函数用于识别测试
    it('Scenario 1', function (){
        // 测试步骤用于启动 URL
        cy.visit("https://accounts.google.com")
        // 识别元素
        cy.get('h1#headingText').find('span').then(function(e){
            const t = e.text()
            // 断言 expect
            expect(t).to.contains('Sign')
        })
    })
})

执行结果

输出结果如下 −

输出日志显示使用 expect 命令直接应用于对象的断言。

Cypress 具有默认断言，这些断言在内部处理，不需要专门调用。

以下是几个例子 −

• cy.visit () − 期望页面显示带有 200 状态代码的内容。

• cy.request () − 期望远程服务器可用并发送响应。

• cy.contains () − 期望 Web 元素及其属性在 DOM 中可用。

• cy.get () − 期望 Web 元素在 DOM 中可用。

• .find () − 期望 Web 元素在 DOM 中可用。

• .type () − 期望 Web 元素变为可输入状态。

• .click () −期望 Web 元素变为可点击状态。

• .its () −期望现有主题上的 Web 元素属性。

其他 Cypress 断言

其他 Cypress 断言如下 −

length

它检查从先前链接的命令中获得的元素数量。

例如，

cy.get('#txt-fld').should('have.length',5)

value

它检查 Web 元素是否具有某个值。

例如，

cy.get('#txt-fld').should('have.length',5)

value

它检查 Web 元素是否具有某个值。

对于例如，

cy.get(' #txt-fld').should('have.value', 'Cypress')

class

它检查 Web 元素是否具有某个类。

例如，

cy.get('#txt-fld'').should('have.class', 'txt')

contain

它检查 Web 元素是否具有某个文本。

例如，

cy.get('#txt-fld'').should('contain', 'Cypress')

visible

它检查 Web 元素是否可见。

例如例如，

cy.get('#txt-fld'').should('be.visible')

exist

它检查 Web 元素是否在文档对象模型 (DOM) 中可用。

例如，

cy.get('#txt-fld'').should('not.exist');

css

它检查 Web 元素是否具有某个 css 属性。

例如，

cy.get('#txt-fld'').should('have.css', 'display', 'block');