如何用 Jasmine 测试 promise 包装的 fileReader？

Question

I am trying to get testing coverage for a base64 function like below:

export const fileToBase64 = (file: File | Blob): Promise<any> =>
  new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = () => resolve(reader.result);
    reader.onerror = error => reject(error);
  });

  describe('getFileBase64()', () => {
    it('should convert file to base64', async () => {
      const blob = new Blob();
      const result = await getFileBase64(blob);
      expect(result).toBe('data:');
    });

    it('should reject', async () => {
      ???
    });
  });

I already Googled some ways but had no luck, like spyOn(window, 'FileReader') .

How should I make the coverage for line "reader.onerror = error => reject(error);" in Jasmine?

Answer 1

This is a solution inspired by: https://stackoverflow.com/a/67061047/8543478

In order to access the reader, we can mock the FileReader constructor and get control of the created file reader instance.

Please check the comments in the code sample to see how I can able to trigger onerror .

    it('should reject', async () => {
      const reader = new FileReader();
      const eventError = new Event('error');

      // When load event hit, trigger "onerror" event for rejection
      reader.addEventListener('load', () => reader.dispatchEvent(eventError));

      // Replace the FileReader constructor with the instance that defined above
      spyOn(window, 'FileReader').and.returnValue(reader);

      await expectAsync(getFileBase64(new Blob())).toBeRejectedWith(eventError);
    });