Блог

Главная - Вопросы по программированию - Тест работает без ошибок, но действие не завершено, используя cypress в проекте React

Тест работает без ошибок, но действие не завершено, используя cypress в проекте React

#reactjs #cypress

#reactjs #cypress

Вопрос:

Я установил плагин для cypress «cypress-drag-drop». Я получаю «элемент A» и перемещаю его в «Местоположение A». Ожидаемый результат: модальное всплывающее окно появляется после перемещения «элемента A» в «Местоположение A»

Я использую этот код:

 cy.get('.element:contains("element A")').drag('.user:contains("Location A")', {animationDistanceThreshold:true})

Тест работает без ошибок.
Но модальное всплывающее окно не появляется.

Кстати, поведение странное. Если я удерживаю «элемент A» и немного двигаюсь вверх, появляется модальное всплывающее окно. Это то, что мне нужно. Может быть, необходимо обработать какое-то ожидание или состояние? PS: это HTML-код проекта React:

 <!-- Element A -->
<div class="element" >
  <span class="name">element A</span>
</div>
<!-- Location A -->
<div class="animated infinite drag-block ">
  <div class="ant-card user  ant-card-bordered ant-card-hoverable" style="width: 240px;">
    <div class="ant-card-cover">
      <div class="user-header">
        <div class="user-name">
          <span class="user">Location A</span>
        </div>
      </div>
    </div>
    <div class="ant-card-body">
      <div class="ant-card-meta">
        <div class="ant-card-meta-detail">
        </div>
      </div>
    </div>
  </div>
</div>
<!-- Modal popup-->
<div class="ant-modal-content">
  <button type="button" aria-label="Close" class="ant-modal-close"></button>
</div>

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

1. <span class="loction"> — это опечатка в вашем вопросе или, может быть, также в вашей программе?

2. @Steve Zodiac, это class=»user» вместо «location». Я написал «местоположение» для лучшего понимания. Извините, если это вас смутило

3. LOL — что еще более важно, сбивает с толку Cypress! Спасибо за исправление.

4. Кстати, исходный код компонента React также полезен, если кто-то хочет воспроизвести. Это не показывает событие, которое вызывает модальное — это onDrop, onChange и т. Д. Возможно, вы можете догадаться, но, возможно, тратите время.