Merge pull request #55 from Donaldcwl/dev

Dev v1.0.10

Author: Donaldcwl

.gitignore

@@ -16,7 +16,7 @@ pids
 lib-cov
 
 # Coverage directory used by tools like istanbul
-#coverage
+`coverage
 
 # nyc test coverage
 .nyc_output
@@ -88,4 +88,4 @@ Temporary Items
 
 .idea/
 dist/
-coverage/
+/example/*/yarn.lock

CHANGELOG.md

@@ -1,3 +1,8 @@
+## v1.0.10 (7 May 2020)
+* fixed: issue in Web Worker when onProgress is undefined  [#50](https://github.com/Donaldcwl/browser-image-compression/issues/50) 
+* fixed: handle behavior change of exif orientation in iOS 13.4.1 and Safari 13.1 Desktop [#52](https://github.com/Donaldcwl/browser-image-compression/issues/52)
+* updated: typescript type definitions to resolve [#54](https://github.com/Donaldcwl/browser-image-compression/issues/54)
+
 ## v1.0.9 (25 Mar 2020)
 * updated: compression becomes less aggressive, output file is closer to the 'maxWidthOrHeight' and/or 'maxSizeMB' in config
 * fixed: file size increased in specific situation

README.md

@@ -18,7 +18,7 @@ yarn add browser-image-compression
 ```
 or use a CDN like [delivrjs]:
 ```
-https://cdn.jsdelivr.net/npm/[email protected].9/dist/browser-image-compression.js
+https://cdn.jsdelivr.net/npm/[email protected].10/dist/browser-image-compression.js
 or
 https://cdn.jsdelivr.net/npm/browser-image-compression@latest/dist/browser-image-compression.js
 ```
@@ -59,13 +59,13 @@ imageCompression(file: File, options): Promise<File | Blob>
 ### Helper function ###
 - for advanced user only, most user won't need to use the helper functions
 ```javascript
-imageCompression.getDataUrlFromFile(file: File): Promise<base64 encoded string>
-imageCompression.getFilefromDataUrl(dataUrl: string): Promise<File>
+imageCompression.getDataUrlFromFile(file: File | Blob): Promise<base64 encoded string>
+imageCompression.getFilefromDataUrl(dataUrl: string, filename: string, lastModified?: number): Promise<File>
 imageCompression.loadImage(url: string): Promise<HTMLImageElement>
-imageCompression.drawImageInCanvas(img: HTMLImageElement): HTMLCanvasElement
-imageCompression.drawFileInCanvas(file: File): Promise<[ImageBitmap | HTMLImageElement, HTMLCanvasElement]>
-imageCompression.canvasToFile(canvas, fileType, fileName, fileLastModified[, quality]): Promise<File|Blob>
-imageCompression.getExifOrientation(file: File): Promise<number> // based on https://stackoverflow.com/a/32490603/10395024
+imageCompression.drawImageInCanvas(img: HTMLImageElement): HTMLCanvasElement | OffscreenCanvas
+imageCompression.drawFileInCanvas(file: File| Blob): Promise<[ImageBitmap | HTMLImageElement, HTMLCanvasElement | OffscreenCanvas]>
+imageCompression.canvasToFile(canvas: HTMLCanvasElement | OffscreenCanvas, fileType: string, fileName: string, fileLastModified: number, quality?: number): Promise<File | Blob>
+imageCompression.getExifOrientation(file: File| Blob): Promise<number> // based on https://stackoverflow.com/a/32490603/10395024
 ```
 
 ## Usage ##
@@ -134,6 +134,13 @@ or check the "[example]" folder in this repo
 | --------- | --------- | --------- | --------- | --------- | --------- |
 | IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions| last 2 versions
 
+## Typescript type definitions ##
+```
+npm install --save-dev @types/browser-image-compression
+or
+yarn add --dev @types/browser-image-compression
+```
+
 ## Contribution ##
 1. fork the repo and git clone it
 2. run `npm run watch` # it will watch code change in lib/ folder and generate js in dist/ folder

coverage/badge.svg

@@ -1,5 +1,2 @@
-{"total": {"lines":{"total":197,"covered":156,"skipped":0,"pct":79.19},"statements":{"total":211,"covered":158,"skipped":0,"pct":74.88},"functions":{"total":26,"covered":22,"skipped":0,"pct":84.62},"branches":{"total":101,"covered":56,"skipped":0,"pct":55.45}}
-,"/Users/donald/Project/browser-image-compression/lib/image-compression.js": {"lines":{"total":49,"covered":47,"skipped":0,"pct":95.92},"functions":{"total":3,"covered":3,"skipped":0,"pct":100},"statements":{"total":49,"covered":47,"skipped":0,"pct":95.92},"branches":{"total":26,"covered":21,"skipped":0,"pct":80.77}}
-,"/Users/donald/Project/browser-image-compression/lib/index.js": {"lines":{"total":28,"covered":25,"skipped":0,"pct":89.29},"functions":{"total":1,"covered":1,"skipped":0,"pct":100},"statements":{"total":28,"covered":25,"skipped":0,"pct":89.29},"branches":{"total":17,"covered":12,"skipped":0,"pct":70.59}}
-,"/Users/donald/Project/browser-image-compression/lib/utils.js": {"lines":{"total":120,"covered":84,"skipped":0,"pct":70},"functions":{"total":22,"covered":18,"skipped":0,"pct":81.82},"statements":{"total":134,"covered":86,"skipped":0,"pct":64.18},"branches":{"total":58,"covered":23,"skipped":0,"pct":39.66}}
+{"total": {"lines":{"total":0,"covered":0,"skipped":0,"pct":"Unknown"},"statements":{"total":0,"covered":0,"skipped":0,"pct":"Unknown"},"functions":{"total":0,"covered":0,"skipped":0,"pct":"Unknown"},"branches":{"total":0,"covered":0,"skipped":0,"pct":"Unknown"}}
 }

coverage/coverage-final.json

@@ -171,7 +171,13 @@ <h1><a href="index.html">All files</a> image-compression.js</h1>
 <a name='L112'></a><a href='#L112'>112</a>
 <a name='L113'></a><a href='#L113'>113</a>
 <a name='L114'></a><a href='#L114'>114</a>
-<a name='L115'></a><a href='#L115'>115</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L115'></a><a href='#L115'>115</a>
+<a name='L116'></a><a href='#L116'>116</a>
+<a name='L117'></a><a href='#L117'>117</a>
+<a name='L118'></a><a href='#L118'>118</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -308,7 +314,10 @@ <h1><a href="index.html">All files</a> image-compression.js</h1>
  * @param {string} [options.fileType] - default to be the original mime type from the image file
  * @returns {Promise&lt;File | Blob&gt;}
  */
-export default async function compress (file, options) {
+export default async function
+&nbsp;
+&nbsp;
+  fawfcompress (file, options) {
   let progress = 0
 &nbsp;
   function incProgress (inc = 5) {
@@ -406,7 +415,7 @@ <h1><a href="index.html">All files</a> image-compression.js</h1>
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
-                at Wed Mar 25 2020 23:40:22 GMT+0800 (Hong Kong Standard Time)
+                at Wed May 06 2020 16:10:33 GMT+0800 (香港標準時間)
             </div>
         </div>
         <script src="prettify.js"></script>

coverage/coverage-summary.json

@@ -23,30 +23,30 @@ <h1>All files</h1>
         <div class='clearfix'>
 
             <div class='fl pad1y space-right2'>
-                <span class="strong">74.88% </span>
+                <span class="strong">Unknown% </span>
                 <span class="quiet">Statements</span>
-                <span class='fraction'>158/211</span>
+                <span class='fraction'>0/0</span>
             </div>
 
 
             <div class='fl pad1y space-right2'>
-                <span class="strong">55.45% </span>
+                <span class="strong">Unknown% </span>
                 <span class="quiet">Branches</span>
-                <span class='fraction'>56/101</span>
+                <span class='fraction'>0/0</span>
             </div>
 
 
             <div class='fl pad1y space-right2'>
-                <span class="strong">84.62% </span>
+                <span class="strong">Unknown% </span>
                 <span class="quiet">Functions</span>
-                <span class='fraction'>22/26</span>
+                <span class='fraction'>0/0</span>
             </div>
 
 
             <div class='fl pad1y space-right2'>
-                <span class="strong">79.19% </span>
+                <span class="strong">Unknown% </span>
                 <span class="quiet">Lines</span>
-                <span class='fraction'>156/197</span>
+                <span class='fraction'>0/0</span>
             </div>
 
 
@@ -72,60 +72,15 @@ <h1>All files</h1>
    <th data-col="lines_raw" data-type="number" data-fmt="html" class="abs"></th>
 </tr>
 </thead>
-<tbody><tr>
-	<td class="file high" data-value="image-compression.js"><a href="image-compression.js.html">image-compression.js</a></td>
-	<td data-value="95.92" class="pic high">
-	<div class="chart"><div class="cover-fill" style="width: 95%"></div><div class="cover-empty" style="width: 5%"></div></div>
-	</td>
-	<td data-value="95.92" class="pct high">95.92%</td>
-	<td data-value="49" class="abs high">47/49</td>
-	<td data-value="80.77" class="pct high">80.77%</td>
-	<td data-value="26" class="abs high">21/26</td>
-	<td data-value="100" class="pct high">100%</td>
-	<td data-value="3" class="abs high">3/3</td>
-	<td data-value="95.92" class="pct high">95.92%</td>
-	<td data-value="49" class="abs high">47/49</td>
-	</tr>
-
-<tr>
-	<td class="file high" data-value="index.js"><a href="index.js.html">index.js</a></td>
-	<td data-value="89.29" class="pic high">
-	<div class="chart"><div class="cover-fill" style="width: 89%"></div><div class="cover-empty" style="width: 11%"></div></div>
-	</td>
-	<td data-value="89.29" class="pct high">89.29%</td>
-	<td data-value="28" class="abs high">25/28</td>
-	<td data-value="70.59" class="pct medium">70.59%</td>
-	<td data-value="17" class="abs medium">12/17</td>
-	<td data-value="100" class="pct high">100%</td>
-	<td data-value="1" class="abs high">1/1</td>
-	<td data-value="89.29" class="pct high">89.29%</td>
-	<td data-value="28" class="abs high">25/28</td>
-	</tr>
-
-<tr>
-	<td class="file medium" data-value="utils.js"><a href="utils.js.html">utils.js</a></td>
-	<td data-value="64.18" class="pic medium">
-	<div class="chart"><div class="cover-fill" style="width: 64%"></div><div class="cover-empty" style="width: 36%"></div></div>
-	</td>
-	<td data-value="64.18" class="pct medium">64.18%</td>
-	<td data-value="134" class="abs medium">86/134</td>
-	<td data-value="39.66" class="pct low">39.66%</td>
-	<td data-value="58" class="abs low">23/58</td>
-	<td data-value="81.82" class="pct high">81.82%</td>
-	<td data-value="22" class="abs high">18/22</td>
-	<td data-value="70" class="pct medium">70%</td>
-	<td data-value="120" class="abs medium">84/120</td>
-	</tr>
-
-</tbody>
+<tbody></tbody>
 </table>
 </div>
                 <div class='push'></div><!-- for sticky footer -->
             </div><!-- /wrapper -->
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
-                at Wed Mar 25 2020 23:40:22 GMT+0800 (Hong Kong Standard Time)
+                at Wed May 06 2020 16:11:19 GMT+0800 (香港標準時間)
             </div>
         </div>
         <script src="prettify.js"></script>

coverage/image-compression.js.html

@@ -331,7 +331,7 @@ <h1><a href="index.html">All files</a> index.js</h1>
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
-                at Wed Mar 25 2020 23:40:22 GMT+0800 (Hong Kong Standard Time)
+                at Wed May 06 2020 16:10:33 GMT+0800 (香港標準時間)
             </div>
         </div>
         <script src="prettify.js"></script>

coverage/index.html

@@ -171,7 +171,13 @@ <h1><a href="index.html">All files</a> image-compression.js</h1>
 <a name='L112'></a><a href='#L112'>112</a>
 <a name='L113'></a><a href='#L113'>113</a>
 <a name='L114'></a><a href='#L114'>114</a>
-<a name='L115'></a><a href='#L115'>115</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L115'></a><a href='#L115'>115</a>
+<a name='L116'></a><a href='#L116'>116</a>
+<a name='L117'></a><a href='#L117'>117</a>
+<a name='L118'></a><a href='#L118'>118</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -308,7 +314,10 @@ <h1><a href="index.html">All files</a> image-compression.js</h1>
  * @param {string} [options.fileType] - default to be the original mime type from the image file
  * @returns {Promise&lt;File | Blob&gt;}
  */
-export default async function compress (file, options) {
+export default async function
+&nbsp;
+&nbsp;
+  fawfcompress (file, options) {
   let progress = 0
 &nbsp;
   function incProgress (inc = 5) {
@@ -406,7 +415,7 @@ <h1><a href="index.html">All files</a> image-compression.js</h1>
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
-                at Wed Mar 25 2020 23:40:22 GMT+0800 (Hong Kong Standard Time)
+                at Wed May 06 2020 16:10:33 GMT+0800 (香港標準時間)
             </div>
         </div>
         <script src="prettify.js"></script>