Necesito comparar si dos elementos diferentes contienen el mismo texto. Caso: Tengo 5 períodos de tiempo de botones diferentes, supongamos que son "Día, Semana, Mes, Año, Década". Cada vez que hago clic en algún botón en particular, quiero comparar si el valor en el segundo elemento en el gráfico a continuación cambia. también y es lo mismo.
mi código es:
isAgregationBarChoosenValuePresent() { const selectors = ['button[data-testid="period-button-DAY"]', 'button[data-testid="period-button-WEEK"]', 'button[data-testid="period-button-MONTH"]', 'button[data-testid="period-button-YEAR"]', 'button[data-testid="period-button-DECADE"]'] selectors.forEach(($selector) => { cy.get($selector, { timeout: 10000 }).eq(0).click().then($assertion => { const assertionText = $assertion.text() return assertionText === cy.get('Second element).text() })Supongo que no puedo usar cy.get('Second element).text(). Intenté usar otro entonces y crear una constante con secondElement.text(), esto tampoco funciona.
Si tienes alguna idea, házmelo saber.
Gracias
Envuelva la comparación en una función, luego llámela para cada botón
const compare = ($button, selector2) => { cy.get(selector2).then($selector2 => { expect($button.text()).to.eq($selector2.text()) }) } const selectors = ... selectors.forEach((buttonSelector) => { cy.get(buttonSelector, { timeout: 10000 }).click() .then($button => compare($button, 'Second element'))Separado de DOM
A veces, el elemento del botón puede reemplazarse después de hacer clic (particularmente una aplicación React). Es posible que vea un error "separado del DOM".
En este caso, debe volver a consultar el botón dentro de la función
const compare = (buttonSelector, selector2) => { cy.get(buttonSelector).then($button => { cy.get(selector2).then($selector2 => { expect($button.text()).to.eq($selector2.text()) }) }) } const selectors = ... selectors.forEach((buttonSelector) => { cy.get(buttonSelector, { timeout: 10000 }).click() .then(() => compare(buttonSelector, 'Second element'))Según lo que entendí de la pregunta, esto es lo que puede hacer.
const selectors = [ 'button[data-testid="period-button-DAY"]', 'button[data-testid="period-button-WEEK"]', 'button[data-testid="period-button-MONTH"]', 'button[data-testid="period-button-YEAR"]', 'button[data-testid="period-button-DECADE"]', ] selectors.forEach(($selector) => { cy.get($selector, { timeout: 10000 }) .eq(0) .click() .then(($assertion) => { cy.get("Second element") .invoke("text") .then((secondText) => { if ($assertion.text() == secondText) { //Do Something } else { //Do something } }) }) })Gracias amigos, el problema está resuelto.