fix: Change function to return File instead of Blob

Author: KantaHasegawa

coverage/index.html

@@ -30,9 +30,9 @@ <h1>All files</h1>
 
 
             <div class='fl pad1y space-right2'>
-                <span class="strong">70.83% </span>
+                <span class="strong">70.37% </span>
                 <span class="quiet">Branches</span>
-                <span class='fraction'>153/216</span>
+                <span class='fraction'>152/216</span>
             </div>
 
 
@@ -85,8 +85,8 @@ <h1>All files</h1>
 	</td>
 	<td data-value="88.13" class="pct high">88.13%</td>
 	<td data-value="430" class="abs high">379/430</td>
-	<td data-value="70.83" class="pct medium">70.83%</td>
-	<td data-value="216" class="abs medium">153/216</td>
+	<td data-value="70.37" class="pct medium">70.37%</td>
+	<td data-value="216" class="abs medium">152/216</td>
 	<td data-value="92.85" class="pct high">92.85%</td>
 	<td data-value="42" class="abs high">39/42</td>
 	<td data-value="89.61" class="pct high">89.61%</td>
@@ -116,7 +116,7 @@ <h1>All files</h1>
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2023-03-06T13:46:27.026Z
+                at 2023-07-12T16:04:59.831Z
             </div>
         <script src="prettify.js"></script>
         <script>

coverage/lcov-report/index.html

@@ -30,9 +30,9 @@ <h1>All files</h1>
 
 
             <div class='fl pad1y space-right2'>
-                <span class="strong">70.83% </span>
+                <span class="strong">70.37% </span>
                 <span class="quiet">Branches</span>
-                <span class='fraction'>153/216</span>
+                <span class='fraction'>152/216</span>
             </div>
 
 
@@ -85,8 +85,8 @@ <h1>All files</h1>
 	</td>
 	<td data-value="88.13" class="pct high">88.13%</td>
 	<td data-value="430" class="abs high">379/430</td>
-	<td data-value="70.83" class="pct medium">70.83%</td>
-	<td data-value="216" class="abs medium">153/216</td>
+	<td data-value="70.37" class="pct medium">70.37%</td>
+	<td data-value="216" class="abs medium">152/216</td>
 	<td data-value="92.85" class="pct high">92.85%</td>
 	<td data-value="42" class="abs high">39/42</td>
 	<td data-value="89.61" class="pct high">89.61%</td>
@@ -116,7 +116,7 @@ <h1>All files</h1>
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2023-03-06T13:46:27.066Z
+                at 2023-07-12T16:04:59.862Z
             </div>
         <script src="prettify.js"></script>
         <script>

dist/browser-image-compression.js

@@ -25,7 +25,7 @@ import {
  * @param {boolean} [options.alwaysKeepResolution=false]
  * @param {AbortSignal} [options.signal]
  * @param {number} previousProgress - for internal try catch rerunning start from previous progress
- * @returns {Promise<File | Blob>}
+ * @returns {Promise<File>}
  */
 export default async function compress(file, options, previousProgress = 0) {
   let progress = previousProgress;
@@ -137,5 +137,6 @@ export default async function compress(file, options, previousProgress = 0) {
   cleanupCanvasMemory(origCanvas);
 
   setProgress(100);
+  compressedFile = new File([compressedFile], file.name, { type: file.type });
   return compressedFile;
 }

dist/browser-image-compression.js.map

@@ -17,7 +17,7 @@ export const CustomFileReader = (isBrowser || inWebWorker) && ((moduleMapper &&
  * @param {string} dataUrl
  * @param {string} filename
  * @param {number} [lastModified=Date.now()]
- * @returns {Promise<File | Blob>}
+ * @returns {Promise<File>}
  */
 export function getFilefromDataUrl(dataUrl, filename, lastModified = Date.now()) {
   return new Promise((resolve) => {
@@ -29,9 +29,8 @@ export function getFilefromDataUrl(dataUrl, filename, lastModified = Date.now())
     while (n--) {
       u8arr[n] = bstr.charCodeAt(n);
     }
-    const file = new Blob([u8arr], { type: mime });
-    file.name = filename;
-    file.lastModified = lastModified;
+    const blobFile = new Blob([u8arr], { type: mime });
+    const file = new File([blobFile], filename, { lastModified, type: blobFile.type });
     resolve(file);
 
     // Safari has issue with File constructor not being able to POST in FormData
@@ -251,7 +250,7 @@ export async function drawFileInCanvas(file, options = {}) {
  * @param {string} fileName
  * @param {number} fileLastModified
  * @param {number} [quality]
- * @returns {Promise<File | Blob>}
+ * @returns {Promise<File>}
  */
 export async function canvasToFile(canvas, fileType, fileName, fileLastModified, quality = 1) {
   let file;
@@ -280,7 +279,7 @@ export async function canvasToFile(canvas, fileType, fileName, fileLastModified,
     const dataUrl = canvas.toDataURL(fileType, quality);
     file = await getFilefromDataUrl(dataUrl, fileName, fileLastModified);
   }
-  return file;
+  return new File([file], fileName, { lastModified: file.lastModified, type: file.type });
 }
 
 /**