Necesito afirmar que un elemento <table> contiene un elemento anidado <thead> y <tbody> .
Claro, una solución obvia sería algo. como esto:
cy.get('table') .find('thead') cy.get('table') .find('tbody')pero ¿no hay una manera simple de hacerlo todo en una cadena? Como esto:
cy.get('table') .should('contain.element','thead') .should('contain.element','tbody') Desafortunadamente, no existe tal contain.element .
Lo sé, hay .should('contain.html','...') pero no funciona para mí porque esto requeriría que especifique la cadena html completa, incluido el contenido anidado (con tr, td). Solo quiero afirmar que ambos elementos secundarios thead y tbody existen.
Otra forma sería crear una matriz de elementos y usar un bucle forEach() para afirmar que son visibles, algo como esto:
const elements = ['table thead', 'table tbody'] elements.forEach((ele) => { cy.get(ele).should('be.visible') })Actualización: Bien, me perdí tu nota relacionada con .should('contain.html'..) . Por lo general, contain.html devuelve true si un nodo es descendiente de un nodo de destino, sin importar si tiene tres nodos secundarios profundos.
Puede usar should en combinación con and . .and() produce el mismo sujeto que se le dio en el comando anterior:
cy.get('table') .should('contain.html','thead') .and('contain.html','tbody')Prueba jQuery .has()
cy.get('table') .should($table => { expect($table.has('thead')).to.eq(true) expect($table.has('tbody')).to.eq(true) })O lo mismo en una línea
cy.get('table:has(thead):has(tbody)') // pseudo selector :has()O lo mismo en un selector
cy.get('table thead, table tbody') // jQuery Multiple Elements Selector .should('have.length', 2) // passes if both exist