Как запросить, если VueJs / Vuetify в настоящее время анимирует?

Question

Для Angular и Jquery можно проверить, что-то на странице в данный момент анимируется. Например, я могу просто использовать селектор css ".ng-animating", чтобы проверить, есть ли на каких-либо элементах класс анимации.

Мы часто используем это для нашей конечной 2-й автоматизации тестирования, например только утверждать, если элементы отображаются на странице после того, как пользователь сделал какое-то действие. Мы просто подождем, пока элементы не будут иметь ".ng-animating class".

Мы начали использовать Vue для нескольких новых проектов, и я пытаюсь также выяснить, возможно ли это, поэтому запросите какой-нибудь атрибут или установите какое-либо событие, когда оно начинает анимацию и заканчивает анимацию. Кто-нибудь знает как? Или есть другой подход, который также будет работать?

Answer 1

Согласно документам есть 6 классов для анимации

enter-class
enter-active-class
enter-to-class (2.1.8+)
leave-class
leave-active-class
leave-to-class (2.1.8+)

Возможно, вы можете использовать пару из них.

Answer 2

При работе с приложениями, созданными с Angular и / или jQuery, запросить атрибут class ng-animating Вы можете вызвать WebDriverWait и можете использовать следующие java на основе Стратегии локатора :

• Когда это начинает анимацию использовать ExpectedConditions как visibilityOfElementLocated () :

  new WebDriverWait(driver, 20).until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector(".ng-animating")));
  

• Когда он заканчивает анимацию, используйте ExpectedConditions as invisibilityOfElementLocated () :

  new WebDriverWait(driver, 20).until(ExpectedConditions.invisibilityOfElementLocated(By.cssSelector(".ng-animating")));