La prueba generalmente debe seguir la forma en que probaría manualmente la página, por ejemplo, al cargar por primera vez, "Norteamérica" es la página activa, así que pruebe que el enlace está activo.

Luego prueba que el contenido es correcto, tanto los títulos como las imágenes, y luego pasa a otras pestañas.

Un ejemplo,

 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

Puede dividirlo para que cada sección tenga su propia prueba

 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 })

Puede afirmar directamente cualquiera de los continentes directamente usando 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')

Y si desea afirmar todos los continentes, también puede usar each y validar:

 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]) })