Question

让我更具体一点。生产中的代码运行良好（控制台中没有错误或异常）。但是，当我尝试进行测试时，它不能很好地工作。

这是我的指令模板的相关部分：

<form ng-if="totalOrganizations > numOrganizationsForSearch" class="search">
            <input type="text" class="form-control" placeholder="Search for..." ng-model="searchText"/>
        </form>

我的角度指令的相关位：

module.exports = function portalSwitcher($state, $window) {
    return {
        restrict: 'E',
        replace: true,
        scope: {},
        template: template,
        link: function(scope, element) {
            scope.totalOrganizations = 0;
            scope.searchText = "";

       // more code here

我可能在测试时遗漏了一些东西。如果条件ng-if="totalOrganizations > numOrganizationsForSearch"不为真，则测试很有效，因此它不会在我的指令DOM中添加input字段。但是，当这个条件成立时，我的测试会失败：

TypeError: document.createElement is not a function
        at Object.hasEvent (dist/d16cd293c8e995aad0be/vendor.js:22558:34)
        at baseInputType (dist/d16cd293c8e995aad0be/vendor.js:26751:17)
        at textInputType (dist/d16cd293c8e995aad0be/vendor.js:26702:4)
        at pre (dist/d16cd293c8e995aad0be/vendor.js:27292:63)
        at invokeLinkFn (dist/d16cd293c8e995aad0be/vendor.js:13719:10)
        at nodeLinkFn (dist/d16cd293c8e995aad0be/vendor.js:13192:12)
        at compositeLinkFn (dist/d16cd293c8e995aad0be/vendor.js:12609:14)
        at nodeLinkFn (dist/d16cd293c8e995aad0be/vendor.js:13208:25)
        at compositeLinkFn (dist/d16cd293c8e995aad0be/vendor.js:12609:14)
        at publicLinkFn (dist/d16cd293c8e995aad0be/vendor.js:12489:31)
    Error: Declaration Location
        at window.inject.angular.mock.inject (node_modules/angular-mocks/angular-mocks.js:2488:25)
        at Suite.<anonymous> (spec/shared/portalSwitcher.spec.js:168:24)

如果我从ng-model删除了input属性，我根本就没有得到此错误。所以我开始查看角度代码并找到代码失败的地方：

https://github.com/angular/angular.js/blob/v1.4.9/src/ng/sniffer.js#L34

function $SnifferProvider() {
          this.$get = ['$window', '$document', function($window, $document) {
            var eventSupport = {},
                android =
                  toInt((/android (\d+)/.exec(lowercase(($window.navigator || {}).userAgent)) || [])[1]),
                boxee = /Boxee/i.test(($window.navigator || {}).userAgent),
                document = $document[0] || {}, //$document[0] is just an empty object here

            //more code...

if (isUndefined(eventSupport[event])) {
                  var divElm = document.createElement('div'); //exception line. document object is empty and therefore doesn't have createElement function
                  eventSupport[event] = 'on' + event in divElm;
                }

似乎有任何奇怪的原因，$document[0]对象是空的。这似乎从阅读不应该是这种情况的代码。我假设我的一些测试设置是错误的（这是我的第一个指令测试）。相关代码在这里：

    beforeEach(module('app.shared', function($provide) {
            $provide.value('Service1', Service1);
            //other dependencies
        }));

   beforeEach(function() {
      //setup that makes the condition above return true
      //and add ng-model to DOM.
   });

   beforeEach(inject(function($compile, $rootScope) { //it fails at this line
                elm = $compile('<portal-switcher />')($rootScope.$new());
                scope = elm.isolateScope();

                scope.listPortals();
                scope.$digest();
            }));

我尝试修复在我的测试中使用$document对象从我的测试中提供document（这不是一个空对象并包含createElement函数），但仍然是同样的错误。

我在Duckduckgo或Google中找不到任何类似的错误。

我使用棱角1.4.9，角度嘲讽1.4.9。我不认为这个问题与版本有关，但是我无法找到有关它的角度github回购的任何问题。

感谢任何帮助。

在进行单元测试时在角度指令中使用ng-model时出错

0 个答案: