web-dev-qa-db-fra.com

Cypress get href attribut

J'ai un cas de test dans lequel j'ai un lien qui s'ouvre dans un nouvel onglet, et puisque cyprès ne supporte pas le multi-onglet, je veux obtenir l'attribut href de ce lien et l'ouvrir ensuite dans le même onglet, j'essaie de faites-le de cette façon, mais pour une raison quelconque, cela ne fonctionne pas.

it('Advertise link should refer to Contact page', () => {
    var link = document.querySelector("div.footer-nav > ul > li:nth-child(2) > a").href;
     cy.visit(link);
     cy.title().should('include', 'Text');
});
javascriptcypress
24
Max

Le code ci-dessous devrait faire ce que vous essayez d'atteindre. Il existe également un ensemble recette avec des suggestions sur la façon de tester les liens qui s'ouvrent dans de nouveaux onglets .

it('Advertise link should refer to Contact page', () => {
   cy.get('div.footer-nav > ul > li:nth-child(2) > a')
     .should('have.attr', 'href').and('include', 'contact')
     .then((href) => {
       cy.visit(href)
     })
})

Je suggérerais également de lire le document Cypress sur les meilleures façons d’affecter et de travailler avec des variables: https://on.cypress.io/variables-and-aliases

33
Jennifer Shehane

Solution 1: invoke("attr", "href")

Accédez à l'URL spécifiée dans l'attribut href de l'élément:

cy.get(selector)
      .invoke('attr', 'href')
      .then(href => {
        cy.visit(href);
      });

Référence: https://docs.cypress.io/api/commands/invoke.html#Function-with-Arguments

Solution 2: empêchez le contenu de s'ouvrir dans un nouvel onglet.

Supprimez l'attribut cible de l'élément d'ancrage, puis cliquez dessus pour accéder à son URL dans le même onglet:

cy.get(selector).invoke('removeAttr', 'target').click()

Référence: https://docs.cypress.io/examples/examples/recipes.html#Tab-Handling-and-Links

8
Mobiletainment