问题描述

我正在尝试进行此测试，但我不知道如何使用 FileReader 编写测试.这是我的代码

这是我的测试

但它永远不会到达 reader.onload.

这里的问题是 reader.onload 的使用很难测试.您可以使用 reader.addEventListener 代替，这样您就可以监视全局 FileReader 对象并返回一个模拟:

eventListener = jasmine.createSpy();spyOn(window, "FileReader").andReturn({添加事件监听器:事件监听器})

然后你可以自己触发 onload 回调:

expect(eventListener.mostRecentCall.args[0]).toEqual('load');eventListener.mostRecentCall.args[1]({目标:{result:'你要测试的结果'}})

I'm trying to make this test work, but I couldn't get my head around how to write a test with FileReader. This is my code

function Uploader(file) {
    this.file = file;
}

Uploader.prototype =  (function() {

    function upload_file(file, file_contents) {
        var file_data = new FormData()
        file_data.append('filename', file.name)
        file_data.append('mimetype', file.type)
        file_data.append('data', file_contents)
        file_data.append('size', file.size)

        $.ajax({
            url: "/upload/file",
            type: "POST",
            data: file_contents,            
            contentType: file.type,
            success: function(){

                // $("#thumbnail").attr("src", "/upload/thumbnail");    

            },
            error: function(){
                alert("Failed");
            },
            xhr: function() {
                myXhr = $.ajaxSettings.xhr();
                if(myXhr.upload){
                    myXhr.upload.addEventListener('progress',showProgress, false);
                } else {
                    console.log("Upload progress is not supported.");
                }
                return myXhr;
            }
        });
    }

    return {
        upload : function() {
            var self = this,
                reader = new FileReader(),
                file_content = {};

            reader.onload = function(e) {
                file_content = e.target.result.split(',')[1];

                upload_file(self.file, file_content);
            }
        }
    };
})();

And this is my test

describe("Uploader", function() {
    it("should upload a file successfully", function() {
        spyOn($, "ajax");
        var fakeFile = {};

        var uploader = new Uploader(fakeFile);
        uploader.upload();

        expect($.ajax.mostRecentCall.args[0]["url"]).toEqual("/upload/file");
    })
});

But it never gets to reader.onload.

The problem here is the use of reader.onload which is hard to test. You could use reader.addEventListener instead so you can spy on the global FileReader object and return a mock:

eventListener = jasmine.createSpy();
spyOn(window, "FileReader").andReturn({
 addEventListener: eventListener
})

then you can fire the onload callback by yourself:

expect(eventListener.mostRecentCall.args[0]).toEqual('load');
eventListener.mostRecentCall.args[1]({
  target:{
    result:'the result you wanna test'
  }
})

这篇关于如何在 Jasmine 中编写 FileReader 测试?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！