html2canvas-pro 1.5.10 → 1.5.12

package/dist/html2canvas-pro.js

@@ -1,5 +1,5 @@
 /*!
- * html2canvas-pro 1.5.10 <https://yorickshan.github.io/html2canvas-pro/>
+ * html2canvas-pro 1.5.12 <https://yorickshan.github.io/html2canvas-pro/>
  * Copyright (c) 2024-present yorickshan and html2canvas-pro contributors
  * Released under MIT License
  */
@@ -3977,24 +3977,44 @@
                 if (typeof transformFunction === 'undefined') {
                     throw new Error("Attempting to parse an unsupported transform function \"".concat(token.name, "\""));
                 }
-                return transformFunction(token.values);
+                return transformFunction(_context, token.values);
             }
             return null;
         }
     };
-    var matrix = function (args) {
+    var matrix = function (_context, args) {
         var values = args.filter(function (arg) { return arg.type === 17 /* TokenType.NUMBER_TOKEN */; }).map(function (arg) { return arg.number; });
         return values.length === 6 ? values : null;
     };
     // doesn't support 3D transforms at the moment
-    var matrix3d = function (args) {
+    var matrix3d = function (_context, args) {
         var values = args.filter(function (arg) { return arg.type === 17 /* TokenType.NUMBER_TOKEN */; }).map(function (arg) { return arg.number; });
         var a1 = values[0], b1 = values[1]; values[2]; values[3]; var a2 = values[4], b2 = values[5]; values[6]; values[7]; values[8]; values[9]; values[10]; values[11]; var a4 = values[12], b4 = values[13]; values[14]; values[15];
         return values.length === 16 ? [a1, b1, a2, b2, a4, b4] : null;
     };
+    var rotate$1 = function (context, args) {
+        if (args.length !== 1) {
+            return null;
+        }
+        var arg = args[0];
+        var radians = 0;
+        if (arg.type === 17 /* TokenType.NUMBER_TOKEN */ && arg.number === 0) {
+            radians = 0;
+        }
+        else if (arg.type === 15 /* TokenType.DIMENSION_TOKEN */) {
+            radians = angle.parse(context, arg);
+        }
+        else {
+            return null;
+        }
+        var cos = Math.cos(radians);
+        var sin = Math.sin(radians);
+        return [cos, sin, -sin, cos, 0, 0];
+    };
     var SUPPORTED_TRANSFORM_FUNCTIONS = {
         matrix: matrix,
-        matrix3d: matrix3d
+        matrix3d: matrix3d,
+        rotate: rotate$1
     };
 
     var DEFAULT_VALUE = {
@@ -4017,6 +4037,30 @@
         }
     };
 
+    var rotate = {
+        name: 'rotate',
+        initialValue: 'none',
+        prefix: false,
+        type: 0 /* PropertyDescriptorParsingType.VALUE */,
+        parse: function (_context, token) {
+            if (token.type === 20 /* TokenType.IDENT_TOKEN */ && token.value === 'none') {
+                return null;
+            }
+            if (token.type === 17 /* TokenType.NUMBER_TOKEN */) {
+                if (token.number === 0) {
+                    return 0;
+                }
+            }
+            if (token.type === 15 /* TokenType.DIMENSION_TOKEN */) {
+                // Parse angle and convert to degrees for storage
+                var radians = angle.parse(_context, token);
+                // Store as degrees for consistency
+                return (radians * 180) / Math.PI;
+            }
+            return null;
+        }
+    };
+
     var visibility = {
         name: 'visible',
         initialValue: 'none',
@@ -4529,6 +4573,7 @@
             this.textTransform = parse(context, textTransform, declaration.textTransform);
             this.transform = parse(context, transform$1, declaration.transform);
             this.transformOrigin = parse(context, transformOrigin, declaration.transformOrigin);
+            this.rotate = parse(context, rotate, declaration.rotate);
             this.visibility = parse(context, visibility, declaration.visibility);
             this.webkitTextStrokeColor = parse(context, webkitTextStrokeColor, declaration.webkitTextStrokeColor);
             this.webkitTextStrokeWidth = parse(context, webkitTextStrokeWidth, declaration.webkitTextStrokeWidth);
@@ -4543,7 +4588,7 @@
             return isTransparent(this.backgroundColor);
         };
         CSSParsedDeclaration.prototype.isTransformed = function () {
-            return this.transform !== null;
+            return this.transform !== null || this.rotate !== null;
         };
         CSSParsedDeclaration.prototype.isPositioned = function () {
             return this.position !== 0 /* POSITION.STATIC */;
@@ -4654,6 +4699,10 @@
                     // getBoundingClientRect takes transforms into account
                     element.style.transform = 'none';
                 }
+                if (this.styles.rotate !== null) {
+                    // Handle rotate property similarly to transform
+                    element.style.rotate = 'none';
+                }
             }
             this.bounds = parseBounds(this.context, element);
             if (isDebugging(element, 4 /* DebuggerType.RENDER */)) {
@@ -6118,16 +6167,27 @@
                     }
                 });
             }); });
-            var adoptedNode = documentClone.adoptNode(this.documentElement);
             /**
              * The baseURI of the document will be lost after documentClone.open().
-             * We can avoid it by adding <base> element.
+             * We save it before open() to preserve the original base URI for resource resolution.
              * */
-            addBase(adoptedNode, documentClone);
+            var baseUri = documentClone.baseURI;
             documentClone.open();
             documentClone.write("".concat(serializeDoctype(document.doctype), "<html></html>"));
             // Chrome scrolls the parent document for some reason after the write to the cloned window???
             restoreOwnerScroll(this.referenceElement.ownerDocument, scrollX, scrollY);
+            /**
+             * Note: adoptNode() should be called AFTER documentClone.open() and close()
+             *
+             * In Chrome, calling adoptNode() before or during open/write may cause
+             * styles with uppercase characters in class names (e.g. ".MyClass") to not apply correctly.
+             *
+             * Fix:
+             *   - Make sure adoptNode() is called after documentClone.open() and close()
+             *   - This allows Chrome to properly match and apply all CSS rules including mixed-case class selectors.
+             * */
+            var adoptedNode = documentClone.adoptNode(this.documentElement);
+            addBase(adoptedNode, baseUri);
             documentClone.replaceChild(adoptedNode, documentClone.documentElement);
             documentClone.close();
             return iframeLoad;
@@ -6536,10 +6596,10 @@
             body.appendChild(style);
         }
     };
-    var addBase = function (targetELement, referenceDocument) {
+    var addBase = function (targetELement, baseUri) {
         var _a;
-        var baseNode = referenceDocument.createElement('base');
-        baseNode.href = referenceDocument.baseURI;
+        var baseNode = targetELement.ownerDocument.createElement('base');
+        baseNode.href = baseUri;
         var headEle = targetELement.getElementsByTagName('head').item(0);
         headEle === null || headEle === void 0 ? void 0 : headEle.insertBefore(baseNode, (_a = headEle === null || headEle === void 0 ? void 0 : headEle.firstChild) !== null && _a !== void 0 ? _a : null);
     };
@@ -6592,12 +6652,21 @@
         };
         Cache.prototype.loadImage = function (key) {
             return __awaiter(this, void 0, void 0, function () {
-                var isSameOrigin, useCORS, useProxy, src;
+                var isSameOrigin, _a, useCORS, useProxy, src;
                 var _this = this;
-                return __generator(this, function (_a) {
-                    switch (_a.label) {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
                         case 0:
-                            isSameOrigin = CacheStorage.isSameOrigin(key);
+                            if (!(typeof this._options.customIsSameOrigin === 'function')) return [3 /*break*/, 2];
+                            return [4 /*yield*/, this._options.customIsSameOrigin(key, CacheStorage.isSameOrigin)];
+                        case 1:
+                            _a = _b.sent();
+                            return [3 /*break*/, 3];
+                        case 2:
+                            _a = CacheStorage.isSameOrigin(key);
+                            _b.label = 3;
+                        case 3:
+                            isSameOrigin = _a;
                             useCORS = !isInlineImage(key) && this._options.useCORS === true && FEATURES.SUPPORT_CORS_IMAGES && !isSameOrigin;
                             useProxy = !isInlineImage(key) &&
                                 !isSameOrigin &&
@@ -6614,12 +6683,12 @@
                                 return [2 /*return*/];
                             }
                             src = key;
-                            if (!useProxy) return [3 /*break*/, 2];
+                            if (!useProxy) return [3 /*break*/, 5];
                             return [4 /*yield*/, this.proxy(src)];
-                        case 1:
-                            src = _a.sent();
-                            _a.label = 2;
-                        case 2:
+                        case 4:
+                            src = _b.sent();
+                            _b.label = 5;
+                        case 5:
                             this.context.logger.debug("Added image ".concat(key.substring(0, 256)));
                             return [4 /*yield*/, new Promise(function (resolve, reject) {
                                     var img = new Image();
@@ -6638,7 +6707,7 @@
                                         setTimeout(function () { return reject("Timed out (".concat(_this._options.imageTimeout, "ms) loading image")); }, _this._options.imageTimeout);
                                     }
                                 })];
-                        case 3: return [2 /*return*/, _a.sent()];
+                        case 6: return [2 /*return*/, _b.sent()];
                     }
                 });
             });
@@ -6998,6 +7067,17 @@
             if (this.container.styles.opacity < 1) {
                 this.effects.push(new OpacityEffect(this.container.styles.opacity));
             }
+            if (this.container.styles.rotate !== null) {
+                var offsetX = this.container.bounds.left + this.container.styles.transformOrigin[0].number;
+                var offsetY = this.container.bounds.top + this.container.styles.transformOrigin[1].number;
+                // Apply rotate property if present
+                var angle = this.container.styles.rotate;
+                var rad = (angle * Math.PI) / 180;
+                var cos = Math.cos(rad);
+                var sin = Math.sin(rad);
+                var rotateMatrix = [cos, sin, -sin, cos, 0, 0];
+                this.effects.push(new TransformEffect(offsetX, offsetY, rotateMatrix));
+            }
             if (this.container.styles.transform !== null) {
                 var offsetX = this.container.bounds.left + this.container.styles.transformOrigin[0].number;
                 var offsetY = this.container.bounds.top + this.container.styles.transformOrigin[1].number;
@@ -8681,7 +8761,8 @@
                         allowTaint: (_b = opts.allowTaint) !== null && _b !== void 0 ? _b : false,
                         imageTimeout: (_c = opts.imageTimeout) !== null && _c !== void 0 ? _c : 15000,
                         proxy: opts.proxy,
-                        useCORS: (_d = opts.useCORS) !== null && _d !== void 0 ? _d : false
+                        useCORS: (_d = opts.useCORS) !== null && _d !== void 0 ? _d : false,
+                        customIsSameOrigin: opts.customIsSameOrigin
                     };
                     contextOptions = __assign({ logging: (_e = opts.logging) !== null && _e !== void 0 ? _e : true, cache: opts.cache }, resourceOptions);
                     windowOptions = {