Estoy lidiando con un botón bastante complicado que se supone que abre un nuevo documento. De manera predeterminada, abre el documento en una nueva pestaña, pero necesito usarlo para que abra la URL en la misma página. Desafortunadamente, este no es un elemento href para el que hay varias formas de tratar en Cypress. En cambio, el botón se ve así:
<button class="header-add-button k-button"> <svg class="svg-inline--fa fa-plus fa-w-14" aria-hidden="true" focusable="false" data-prefix="fad" data-icon="plus" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""> <g class="fa-group"> <path class="fa-secondary" fill="currentColor" d="M176 448a32 32 0 0 0 32 32h32a32 32 0 0 0 32-32V304h-96zm64-416h-32a32 32 0 0 0-32 32v144h96V64a32 32 0 0 0-32-32z"></path> <path class="fa-primary" fill="currentColor" d="M448 240v32a32 32 0 0 1-32 32H32a32 32 0 0 1-32-32v-32a32 32 0 0 1 32-32h384a32 32 0 0 1 32 32z"></path> </g> </svg> <!-- <i class="fad fa-plus"></i> --> <span class="span_hover_effect" style="top: 8.9375px; left: 8.28125px;"></span> </button> Puedo hacer clic en este botón en Cypress, pero el uso de los métodos para tratar con la apertura de enlaces href en la misma pestaña no se aplica aquí.
Este es el código que probé aplicando uno de los métodos que encontré al buscar continuar en la misma pestaña.
cy.get('.header-add-button').invoke('removeAttr', 'target', '_blank').click()Hace clic en el botón, pero la página aún se abre en una nueva pestaña.
{edit} Según el desarrollador, el botón lo redirige a través de una llamada AJAX. No estoy seguro de qué hacer con eso, pero esa es toda la respuesta que obtuve.
Puede comprobar que se llama a la función cuando hace clic en ese botón. Tendrá que buscar en el javascript para ver el nombre de su aplicación. No estoy seguro de cómo podría obtener la URL si necesita realizar más pruebas en la nueva pestaña, pero básicamente se verá así:
cy.visit('./index.html') cy.window().then((win) => { // spy on 'open' function, yours might be called differently cy.spy(win, 'open').as('redirect'); // or stub on 'open' function so no actually redirect occurs // cy.stub(win, 'open').as('redirect'); }) // click on button with ajax call cy.get('@redirect') .should('be.calledWith', '_blank', '/about');Referencias:
¡Combinando la respuesta de jjhelguero con este enlace encontré la solución!
it('add contract ', function () { cy.window().then(win => { cy.stub(win, 'open').as('open') }) cy.get('.header-add-button').click() cy.get('@open').should('be.calledWith', Cypress.sinon.match.string).then(stub => { cy.visit(Cypress.env('url') + stub.args[0][0]); stub.restore; }) })Esto abre el enlace deseado en la misma pestaña para que pueda continuar probando :)