visiting a dynamic link that opened in new tab in cypress

Question

Scenario:

While clicking a link/button in the application, a new tab is opened (with a dynamic url)

Is there a way in cypress to test somethings in the newly opened tab?

I cannot use cy.visit() as the url generated will be different each time

Answer 1

As per Cypress official documentation, this is not supported: https://docs.cypress.io/guides/references/trade-offs.html#Multiple-tabs

Perhaps you can test that the link has some particular attributes:

cy.get('a[href="/foo"]').should('have.attr', 'target', '_blank')

or you can follow this: https://github.com/cypress-io/cypress-example-recipes/tree/master/examples/testing-dom__tab-handling-links

• Test anchor links opening in new tabs: .
• Test anchor links that link to external domains: .
• Prevent content from opening in a new tab.
• Request external content that would open in a new tab using cy.request().
• Speed up tests by reducing loading times.

But there is no way you can switch to a newly opened tab like many Testers are used to from Selenium.

Answer 2

Here is a workaround to test the links that open in new tabs. You can open it in the same window. Here is the sample code for that:

For example, in case of below html:

<a id="abc" class="btn-style" href="http://www.xyz.com/" target="_blank">example</a>

Now, let's assume that in above case the url value for attribute href changes every time.

You can check it using below code. It will open this link in the same window (if that's ok with you.)

cy.get('abc').then (function(ln) { const url= ln.prop('href') cy.vist(url) })