zoukankan      html  css  js  c++  java
  • [Cypress] Create Aliases for DOM Elements in Cypress Tests

    We’ll often need to access the same DOM elements multiple times in one test. Your first instinct might be to use cy.getand assign the result to a variable for reuse. This might appear to work fine at first, but can lead to trouble. Everything in Cypress is done asynchronously and you’re interacting with an application’s DOM, which is changing as your tests interact with it. In this lesson, we’ll see how we can reference DOM elements in multiple places with the alias feature in Cypress.

        it('should Delete an item', function () {
            cy.server();
            cy.route({
                method: 'DELETE',
                url: '/api/todos/*',
                response: {}
            }).as('delete');
    
            cy.seedAndVisit();
    
            cy.get('.todo-list li')
                .first()
                .find('.destroy')
                .invoke('show') // Make the hidden button appear
                .click();
    
            cy.wait('@delete');
    
            cy.get('.todo-list li')
                .should('have.length', 3);
        });

    The code above, we have use 'cy.get('.todo-list li')' in two places.

    We can use alias for DOM element as well to reduce duplication:

        it('Using alias for the DOM element', function () {
            cy.server();
            cy.route({
                method: 'DELETE',
                url: '/api/todos/*',
                response: {}
            }).as('delete');
    
            cy.seedAndVisit();
    
            cy.get('.todo-list li')
                .as('list'); // alias the DOM element
    
            cy.get('@list')
                .first()
                .find('.destroy')
                .invoke('show')
                .click();
    
            cy.wait('@delete');
    
            cy.get('@list')
                .should('have.length', 3);
        });
  • 相关阅读:
    DNS域名解析中A、AAAA、CNAME、MX、NS、TXT、SRV、SOA、PTR各项记录的作用
    HTTP数据包
    渗透——网络基础
    渗透——linux基础
    渗透——http协议基础
    渗透——CMS基础
    渗透测试流程
    渗透专用术语
    CodeFoeces GYM 101466A Gaby And Addition (字典树)
    关于Windows10内存随时间不断升高问题
  • 原文地址:https://www.cnblogs.com/Answer1215/p/9264667.html
Copyright © 2011-2022 走看看