Quiero almacenar un valor, luego realizar una acción y afirmar que el valor no ha cambiado. Tengo un código que funciona, pero me gustaría tener información si hay una solución más elegante.
La idea básica es:
describe('Store and compare a value', () => { it('store and compare', () => { cy.login() cy.visit('url2') cy.get('.total-count-results').invoke('text') .then((text) => { const counts = text cy.get('.medium.col100 > .filterwrapper > input').type('Test Dummy',{force: true}) cy.get('.medium.col100 > .filterwrapper > input').type('{enter}') cy.get('.total-count-results').invoke('text') .then((text) => { const new_counts = text expect(new_counts).to.eq(counts) }) }) }) })Eso es lo mejor que se me ocurrió para manejar la asincronía.
No creo que se requieran alias. Aquí está mi solución que probé localmente. Mantuve la mayor parte del código en la respuesta de Alapan Das para que sea más fácil de comparar. A mí me parece más conciso y fácil de leer sin alias.
describe('Store and compare a value', () => { it('store and compare', () => { cy.login() cy.visit('url2') cy.get('.total-count-results').invoke('text') .then((previousText) => { cy.get('.medium.col100 > .filterwrapper > input').type('Test Dummy',{force: true}) cy.get('.medium.col100 > .filterwrapper > input').type('{enter}') cy.get('.total-count-results').invoke('text').should("eq", previousText) }) }) })Puede usar alias para esto y hacer algo como esto:
describe('Store and compare a value', () => { it('store and compare', () => { cy.login() cy.visit('url2') cy.get('.total-count-results').invoke('text').as('counts') cy.get('.medium.col100 > .filterwrapper > input').type('Test Dummy', { force: true, }) cy.get('.medium.col100 > .filterwrapper > input').type('{enter}') cy.get('.total-count-results').invoke('text').as('new_counts') cy.get('@counts').then((counts) => { cy.get('@new_counts').then((new_counts) => { expect(new_counts).to.eq(counts) }) }) }) })Una buena solución para comparar valores como este puede ser usar una variable de cierre, según el ejemplo en la documentación de Cypress en https://docs.cypress.io/api/commands/should#Compare-text-values-of-two -elementos . En tu ejemplo, algo como esto:
describe('Store and compare a value', () => { it('store and compare', () => { let counts // closure variable cy.login() cy.visit('url2') cy.get('.total-count-results').invoke('text') .then(text => counts = text) // set closure variable cy.get('.medium.col100 > .filterwrapper > input').type('Test Dummy',{force: true}) cy.get('.medium.col100 > .filterwrapper > input').type('{enter}') cy.get('.total-count-results').invoke('text') .then(new_counts => expect(new_counts).to.eq(counts)) // compare closure variable //.should("eq",counts) // alternative to .then clause }) })Esto evita tener cláusulas '.then' anidadas, que pueden convertirse en un infierno de devolución de llamada, y es menos detallado.
(Consulte https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures para obtener información sobre los cierres: en resumen, "un cierre le da acceso al alcance de una función externa desde una función interna". El interior Las funciones aquí son las dos funciones .then : acceden a la variable de counts desde el alcance de it función exterior.)