Блог

Главная - Вопросы по программированию - Cypress проверяет, содержит ли значение поля ввода несколько строк

Cypress проверяет, содержит ли значение поля ввода несколько строк

#javascript #cypress

Вопрос:

Я хочу проверить с помощью теста cypress, правильно ли значение в однострочных текстовых полях и многострочной текстовой области.

Здесь у меня есть однострочное поле, в котором я использую приведенный ниже код для добавления ввода:

cy.followLabel("When did the incident happen?").type("single nline");

То же самое для многострочной текстовой области

cy.followLabel("Deenter code herescribe what happened").type("multiple nlines");

введите описание изображения здесь

Я попытался проверить это с помощью .должен (), но не нашел ни одной цепочки, которая соответствовала бы моим потребностям.

Есть ли что-то подобное .contains("n") ?

Ответ №1:

Вы можете напрямую проверить, что во внутреннем тексте есть символ новой строки n .

 cy.get('selector').then(($ele) => {
  expect($ele).to.contain('n')
})

В случае, если ваш внутренний текст не содержит символов новой строки, вы утверждаете тег стиля, содержащий overflow-wrap: break-word 

 cy.get('selector').should('have.attr', 'style').and('include', 'overflow-wrap: break-word')

Комментарии:

1. Это все еще дает мне ошибку: expected '<textarea#id2196071612292268033.big.valid>' to contain 'n' . Я считаю, что он ищет строку «n» и, следовательно, выдает ошибку

2. можете ли вы извлечь внутренний текст и рассказать мне, что вы получаете, или вы также можете опубликовать html-код с присутствующим многострочным значением.

3. В одном поле я получаю: «одна строка». В многострочном я получаю: «несколько строк».

4. можете ли вы опубликовать свой html-код с добавлением необходимого текста в многострочную текстовую область?

5. Спасибо за HTML. Поэтому, поскольку я не вижу никакого текста, я предполагаю, что текст не отражается как внутренний текст в текстовой области. Поэтому следующим вариантом было бы сравнить Style атрибут как для однострочной текстовой области, так и для многострочной текстовой области. Компонент, который является дополнительным или отличается в многострочном, то вы можете утверждать. Мое предположение состоит в том , что для многострочного тега стиля будет overflow-wrap: break-word , поэтому я обновил ответ этим.

Ответ №2:

Я знаю, что есть утверждение «совпадение» для регулярного выражения.

 match(RegExp)
Aliases: matches    
expect('testing').to.match(/^test/)

(из https://docs.cypress.io/guides/references/assertions)

Таким образом, в вашем случае регулярное выражение может быть match(/.*n.*/gm)

Ответ №3:

Библиотека утверждений Chai содержит singleLine утверждение в модуле chai-string.

Однолинейный
утверждайте.singleLine(«abcdef»);
ожидайте(«abcdef»). быть.singleLine();

Чтобы использовать утверждения из других библиотек, см. раздел Рецепт Cypress, добавляющий утверждения Chai

Простой пример

Устанавливать

 yarn add -D chai-string

//or

npm install -D chai-string

Тест

 chai.use(require('chai-string'));

it('tests for singleLine', () => {

  cy.get('input')
    .type("single nline")
    .invoke('val')
    .should('be.singleLine')  // passes

  cy.get('textarea')
    .type("multiple nlines")
    .invoke('val')
    .should('not.be.singleLine')  // passes
})

введите описание изображения здесь

Ответ №4:

Я нашел более простое решение. Просто добавьте should с цепочкой «have.value» в свой элемент DOM, а затем вы сможете проверить наличие новых строк.

 .should('have.value','multiplenlines');
Метки: ,