Question

我为此指令编写了测试，显示了bootstrap工具提示：

.directive('mwTooltip', function () {
  return {
    restrict: 'A',
    scope: {
      text: '@mwTooltip',
      placement: '@'
    },
    link: function (scope, el) {
      scope.$watch('text', function () {
        el.data('bs.popover').setContent();
      });

      el.popover({
        trigger: 'hover',
        placement: scope.placement || 'bottom',
        content: function(){
          return scope.text;
        },
        container: 'body'
      });

      var destroyPopOver = function(){
        var popover = el.data('bs.popover');
        if (popover && popover.tip()) {
          popover.tip().detach().remove();
        }
      };

      scope.$on('$destroy', function () {
        destroyPopOver();
      });
    }
  };
})

此测试未通过：

describe('mwTooltip', function () {
  var $compile;
  var $rootScope;
  var scope;
  var el;
  var isolateScope;

  beforeEach(module('mwComponents'));

  beforeEach(inject(function (_$compile_, _$rootScope_) {
    $compile = _$compile_;
    $rootScope = _$rootScope_;
    scope = _$rootScope_.$new();

    el = angular.element(
      '<span mw-tooltip="Tooltip"></span>'
    );

    $compile(el)(scope);
    isolateScope = el.isolateScope();
    scope.$digest();
  }));

  afterEach(function () {
    scope.$destroy();

  });

  it('should show and remove a tooltip', function () {
    el.trigger('mouseover');
    expect(angular.element('.popover').text()).toEqual('Tooltip');

    el.trigger('mouseleave');
    expect(angular.element('.popover').text()).toEqual('');
  });

});

错误是：

PhantomJS 1.9.8 (Mac OS X 0.0.0): Executed 114 of 311 SUCCESS (0 secs / 0.446 secs)
PhantomJS 1.9.8 (Mac OS X 0.0.0) mwTooltip should show and remove a tooltip FAILED
Expected 'Tooltip' to equal ''.
  at /Users/mles/portal-admin/test/ui/mwComponents/mw-tooltip.js:34
PhantomJS 1.9.8 (Mac OS X 0.0.0): Executed 306 of 311 (1 FAILED) (skipped 5) (18.48 secs / 18.539 secs)

但是，如果我将测试作为单个测试运行，则可以正常运行（注意f之前的it）

fit('should show and remove a tooltip', function () {
  el.trigger('mouseover');
  expect(angular.element('.popover').text()).toEqual('Tooltip');

  el.trigger('mouseleave');
  expect(angular.element('.popover').text()).toEqual('');
});

还可以使用超时

it('should show and remove a tooltip', function (done) {
  el.trigger('mouseover');
  expect(angular.element('.popover').text()).toEqual('Tooltip');

  el.trigger('mouseleave');
  setTimeout(function(){
    expect(angular.element('.popover').text()).toEqual('');
    done();
  }, 1000);
});

这个测试只能作为单个测试或超时而不是与其他300测试一起运行的原因是什么？如果以前运行过其他测试，看起来像PhantomJS太慢而无法及时处理mouseleave。

用鼠标悬停测试＆amp; mouseleave仅适用于1000ms超时

0 个答案: