Question

我正在开发一些小项目来锻炼我的TDD技能。该项目由一个音频播放器组成，该播放器能够拖放播放列表中的文件。我使用Jasmine作为测试框架。我遇到的问题是我无法模拟javascript文件来测试我的文件上传功能。我试图像这样创建一个文件：

new File(new Blob(), "name");

但Chrome不允许手动创建文件。 File的构造函数是非法的。我找到了一个grunt.js的解决方案，它包含从grunt返回一些文件，但我真的不想在服务器端使用这么小的测试项目。这个问题有解决办法吗？

Answer 1

Chrome可让您创建新文件：

var f = new File([""], "filename", { type: 'text/html' });

然而，IE11（和其他浏览器？）不会。

这是我的（可怜？）假文件：

var blob = new Blob([""], { type: 'text/html' });
blob["lastModifiedDate"] = "";
blob["name"] = "filename";
var fakeF = blob;

您可以根据需要填写值。你可以用你需要的任何东西填充blob。（有关如何使用图像，请参阅其他答案）。

我已经在IE11，Chrome和Firefox中对此进行了测试。到目前为止，我似乎工作，至少为我的单元测试目的。

加成：这是打字稿：

let blob = new Blob([""], { type: 'text/html' });
blob["lastModifiedDate"] = "";
blob["name"] = "filename";

let fakeF = <File>blob;

Answer 2

这是我创建与pdf.js一起使用的虚拟pdf文件的方式

创建文件的base64字符串。我在外壳中使用了base64命令。

base64 < src/mockData/dummy.pdf
#outputs something like: VEhJUyBJUyBUSEUgQU5TV0VSCg==

将此字符串复制到您的源代码中。

const dataBase64 = "VEhJUyBJUyBUSEUgQU5TV0VSCg==";
//note this not a pdf, but for demo purposes because a pdf file is too big

解码base64并创建一个文件

const arrayBuffer = Uint8Array.from(window.atob(dataBase64), c => c.charCodeAt(0));
const file = new File([arrayBuffer], "dummy.pdf", {type: 'application/pdf'});

Answer 3

你不需要创建一个blob，你可以do this直接应用真正的图像字符串（我使用this converter），或者你可以按照下面的例子（如果你不是）实际上关心有一个有效的图像]）：

html <img id="test" />

var img = window.btoa('I don't care about a broken image');
document.getElementById('test').src='data:image/png;base64,'+img;

btoa函数只是从字符串创建base64。

如何在javascript中模拟文件？

3 个答案: