javascript - 如何从 karma 测试中模拟dom元素

Question

有一个输入类型文件元素。多次上传angular文件时，该值没有被清除。因此使用普通的 javascript dom 操作手动清除它。

代码如下:

function removeFromQueue(item) {
        vm.uploads.uploader.removeFromQueue(item);
        // Clearing input file field for re-uploading
        if(!vm.uploadFile) {
            document.getElementById('upload-file-' + vm.type).value = null;
        }
    }

在这种情况下，无法模拟 document.getElementById，因此使用单元测试用例中的 vm.uploadFile undefined variable 控制它是错误的。如何在这里模拟 dom 元素？

Answer 1

您应该能够 spyOn document.getElementById 并返回有用的属性(即此处的 value)。像这样，

spyOn(document, "getElementById").and.callFake(function() {
    return {
        value: 'test'
    }
}); 

然后如果你愿意，你可以期待它被调用，

expect(document.getElementById).toHaveBeenCalledWith('...')