javascript - Karma/jasmine Angular 指令提交点击单元测试在成组运行时失败，但不是单独运行

Question

我有一个 Angular Directive(指令)，其中有 <form>其中 ng-submit 绑定(bind)到指令 Controller 中的函数。单独编写代码并运行单元测试就可以了。

问题是当运行所有单元测试时，我们会看到类似的行为

  PhantomJS 1.9.8 (Mac OS X 0.0.0) ERROR
  Some of your tests did a full page reload!
allMessages PhantomJS 1.9.8 (Mac OS X 0.0.0) ERROR
  Some of your tests did a full page reload!
PhantomJS 1.9.8 (Mac OS X 0.0.0) ERROR
  Some of your tests did a full page reload!

这是单元测试:

it('Verify submit button is clicked', function () {
            var btnSubmit = form.querySelector('#submit');                 
            btnSubmit.click();

            timeout.flush();
            expect(scope.blah).to.equal(blah);}

当我注释掉 btnSubmit.click() 时，一切都会正常。

这是 html:

<paper-dialog modal class="pa-paper-dialog" id="blah" role="alertdialog">
    <paper-button 
        dialog-dismiss 
        class="close-button" 
        ng-click="resetPA(event)"> 

    </paper-button>
    <form class="blah" is="iron-form" ng-submit="submitFunction(blah)" method="get" action="/" id="form">
        <div class="pa-header">text</div>
        <div class="input-fields-panel"></div>
        <div class="buttons-panel">
            <button type="submit" class="blah" id="submit">Admit</button>
            <paper-button noink dialog-dismiss class="blah" ng-click="resetPA(event)">Cancel</paper-button>
        </div>
    </form>
</paper-dialog>

知道为什么吗？

谢谢!

Answer 1

我们最终采取了另一条路线来处理这个问题......

我们尝试访问isolateScope并直接在测试中调用提交函数，而不是使用按钮click()来提交表单。

var elem = $compile('<my-directive></my-directive>')(scope);
scope.$digest();
isolateScope = angular.element(elem).isolateScope() || angular.element(elem).scope();

scope.mySubmitfunction(blah blah);

这样，我们就不会在单元测试中看到任何问题，一切都会通过。