3

Let me be a little bit more specific. The code in production works very well (no errors or exceptions in the console). However when I try to do the testing, it doesn't work very well.

This is the relevant bit of my directive template:

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

The relevant bit of my angular directive:

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

I am probably missing something with my testing. The tests works well if the condition ng-if="totalOrganizations > numOrganizationsForSearch" is not true and therefore it does not add the input field in my directive DOM. However, when this condition is true, my tests fails like that:

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)

It turns out if I remove the ng-model attribute from my input I don't get this error at all. So I started to look at the angular code and found where the code is failing:

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;
                }

It seems for any weird reason, the $document[0] object is empty. Which seems from reading the code that shouldn't be the case. I assume some of my test setup is wrong (this is my first directive test). The relevant code is here:

    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();
            }));

I tried to fix that providing $document in my test with the document object from my test (which is not an empty object and contains the createElement function) but still same error.

I couldn't find any similar error in Duckduckgo or Google.

I am using angular 1.4.9, angular mocks 1.4.9 as well. I don't think the problem is related to the versions though, I wasn't able to find any issues on angular github repo about that.

Any help is appreciated.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.