Question

在我的量角器测试中，我想测试在我的应用程序中发生错误时显示的警报。 HTML是这样的：

<uib-alert type="danger" dismiss-on-timeout="5000" close="closeAlert()">
    <span>Error Message</span>
</uib-alert>

测试代码如下所示：

...
element(by.css('.alert-danger')).getText().then(function(text) {
  expect(text).to.equal('Error Message')
})
...

量角器等待5000毫秒超时完成，测试失败并显示错误消息：

NoSuchElementError: No element found using locator: By(css selector, .alert-danger)

如果我删除测试通过的dismiss-on-timeout属性。如果我设置

browser.ignoreSynchronization = true

然后量角器不会等待超时，但测试失败并显示相同的消息。

我可以通过修改UibAlertController来使用$interval而不是$timeout来解决此问题（该解决方案有效，因为量角器不会等待$interval）

那么，有更好的解决方案吗？ - 一个不要求我分叉angular-ui-bootstrap的人吗？

Answer 1

好吧，正如Rob J所说，这是Protractor的一个问题，而不是Angular ui-bootstrap。

如果它对任何人都有用，这是我的UibAlertController版本：

.controller('UibAlertController', ['$scope', '$attrs', '$interpolate', '$interval', function($scope, $attrs, $interpolate, $interval) {
  $scope.closeable = !!$attrs.close;

  var dismissOnTimeout = angular.isDefined($attrs.dismissOnTimeout) ? $interpolate($attrs.dismissOnTimeout)($scope.$parent) : null;

  if (dismissOnTimeout) {
    var alertInterval = $interval(function() {
      $scope.close();
      $interval.cancel(alertInterval);
    }, parseInt(dismissOnTimeout, 10));
  }
}])

当然，您还应该重构单元测试alert.spec.js：

describe('uib-alert', function() {
  var element, scope, $compile, $templateCache, $interval;

  beforeEach(module('ui.bootstrap.alert'));
  beforeEach(module('uib/template/alert/alert.html'));

  beforeEach(inject(function($rootScope, _$compile_, _$templateCache_, _$interval_) {
    scope = $rootScope;
    $compile = _$compile_;
    $templateCache = _$templateCache_;
    $interval = _$interval_;

...

  it('should close automatically if dismiss-on-timeout is defined on the element', function() {
    scope.removeAlert = jasmine.createSpy();
    $compile('<uib-alert close="removeAlert()" dismiss-on-timeout="500">Default alert!</uib-alert>')(scope);
    scope.$digest();

    $interval.flush(1000);
    expect(scope.removeAlert).toHaveBeenCalled();
  });

  it('should not close immediately with a dynamic dismiss-on-timeout', function() {
    scope.removeAlert = jasmine.createSpy();
    scope.dismissTime = 500;
    $compile('<uib-alert close="removeAlert()" dismiss-on-timeout="{{dismissTime}}">Default alert!</uib-alert>')(scope);
    scope.$digest();

    $interval.flush(100);
    expect(scope.removeAlert).not.toHaveBeenCalled();

    $interval.flush(500);
    expect(scope.removeAlert).toHaveBeenCalled();
  });
});

Answer 2

关于量角器处理$ timeout的问题一直在讨论，请参阅角度ui-bootstrap回购上的this问题，该回购在量角器回购中引用this问题。

量角器使用dismiss-on-timeout属性测试ui-bootstrap-alert

2 个答案: