Cypress нажмите кнопку, используя ключевое слово enter

#javascript #automated-tests #cypress

#javascript #автоматизированные тесты #cypress

Вопрос:

Я тестирую свое приложение и пытаюсь вызвать нажатие кнопки с помощью ключевого слова enter:

 <v-btn
    class="submit-button"
    block
    color="primary"
    @click="login"
  >
    Log In
</v-btn>

cy.get('.submit-button').type('{enter}');
 

Есть ли какой-либо альтернативный способ нажать кнопку при нажатии клавиши enter?

Я использую фреймворк и v-btn компонент vuetify.

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

Спасибо

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

1. Можете ли вы попробовать cy.get('.submit-button').type('{enter}', {force: true}); , предполагая, что используемый вами локатор правильный.

2. К сожалению, это воспроизводит ту же ошибку. Я обновил свой вопрос с помощью тега HTML, который я использую.

3. Привет. Как указано в ошибке, type для работы команды требуется типируемый элемент (input / textarea). Ваш код выдает тип элемента button, поэтому он терпит неудачу. Если у вас есть какой-либо элемент ввода / текстовой области на вашей странице, вы должны cy.get('input').type('{enter}')

4. @AlexIzbas посмотрите на сообщение — кнопка является типизируемым элементом.

Ответ №1:

Vue переводит

 <v-btn class="submit-button">Log In</v-btn>
 

в

 <button class="submit-button">
  <span class="v-btn__content">Log In</span>
</button>
 

Логически этот тест

 cy.get('.submit-button').type('{enter}');
 

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

Исправление заключается в том, чтобы вставить a .focus() перед .type() командой.

 cy.get('.submit-button').focus().type('{enter}');
 

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

1. Спасибо за ваш ответ. Каким-то образом второй случай с выбором родительского элемента виден и найден cypress, но как только я пытаюсь ввести (‘{enter}’), он воспроизводит ту же ошибку, что и раньше. Каким-то образом он продолжает вводить enter в span вместо button.

Ответ №2:

Попробуйте отправить всю форму целиком. Смотрите здесь — Cypress отправляет документы. Он манипулирует подстановкой с помощью enter.

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

1. Кнопка не является частью области формы. Поэтому я не могу добиться отправки в форме. Но спасибо за участие в обсуждении