Кипарис. Сохранение текстового элемента для использования для утверждения

Question

У меня проблемы с сохранением элемента в виде текста, чтобы использовать его позже для утверждения.

cy.getR6('contact-lastName').clear().type('TestarNameChange').then((nameCheck) => {

  cy.getR6('contact-lastName').invoke('text').as('nameCheck');

  cy.get('.r6modal-buttons-right > .r6btn').click();

  cy.get('.r6loader').should('not.be.visible');

  cy.get('[r6-personal-details=""] > :nth-child(1) > .r6widget > .r6widget-content').contains(this.nameCheck);
})

Ответ, который я получаю от Cypress: "cy.contains () может принимать только строку, число или регулярное выражение. "

Я также пробовал использовать способ $ div:

cy.getR6('contact-lastName').then(($div) => {
    var nameCheck = $div.text()

    cy.get('.r6modal-buttons-right > .r6btn').click();
    
    cy.get('[r6-personal-details=""] > :nth-child(1) > .r6widget > .r6widget- content').contains(this.nameCheck);

Также пытался обернуть его, с аналогичным успехом. })

Answer 1

Если вы хотите проверить, содержит ли какой-либо элемент текст, используйте это:

cy.get('[r6-personal-details=""] > :nth-child(1) > .r6widget > .r6widget- content').should('contain', this.nameCheck);

Answer 2

Есть несколько ошибок, которые вы сделали в обоих ваших испытаниях. Чтобы объяснить это, я разобью ваш код на 4 части (блок 1)

//Step 1
cy.getR6('contact-lastName').clear().type('TestarNameChange').then((nameCheck) => {

//Step 2
  cy.getR6('contact-lastName').invoke('text').as('nameCheck');

//Step 3
  cy.get('.r6modal-buttons-right > .r6btn').click();
  cy.get('.r6loader').should('not.be.visible');

//Step 4
  cy.get('[r6-personal-details=""] > :nth-child(1) > .r6widget > .r6widget-content').contains(this.nameCheck);
})

Шаг 1. Вы пытаетесь ввести значения в поле ввода nameCheck, и вы указываете элемент поля ввода с помощью nameCheck внутри .then (на этом шаге нет ошибки)

Шаг 2 - Вы пытаетесь получить введенное значение фамилии и назначить его псевдониму.

Ошибки

• Вы можете получить текстовые значения элемента, используя invoke('text'), если желаемое значение представляет собой имя кнопки, текст абзаца и т. Д. c. Пример: (<button>Name</button> вернет «Имя» с invoke('text')) Но здесь я считаю, что вам нужно значение поля ввода. В этом случае вам нужно использовать invoke('attr','value'). (Здесь вам даже не нужно этого делать, ниже будет добавлен улучшенный код)

Шаг 3 - Вы нажимаете кнопку и ждете, пока загрузчик не отобразится. На этом шаге также нет ошибок.

Шаг 4. Вы пытаетесь проверить наличие значения, используя ранее созданный псевдоним

Ошибка

• Это одна из распространенных ошибок разработчиков cypress. Вы должны понимать асинхронную природу кипарисовика. В вашем коде при выполнении с шага 2 по шаг 4 все будет выполняться асинхронно. Это означает, что когда вы используете this.nameCheck, nameCheck не определяется. Поэтому вам нужно дождаться создания псевдонимов перед их использованием (вы можете использовать .then для этого)

Я добавляю фиксированный код ниже. Я также внес несколько изменений.

    //type the last name and refer the lastname object with the name "lastName"
    cy.getR6('contact-lastName').clear().type('TestarNameChange').then((lastName) => {

        //extract the value of lastname object with .val() and wrap it with cy.wrap
        // assign the wrapped value to aliase named "nameCheck"
        //You can use  cy.getR6('contact-lastName').invoke('attr','value').as('nameCheck');insted of the below code too
        cy.wrap(lastName.val()).as('nameCheck').then(() =>{

        //As you can see, since we used .then, the next steps will be executed after the aliase is created
        cy.get('.r6modal-buttons-right > .r6btn').click();
        cy.get('.r6loader').should('not.be.visible');
        cy.get('[r6-personal-details=""] > :nth-child(1) > .r6widget > .r6widget-content').contains(this.nameCheck);
        })
      })

Во втором коде одна из ошибок, которые вы сделали, - это использование this. для ссылки на определенную переменную.

И другая ошибка использует .text() для извлечения значения поля ввода (var nameCheck = $div.text()). Вы должны использовать .val()

Так что, если мы сделаем те же шаги блока 1, в соответствии с вашей второй попыткой, это будет выглядеть так.

        cy.getR6('contact-lastName').clear().type('TestarNameChange').then(($div) => {
            var nameCheck = $div.val()
            cy.get('.r6modal-buttons-right > .r6btn').click();
            cy.get('.r6loader').should('not.be.visible');
            cy.get('[r6-personal-details=""] > :nth-child(1) > .r6widget > .r6widget-content').contains(nameCheck);
        })

Случайно, если вы хотите чтобы использовать cy.getR6('contact-lastName').invoke('attr','value').as('nameCheck'), вы можете изменить мой первый сэмпл вот так:

    //Type text
    cy.getR6('contact-lastName').clear().type('TestarNameChange');
    //create alias and continue
    cy.getR6('contact-lastName').invoke('attr','value').as('nameCheck').then(() =>{
    cy.get('.r6modal-buttons-right > .r6btn').click();
    cy.get('.r6loader').should('not.be.visible');
    cy.get('[r6-personal-details=""] > :nth-child(1) > .r6widget > .r6widget-content').contains(this.nameCheck);
    })