Vuetify Select Component и Cypress - PullRequest
Новая
       0

Vuetify Select Component и Cypress

0 голосов
/ 25 февраля 2020

У меня есть компонент с компонентом Vuetify Select: 

<v-select
  :items="corporations"
  label="Corporation name"
  data-test="corporation-name"
  outlined
></v-select>

И я хочу смоделировать выделение с помощью теста Cypress:

cy.get('[data-test="corporation-name"]').select('Thorgate');

К сожалению, Я не могу, и у меня есть это сообщение об ошибке: 

CypressError: cy.select() can only be called on a <select>. Your subject is a: <input data-test="corporation-name" id="input-13" readonly="readonly" type="text" aria-readonly="false" autocomplete="off">

Я также пытаюсь ввести значение с type(), но Cypress сказал мне 

CypressError: Timed out retrying: cy.type() failed because this element is readonly:

Любая идея, пожалуйста

1 Ответ

0 голосов
/ 26 февраля 2020

Ошибки довольно очевидны.

  • Вы пытаетесь применить метод cy.select() к тегу <input>, когда вам нужен тег <select>
  • Вы пытаетесь .type() в <input readonly>

cy.select() может применяться только к тегу <select>. Если ваш компонент v-select отображает "пользовательский выбор, который представляет собой набор динамических c делений и вводит INSTEAD для выбора" , то вам нужно создать собственную команду Cypress для обработки cy.customSelect() поведение. Например, он будет: щелкнуть по главной оболочке, найти вариант, набрав слова, и щелкнуть по нему ... поэтому выбрав опцию

Для второй, поскольку ваш ввод доступен только для чтения, вы можете попробовать использовать {force: true} в ваших настройках при наборе (cy.type("text", {force: true})

...