存根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

回答

相關問題