存根DOM元素在茉莉花，angularjs

我最近已经开始使用茉莉花，我有一个奇怪的情况。我正在测试一个函数，用另一个函数调用进行DOM操作。茉莉花说错误elem.className不是一个构造函数。这里是我的代码的结构：存根DOM元素在茉莉花，angularjs

控制器代码：

function resetElem(elem) { 
    elem.classList.remove(/some string/); 
} 

function a() { 
    resetElem(document.getElementsByClassName('xx')[0]) 
}

茉莉花：

var elem; 

beforeEach(inject(function($rootScope, $controller, $q) { 
    deferred = $q.defer(); 
    scope = $rootScope.$new(); 

    mockHTMLElements(); 
    createController($controller); 
})); 

function mockHTMLElements() { 
    /* //This was the other method that I tried. 
    jasmine.spyOn(document, 
    'getElementsByClassName').and.CallFake(function(name) { 
     var el; 
     if (!elems[name]) { 
     el = document.createElement('div'); 
     el.className = name; 

     elems[name] = el; 
     } 

     return [elems[name]]; 
    }); 
    */ 

    elems['preview-promo'] = document.createElement('div'); 
    elems['preview-promo'].className="preview-promo"; 

    elems['create-promo'] = document.createElement('div'); 
    elems['create-promo'].className="create-promo"; 

    elem = { 
    classList : { 
     add : jasmine.createSpy('add'), 
     remove : jasmine.createSpy('remove'), 
    }, 
    className : 'test' 
    }; 
} 

it('tests the a function', function() { 
    // vm is ref of this of controller 
    vm.a(true); 
    ...some other tests 
});

控制台返回

TypeError: undefined is not an object (evaluating 'elem.classList')

不知道如何使这一权利。

来源

2017-04-15 Bharat Soni

很难用所提供的信息给你一个很好的答案。

作为一般规则避免操纵控制器的DOM。相反，创建一个指令，这样你就可以访问DOM元素，它会使你的测试更容易/更自然地编写。

来源

2017-04-15 22:52:46

当有网络请求时，我有条件地添加一个“进度”类。我不确定制定指令是否可行。我将如何有条件地调用指令的链接功能？ –

你不会的。使用绑定可以从当前范围控制CSS类。 –

会给它一个镜头。 –

存根DOM元素在茉莉花，angularjs

回答

相关问题