zoukankan      html  css  js  c++  java
  • [Cypress] Interact with Hidden Elements in a Cypress Test

    We often only show UI elements as a result of some user interaction. Cypress detects visibility and by default won’t allow your test to interact with an element that isn’t visible. In this lesson, we’ll work with a button that is shown on hover and see how you can either bypass the visibility restriction or use Cypress to update the state of your application, making items visible prior to interacting with them.

    For example the delete icon was hidden by default, only show up when you hover over it, to test those hidden element. we need to call:

    .invoke('show')
        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);
        });
  • 相关阅读:
    @codeforces
    Spark源码剖析
    大数据自动化安装部署方案(一)
    Spark源码剖析
    Spark源码剖析
    Spark源码剖析
    Spark源码剖析
    Spark源码剖析
    Spark源码剖析
    Spark源码剖析
  • 原文地址:https://www.cnblogs.com/Answer1215/p/9264656.html
Copyright © 2011-2022 走看看