Início / coding / Perguntas / 79573339
Accepted
Matej Vesel
Asked: 2025-04-14 22:08:31 +0800 CST

Uso repetido de cy.wrap()

  • 772

No código abaixo, por que tenho que repetir cy.wrap(article)em vez de encapsulá-lo uma vez e armazenar o resultado encapsulado em uma variável reutilizável, como mostrado na linha três?

verifyArticleContent(article: JQuery<HTMLElement>, expected_article: Topic) {
            // Wrapping once does not work.
            // const article2 = cy.wrap(article)

            // Title
            cy.wrap(article).find('h2 a')
                .should('have.text', expected_article.title)
                .and('have.attr', 'href', '/forum/discussion/' + expected_article.id)

            // Description
            cy.wrap(article).find('p.data-description').should('have.text', 
                expected_article.description.substring(0, 300) + ' ...')

            // Details
            cy.wrap(article).find('p.data-author-date').should('have.text',
                expected_article.user?.username + ', ' +                          // username
                Util.dateToString(expected_article.date, 'en'))                   // date
}

Mais esclarecimentos e um exemplo de como pensei que funcionaria:

verifyArticleContent(article: JQuery<HTMLElement>, expected_article: Topic) {
            // Wrapping once does not work.
            const article2 = cy.wrap(article)

            // Title
            article2.find('h2 a')
                .should('have.text', expected_article.title)
                .and('have.attr', 'href', '/forum/discussion/' + expected_article.id)

            // STOPS WORKING HERE. If I comment out this description check, it fails on the details with the same (almost) error.
            // Description
            article2.find('p.data-description').should('have.text', 
                expected_article.description.substring(0, 300) + ' ...')

            // Details
            article2.find('p.data-author-date').should('have.text',
                expected_article.user?.username + ', ' +                          // username
                Util.dateToString(expected_article.date, 'en'))                   // date
}

imagem da mensagem de erro

typescript

1 respostas

  1. Best Answer

    O Cypress funciona com comandos encadeados, onde o "assunto" do teste é passado pela cadeia.

    O forte conselho dado aqui em Conceitos básicos é não usar o valor atribuído da cadeia, pois esse assunto pode ser alterado durante a cadeia.

    Não é possível atribuir ou trabalhar com os valores de retorno de nenhum comando Cypress. Os comandos são enfileirados e executados de forma assíncrona.

    Para ilustrar, aqui está um exemplo mínimo que faz exatamente o que seu código está fazendo.

    cy.visit('https://example.com');
cy.get('body').then($body => {

  const body = cy.wrap($body)

  body.find('p a')
    .should('have.text', 'More information...')
    .and('have.attr', 'href', 'https://www.iana.org/domains/example')
    .then($subject => {
      console.log($subject[0])
    })

  body.find('h1')
    .should('have.text', 'Example Domain')
})

    Estou criando seu article: JQuery<HTMLElement>parâmetro cy.get('body').then($body =>e aplicando cy.wrap()a ele o mesmo que você fez.

    Depois .and('have.attr', 'href', ...adicionei um log de console para inspecionar o assunto atual.

    A saída do console é

    <a href="https://www.iana.org/domains/example">More information...</a>

    então o sujeito não é mais body, é o <a>elemento.

    A mensagem de falha do Cypress informa exatamente o que está acontecendo:

    Esperava-se encontrar o elemento: h1, mas nunca o encontrei. Consultado de:<a>

    insira a descrição da imagem aqui

    • 2

relate perguntas