Блог

У меня есть список, в котором перечислены данные, полученные из javascript. Как проверить данные javascript с помощью cypress. Я пытаюсь автоматизировать проект. Прилагается скриншот функций. как проверить данные javascript с помощью cypress?

Тест, как правило, должен следовать тому, как вы вручную проверяете страницу, например, при первой загрузке «Северная Америка» является активной страницей, поэтому проверьте, что ссылка активна.

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

Пример,

 cy.visit('https://my-vacation.com/home')

cy.contains('a.js-tab-links', 'North America')
  .should('have.class', 'active')                  // this link is active after loading

// Titles on the page
cy.contains('Galveston Vacation Rentals')
cy.contains('Sedona Vacation Rentals')
//  ... same for remaining titles

// Images on the page
cy.get('img[src="galveston-island-historic-pleasure-pier.jpg"]')
// ... same for other images


// Other tabs
cy.contains('a.js-tab-links', 'South America')
  .click()                                      // activate this tab
  .should('have.class', 'active')

// Titles on the page
cy.contains('Peru Vacation Rentals')
cy.contains('Argentina Vacation Rentals')
//  ... same for remaining titles

// Images on the page
cy.get('img[src="machu-pichu.jpg"]')
// ... same for other images
 

Вы можете разбить его так, чтобы в каждом разделе был свой собственный тест

 before(() => {
  cy.visit('my-vacation.html')  // visit once before all the tests
})

it('North America', () => {
  cy.contains('a.js-tab-links', 'North America')
    .should('have.class', 'active')                  // this link is active after loading

  // Titles on the page
  cy.contains('Galveston Vacation Rentals')
  cy.contains('Sedona Vacation Rentals')
  //  ... same for remaining titles

  // Images on the page
  cy.get('img[src="galveston-island-historic-pleasure-pier.jpg"]')
  // ... same for other images
})

it('South America', () => {
  cy.contains('a.js-tab-links', 'South America')
    .click()                                      // activate this tab
    .should('have.class', 'active')

  // Titles on the page
  cy.contains('Peru Vacation Rentals')
  cy.contains('Argentina Vacation Rentals')
  //  ... same for remaining titles

  // Images on the page
  cy.get('img[src="machu-pichu.jpg"]')
  // ... same for other images
})

 

Вы можете напрямую утверждать любой из континентов напрямую, используя eq —

 cy.get('.location-selector ul li a').eq(0).should('have.text', 'North America')
cy.get('.location-selector ul li a').eq(1).should('have.text', 'South America')
 

И если вы хотите утвердить все континенты, вы также можете использовать a each и подтвердить —

 var continents = [
  'North America',
  'South America',
  'Europe',
  'Asia',
  'Australia/NZ',
  'Middle East/Africa',
]

cy.get('.location-selector ul li a').each(($ele, index) => {
  expect($ele.text().trim()).to.equal(continents[index])
})