fix: 4.x gif thumb url base64 type should be corrected

components/date-picker/__tests__/__snapshots__/other.test.tsx.snap

@@ -303,7 +303,7 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
               </thead>
               <tbody>
                 <tr
-                  class="ant-picker-week-panel-row ant-picker-week-panel-row-selected"
+                  class="ant-picker-week-panel-row"
                 >
                   <td
                     class="ant-picker-cell ant-picker-cell-week"

components/upload/__tests__/uploadlist.test.tsx

@@ -35,6 +35,8 @@ describe('Upload List', () => {
   // jsdom not support `createObjectURL` yet. Let's handle this.
   const originCreateObjectURL = window.URL.createObjectURL;
   window.URL.createObjectURL = jest.fn(() => '');
+  const originRevokeObjectURL = window.URL.revokeObjectURL;
+  window.URL.revokeObjectURL = jest.fn(() => '');
 
   // Mock dom
   let size = { width: 0, height: 0 };
@@ -88,6 +90,7 @@ describe('Upload List', () => {
 
   afterAll(() => {
     window.URL.createObjectURL = originCreateObjectURL;
+    window.URL.revokeObjectURL = originRevokeObjectURL;
     mockWidthGet.mockRestore();
     mockHeightGet.mockRestore();
     mockSrcSet.mockRestore();
@@ -921,6 +924,31 @@ describe('Upload List', () => {
     unmount();
   });
 
+  it('upload gif file should be converted to the image/gif base64', async () => {
+    const mockFile = new File([''], 'foo.gif', {
+      type: 'image/gif',
+    });
+
+    const previewFunc = jest.fn(previewImage);
+
+    const { unmount } = render(
+      <Upload
+        fileList={[{ originFileObj: mockFile }] as UploadProps['fileList']}
+        previewFile={previewFunc}
+        locale={{ uploading: 'uploading' }}
+        listType="picture-card"
+      />,
+    );
+
+    await waitFor(() => {
+      expect(previewFunc).toHaveBeenCalled();
+    });
+    await previewFunc(mockFile).then(dataUrl => {
+      expect(dataUrl).toEqual('data:image/gif;base64,');
+    });
+    unmount();
+  });
+
   it("upload non image file shouldn't be converted to the base64", async () => {
     const mockFile = new File([''], 'foo.7z', {
       type: 'application/x-7z-compressed',

components/upload/utils.tsx

@@ -107,15 +107,21 @@ export function previewImage(file: File | Blob): Promise<string> {
       ctx!.drawImage(img, offsetX, offsetY, drawWidth, drawHeight);
       const dataURL = canvas.toDataURL();
       document.body.removeChild(canvas);
-
+      window.URL.revokeObjectURL(img.src);
       resolve(dataURL);
     };
     img.crossOrigin = 'anonymous';
     if (file.type.startsWith('image/svg+xml')) {
       const reader = new FileReader();
-      reader.addEventListener('load', () => {
+      reader.onload = () => {
         if (reader.result) img.src = reader.result as string;
-      });
+      };
+      reader.readAsDataURL(file);
+    } else if (file.type.startsWith('image/gif')) {
+      const reader = new FileReader();
+      reader.onload = () => {
+        if (reader.result) resolve(reader.result as string);
+      };
       reader.readAsDataURL(file);
     } else {
       img.src = window.URL.createObjectURL(file);