How to check for all the links on the page and check the values of 'rel' and 'target' attributes as well as the destination status (200) in Cypress?

Question

I'm trying to find all the affiliate links on the page and the links should have the ff: attributes: target="_blank" rel="nofollow noopener sponsored" also I need to check the status of each link. and it should be 200.

Appreciate all the help.

Are you looking to do this for only one page or multiple? – jjhelguero Feb 01 '22 at 22:22 — jjhelguero, Feb 01 '22 at 22:22
multiple pages. maybe 10 pages. – QAtest11 Feb 02 '22 at 14:20 — QAtest11, Feb 02 '22 at 14:20

score 3 · Answer 1 · answered Feb 02 '22 at 15:36

If you can add a data-testid attribute to your affiliate links, that would make query cleaner and easier to maintain. Otherwise:

cy.get('[target=_blank] [rel="nofollow noopener sponsored"]') // could be simplier with data-test-ids for affiliate links only
  .each( $affiliateLink => {

      // check links have attributes
      expect($affiliateLink).to.have.attr('target', '_blank')
      expect($affiliateLink).to.have.attr('rel', 'nofollow noopener sponsored')

      // make a request to presumably external domains
      cy.request($affiliateLink.prop('href')) // may need to pass some options for request
        .its('status')
        .should('eq', 200)
  })

Alapan Das · Answer 2 · 2022-02-02T19:29:46.920

0

You can do something like this. Using each() you can iterate over all the links and then check whether they are broken or not and also check that the links have target="_blank" and rel="nofollow noopener sponsored".

cy.get('a').each(($ele) => {
  cy.wrap($ele)
    .invoke('attr', 'href')
    .then((href) => {
      cy.request(href).then((response) => {
        expect(response.status).to.eq(200)
      })
    })
  cy.wrap($ele)
    .should('have.attr', 'target', '_blank')
    .and('have.attr', 'rel', 'nofollow noopener sponsored')
})

Now, If you just want to check that the links have the attributes target and rel and then check whether those links return 200, then you can do like:

cy.get('a').each(($ele) => {
  if (
    $ele.attr('target') == '_blank' &&
    $ele.attr('rel') == 'nofollow noopener sponsored'
  ) {
    cy.request($ele.attr('href').trim()).its('status').should('eq', 200)
  }
})

edited Feb 02 '22 at 19:29

answered Feb 02 '22 at 06:07

Alapan Das

17,144
3
29
52

maybe not all the links, coz not all links will have the same attributes (navbar links). My focus is on the affiliate links on the page. – QAtest11 Feb 02 '22 at 14:22
So you want to test that when the links have target and rel attribute then it should be 200 ? – Alapan Das Feb 02 '22 at 16:58
pretty much, yes. – QAtest11 Feb 02 '22 at 19:05
Updated the answer. – Alapan Das Feb 02 '22 at 19:29
Thank you so much! Appreciate your help – QAtest11 Feb 02 '22 at 19:51

How to check for all the links on the page and check the values of 'rel' and 'target' attributes as well as the destination status (200) in Cypress?

2 Answers2