fix for apply object-fit

marjoriedieusart commented 3 years ago

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch html2canvas@1.0.0-rc.7 for the project I'm working on.

Here is the diff that solved my problem:

diff --git a/node_modules/html2canvas/.DS_Store b/node_modules/html2canvas/.DS_Store
new file mode 100644
index 0000000..c6eeb31
Binary files /dev/null and b/node_modules/html2canvas/.DS_Store differ
diff --git a/node_modules/html2canvas/dist/html2canvas.js b/node_modules/html2canvas/dist/html2canvas.js
index 210184e..191320c 100644
--- a/node_modules/html2canvas/dist/html2canvas.js
+++ b/node_modules/html2canvas/dist/html2canvas.js
@@ -6282,13 +6282,30 @@
             if (image && container.intrinsicWidth > 0 && container.intrinsicHeight > 0) {
                 var box = contentBox(container);
                 var path = calculatePaddingBoxPath(curves);
+          
                 this.path(path);
                 this.ctx.save();
                 this.ctx.clip();
-                this.ctx.drawImage(image, 0, 0, container.intrinsicWidth, container.intrinsicHeight, box.left, box.top, box.width, box.height);
+          
+                let newWidth;
+                let newHeight;
+                let newX = box.left;
+                let newY = box.top;
+          
+                if(container.intrinsicWidth / box.width < container.intrinsicHeight / box.height) {
+                  newWidth = box.width;
+                  newHeight = container.intrinsicHeight * (box.width / container.intrinsicWidth);
+                  newY = box.top + (box.height - newHeight) / 2;
+                } else {
+                  newWidth = container.intrinsicWidth * (box.height / container.intrinsicHeight);
+                  newHeight = box.height;
+                  newX = box.left + (box.width - newWidth) / 2;
+                }
+          
+                this.ctx.drawImage(image, 0, 0, container.intrinsicWidth, container.intrinsicHeight, newX, newY, newWidth, newHeight);
                 this.ctx.restore();
             }
-        };
+          };
         CanvasRenderer.prototype.renderNodeContent = function (paint) {
             return __awaiter(this, void 0, void 0, function () {
                 var container, curves, styles, _i, _a, child, image, e_1, image, e_2, iframeRenderer, canvas, size, bounds, x, textBounds, img, image, url, e_3, bounds;

This issue body was partially generated by patch-package.