Question

寻找最佳实践，以测试输入type =“ file”更改事件中的文件大小。

现在我的测试规格如下：

it('attach file with too large size', () => {
  const file: File = {
    name: 'filename',
    type: 'image/png',
    size: 8242880,
    lastModified: 1,
    lastModifiedDate: new Date(),
    webkitRelativePath: '',
    msClose: () => {},
    msDetachStream: () => {},
    slice: (): Blob => null,
  };
  const event = { target: { files: [file] } };

  component.onFileChange(event); // file validation happens into it too

  const error = control.getError('file_size');
  expect(error).toBeTruthy();
});

有没有更好的方法来设置TypeScript的File size属性？当我尝试将size属性直接设置为File对象时，这是不允许的，因为size属性是read-only。

const file = new File([''], 'filename', { type: 'image/png' });
file.size = 8242880; // TS error

在我需要为我定义所有File对象属性的情况下，我如何模拟File对象的当前方法看起来并不很漂亮，但是找不到更好的方法。有什么想法吗？

Answer 1

如果您想解决TS error，请按照以下方法进行操作

interface IFile extends File {
    size: number;
}

const file: IFile = new File([''], 'filename', { type: 'image/png' });
file.size = 8242880; // Works..

Answer 2

您可以使用Object.defineProperty覆盖size属性。

/** Creates a "1TB" file given the file name. */
function getHugeFile(name: string) : File {
  const file = new File([''], name);
  Object.defineProperty(
      file, 'size', {value: Math.pow(1024, 4), writable: false});
  return file;
}

Answer 3

我如何解决它：

export const createFile = (params?: any): File  => {
  const file = {
    name: 'filename',
    type: 'image/png',
    size: 123,
    lastModified: 1,
    lastModifiedDate: new Date(),
    webkitRelativePath: '',
    msClose: () => {},
    msDetachStream: () => {},
    slice: (): Blob => null,
  };

  return {
    ...file,
    ...params,
  };
};

并在需要模拟文件对象的地方使用createFile()。

使用Angular中的TypeScript对文件大小进行Jasmine单元测试

3 个答案: