Как проверить детей элемента в кипарисе?

Question

Если у меня есть эти элементы

<div class="diffed-chunks">
    <div class="diffed-chunk diffed-chunk--pending"></div>
    <div class="diffed-chunk">1</div>
    <div class="diffed-chunk">2</div>
</div>

Есть ли более простой способ проверить это, чем сделать это?

cy.get('.diffed-chunks .diffed-chunk').as('diffed-chunks');
cy.get('@diffed-chunks')
  .eq(0)
  .should('have.class', 'diffed-chunk--pending');
cy.get('@diffed-chunks')
  .eq(1)
  .should('have.text', '1');
cy.get('@diffed-chunks')
  .eq(2)
  .should('have.text', '2')

Answer 1

Это вопрос мнения, но шаблон, который мне нравится, это

• определить ожидаемый массив
• выбрать все дочерние элементы по атрибутам, которые не проверяются
• сравнить фактический массив с ожидаемым

const expected = [
  {
    text: '',
    classes: 'diffed-chunk diffed-chunk--pending',
  },
  {
    text: '1',
    classes: 'diffed-chunk',
  },
  {
    text: '2',
    classes: 'diffed-chunk',
  },
];

const getText = el => el.textContent.trim()

it('should have expected text', () => {
  cy.get('.diffed-chunks div').then(els => { 
    const texts = [...els].map(getText)
    expect(texts).to.deep.eq(expected.map(x => x.text))
  })
});

const getClasses = el => el.className

it('should have classes', () => {
  cy.get('.diffed-chunks div').then(els => { 
    const classes = [...els].map(getClasses)
    expect(classes).to.deep.eq(expected.map(x => x.classes))
  })
});