0

当我只使用编译和链接设置测试时，该指令被触发，但该元素仅存在于边缘，因为如果我没有明确地将其添加到 DOM，则下面的测试将失败。

我只是想知道我是否应该将预编译添加angular.element(...)到 DOM 或已编译/链接中linkFr(scope)，或者我是否要解决这一切都错了。

测试设置

beforeEach(inject(function ($rootScope, $compile) {

    var linkFn, el;

    rootScope = $rootScope;

    scope = $rootScope.$new();

    el = angular.element('\
        <a id="testClickConfirm" href="" ng-click="deleteFn()" click-confirm="Test confirmation message">Delete</a>\
    ');

    // $('body').append(el);

    // The $compile method returns the directive's link function
    linkFn = $compile(el);

    // The link function returns the resulting DOM object
    element = linkFn(scope);

    $('body').append(element);

}));

测试

只要我调用其中一个$('body').append(el);或$('body').append(element);所有测试通过，否则它们都会失败。

it('should be added to dom',function(){

    expect(element).toExist();
    expect(element).toBeInDOM();
    expect(element).toBeVisible();

    expect(el).toExist();
    expect(el).toBeInDOM();
    expect(el).toBeVisible();

    expect($('#testClickConfirm')).toExist();
    expect($('#testClickConfirm')).toBeInDOM();
    expect($('#testClickConfirm')).toBeVisible();

}));
4

1 回答 1

1

据我所知，当您的测试依赖于浏览器来计算某些东西（例如元素的大小）时，您只需要将元素附加到 DOM。如果这不是必需的，那么您可以将其留在“边缘”中。

在您需要元素位于 DOM 中的情况下，使用编译版本就足够了。我想不出在编译之前将“原始”元素附加到 DOM 的任何场景都是有用的。

于 2014-02-06T22:41:50.500 回答