Как отключить анимацию в транспортирете для приложения angular js
Может кто-нибудь подскажет мне, как отключить анимацию в приложении angular js при выполнении испытаний транспортира. Я добавил код ниже в свой конфигурационный файл транспортира, но это мне не помогает:
var disableNgAnimate = function() {
angular.module('disableNgAnimate', []).run(function($animate) {
$animate.enabled(false);
});
};
browser.addMockModule('disableNgAnimate', disableNgAnimate);
Ответы
Ответ 1
Вы можете проверить конфигурацию транспортира angular:
https://github.com/angular/angular.js/blob/master/protractor-shared-conf.js
Вы должны добавить его в блок onPrepare:
onPrepare: function() {
/* global angular: false, browser: false, jasmine: false */
// Disable animations so e2e tests run more quickly
var disableNgAnimate = function() {
angular.module('disableNgAnimate', []).run(['$animate', function($animate) {
$animate.enabled(false);
}]);
};
browser.addMockModule('disableNgAnimate', disableNgAnimate);
Ответ 2
Я лично использую следующий код в функции "onPrepare" в файле "conf.js", чтобы отключить анимацию Angular/CSS:
...
onPrepare: function() {
var disableNgAnimate = function() {
angular
.module('disableNgAnimate', [])
.run(['$animate', function($animate) {
$animate.enabled(false);
}]);
};
var disableCssAnimate = function() {
angular
.module('disableCssAnimate', [])
.run(function() {
var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '* {' +
'-webkit-transition: none !important;' +
'-moz-transition: none !important' +
'-o-transition: none !important' +
'-ms-transition: none !important' +
'transition: none !important' +
'}';
document.getElementsByTagName('head')[0].appendChild(style);
});
};
browser.addMockModule('disableNgAnimate', disableNgAnimate);
browser.addMockModule('disableCssAnimate', disableCssAnimate);
}
...
Обратите внимание: я не писал выше код, я нашел его онлайн, ища способы ускорить мои собственные тесты.
Ответ 3
Отключение анимации/переходов CSS
В дополнение к отключению ngAnimation (т.е. element(by.css('body')).allowAnimations(false);
) вам может потребоваться отключить некоторую анимацию, которая была применена через CSS.
Я обнаружил, что это иногда способствует некоторым таким анимированным элементам, которые могут показаться, что Protractor может быть "clickable" (т.е. EC.elementToBeClickable(btnUiBootstrapModalClose)
), чтобы фактически не отвечать на .click()
и т.д.
В моем конкретном случае, я страдал от мода ui.bootstrap, который перешел внутрь и наружу, и я не всегда мог надежно нажать свою внутреннюю кнопку "закрыть".
Я обнаружил, что отключить анимацию css. Я добавил класс в таблицу стилей:
.notransition * {
-webkit-transition: none !important;
-moz-transition: none !important;
-o-transition: none !important;
-ms-transition: none !important;
transition: none !important;
}
... и в транспортимере у меня есть что-то вроде:
_self.disableCssAnimations = function() {
return browser.executeScript("document.body.className += ' notransition';");
};
Могут быть более легкие способы применения этой концепции, но я обнаружил, что вышеописанное очень хорошо работает для меня - в дополнение к стабилизации тестов они работают быстрее, так как они не ожидают анимации.
Ответ 4
Посмотрите это на примере: https://github.com/angular/protractor/blob/master/spec/basic/elements_spec.js#L123
it('should export an allowAnimations helper', function() {
browser.get('index.html#/animation');
var animationTop = element(by.id('animationTop'));
var toggledNode = element(by.id('toggledNode')); // animated toggle
// disable animation
animationTop.allowAnimations(false);
// it should toggle without animation now
element(by.id('checkbox')).click();
});
Ответ 5
@DavidPisoni
Кажется, это на первый взгляд. Тем не менее есть несколько вещей, которые вы можете проверить
-
в Protractor 2.0 вы должны вернуть обещание, если вы что-то делаете с браузером, например, в e2e-common stuff
-
Если вы используете angular -bootstrap, есть места, где они не используют $animate service, а вместо этого применяют анимацию через голый javascript