tengo este codigo
cy.visit('http://localhost:3000/') cy.get('.list').each((list, index, lists) => { cy.contains('Learn').click() cy.url().should('include', '/localhost') cy.get(`[data-testid="card-input-${index}"]`) .type('Learn Cypress') .should('have.value', 'Learn Cypress') cy.get(`[data-testid="btnAdd-${index}"]`).click() cy.get(".card").each((card, index, cards) => { cy.get(cards).should('have.length', 4) }) })Necesito esta línea para devolver solo tarjetas de la lista específica. Ahora mismo devuelve todas las cartas de todas las listas.
cy.get(cards).should('have.length', 4)Intenté jugar con literales, pero devolvió [objeto objeto]
cy.get(`${cards}>card`).should('have.length', 4)Entonces, el primero each está recorriendo la lista y asumo que dentro de la lista desea acceder a las tarjetas, entonces puede hacer algo como esto:
cy.visit('http://localhost:3000/') cy.get('.list').each((list, index, lists) => { cy.contains('Learn').click() cy.url().should('include', '/localhost') cy.get(`[data-testid="card-input-${index}"]`) .type('Learn Cypress') .should('have.value', 'Learn Cypress') cy.get(`[data-testid="btnAdd-${index}"]`).click() cy.wrap(list).within(() => { cy.get('.card').should('have.length', 4) //or cy.get('.card').its('length').should('eq', 4) //or cy.get('.card') .its('length') .then((len) => { cy.get('.card').should('have.length', len) }) }) })La razón por la que ha estado obteniendo todas las tarjetas de todas las listas se debe a la búsqueda de cy.get() desde el elemento DOM raíz. Para limitar su búsqueda a un elemento DOM anterior, querrá usar .within() o .find() .
cy.visit('http://localhost:3000/') cy.get('.list').each((list, index) => { cy.contains('Learn').click() cy.url().should('include', '/localhost') cy.get(`[data-testid="card-input-${index}"]`) .type('Learn Cypress') .should('have.value', 'Learn Cypress') cy.get(`[data-testid="btnAdd-${index}"]`).click() cy.wrap(list) .find('.card') .should('have.length', 4) })