Как использовать значения из DOM в тесте кипариса?

Question

если у меня есть страница, содержащая:

  <span data-testid="credit-balance">
    10
  </span>

Как в Cypress извлечь значение из переменной для использования в тестах?

Что-то вроде:

const creditBalance = cy.get('[data-testid="credit-balance"]').value();

Answer 1

Если вы хотите получить значение и выполнить с ним какие-либо утверждения, быстрым и эффективным методом также будет использование .invoke

it('Getting the value and performing an assertion', () =>{
   cy.get('selector').invoke('val').should('eq',10) 
})

Doc

Answer 2

Назначение возвращаемых значений с помощью const, var и let считается анти-паттерном при использовании Cypress.Тем не менее, когда вы обнаружите, что хотите это сделать, лучше всего выполнить это с помощью замыканий.

it("uses closures to reference dom element", () => {

   cy.get("[data-testid=credit-balance]").then(($span) => {

   // $span is the object that the previous command yielded

   const creditBalance = $span.text();

   cy.log(creditBalance);

  })

});

Другой способ сделать это - использовать псевдонимы, если вы хотите хранить и сравнивать значения или делиться значениями между тестами, используя хуки.

it("aliasing the value from dom element", () => {

  cy.get("[data-testid=credit-balance]").as("creditBalance")

  cy.get("@creditBalance").should("contain", 10)

});

Как вы к этому подходите, зависит от цели вашего теста.Я рекомендую ознакомиться с другими примерами из документации: попробуйте Переменные и псевдонимы , Best Practices и FAQ