茉莉花单元测试元素不是:隐藏

时间:2014-02-07 09:33:09

标签: jquery angularjs jasmine

我有一个AngularJS指令,我正在为它编写测试。我在这个问题中重新创建了问题:http://plnkr.co/edit/gHoGwI6TZhsgKVwIb1uI?p=preview

谁能告诉我为什么第二次测试失败以及如何解决?

代码:

var app = angular.module("myApp", []);
app.directive("myDirective", function() {
  return {
    template: "<div>Hello this is my directive!</div>"
  }
  });

describe("Testing hidden", function() {
  var $compile, $scope, $document;

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

  function getElement() {
    var element = angular.element("<div my-directive></div>");
    $compile(element)($scope);
    return element;
  }

  it("passes", function() {
    var element = getElement();
    expect(element.is(":hidden")).toBe(true); // Passes
  });

  it("fails", function() {
    var element = getElement();
    $document.body.append(element);
    element.show();
    expect(element.is(":hidden")).toBe(false); // Fails
  });

  });

1 个答案:

答案 0 :(得分:5)

您需要将您的元素添加到DOM中;

我已使用快速解决方案更新了您的代码。当然,您可以将它添加到beforeEach中的DOM,并在afterEach中将其从DOM中删除。

http://plnkr.co/edit/wRLhak1rDqnqfHMbKoWs?p=preview