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

Posted 2023-03-13

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

【英文标题】：Jasmine unit test for file size with TypeScript in Angular

【发布时间】：2019-01-15 13:27:13

【问题描述】：

寻找最佳实践如何在 input 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 设置文件大小属性？ 当我尝试将size 属性直接设置为 File 对象时，这是不允许的，因为size 属性是read-only。

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

目前我如何模拟需要为我定义所有文件对象属性的文件对象的方式看起来不是很漂亮，但找不到更好的方法。 有什么想法吗？

【参考方案1】：

如果你想解决TS error，这里是方法，

interface IFile extends File 
    size: number;


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

【讨论】：

感谢提示！这是消除 TS 错误的方法之一。我的同事又给出了一个想法，我将当前的 File 对象移动到 MockFile 类并使用该类进行测试。

【参考方案2】：

我是如何解决的：

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()。

【讨论】：

我收到 TypeScript 错误 Type 'null' is not assignable to type 'Blob'。

嗯，还是显示错误？查看我的代码，它没有任何错误。

对于我使用的空值slice: (): Blob => new Blob,

【参考方案3】：

您可以使用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;