html2canvas-pro 2.5.4 → 2.6.0

package/dist/html2canvas-pro.esm.js

@@ -1,5 +1,5 @@
 /*!
-* html2canvas-pro 2.5.4 <https://yorickshan.github.io/html2canvas-pro/>
+* html2canvas-pro 2.6.0 <https://yorickshan.github.io/html2canvas-pro/>
 * Copyright (c) 2024-present yorickshan and html2canvas-pro contributors
 * Released under MIT License
 */
@@ -242,6 +242,30 @@ var Validator = class {
 		};
 	}
 	/**
+	* Validate the backgroundColor option
+	*
+	* @param backgroundColor - CSS color string or null (transparent)
+	* @returns Validation result
+	*/
+	validateBackgroundColor(backgroundColor) {
+		if (backgroundColor === null) return {
+			valid: true,
+			sanitized: null
+		};
+		if (typeof backgroundColor !== "string" || backgroundColor.length === 0) return {
+			valid: false,
+			error: "backgroundColor must be a CSS color string or null"
+		};
+		if (/[^a-zA-Z0-9%(),.#\s/-]/.test(backgroundColor)) return {
+			valid: false,
+			error: `backgroundColor contains characters that cannot appear in a CSS color: ${backgroundColor}`
+		};
+		return {
+			valid: true,
+			sanitized: backgroundColor
+		};
+	}
+	/**
 	* Validate image timeout
 	*
 	* @param timeout - Timeout in milliseconds
@@ -386,6 +410,10 @@ var Validator = class {
 			const nonceResult = this.validateCspNonce(options.cspNonce);
 			if (!nonceResult.valid) errors.push(`CSP nonce: ${nonceResult.error}`);
 		}
+		if (options.backgroundColor !== void 0) {
+			const colorResult = this.validateBackgroundColor(options.backgroundColor);
+			if (!colorResult.valid) errors.push(`backgroundColor: ${colorResult.error}`);
+		}
 		if (this.config.customValidator) {
 			const customResult = this.config.customValidator(options, "options");
 			if (!customResult.valid) errors.push(`Custom validation: ${customResult.error}`);
@@ -8062,9 +8090,9 @@ const isSheetFullyApplied = (sheet, depth = 0) => {
 	if (!rules) return true;
 	for (let i = 0; i < rules.length; i++) {
 		const rule = rules[i];
-		if (rule && typeof CSSImportRule !== "undefined" && rule instanceof CSSImportRule) {
-			if (!rule.styleSheet || !isSheetFullyApplied(rule.styleSheet, depth + 1)) return false;
-		}
+		if (!rule || !("styleSheet" in rule)) continue;
+		const inner = rule.styleSheet;
+		if (!inner || !isSheetFullyApplied(inner, depth + 1)) return false;
 	}
 	return true;
 };
@@ -8106,7 +8134,7 @@ const collectLinks = (root, out) => {
 * remain as the settle path for plain <link> fetches.
 * @internal – exported for testing only.
 */
-const stylesheetsReady = (documentClone, logger, signal) => {
+const stylesheetsReady = (documentClone, logger, signal, timeoutMs = STYLESHEET_READY_TIMEOUT_MS) => {
 	if (signal?.aborted) return Promise.resolve();
 	const pending = [];
 	const links = [];
@@ -8136,8 +8164,8 @@ const stylesheetsReady = (documentClone, logger, signal) => {
 			const timer = setInterval(() => {
 				elapsed += 50;
 				if (link.sheet) settle();
-				else if (elapsed >= 1e4) {
-					logger?.warn(`Stylesheet ${href} did not finish loading within ${STYLESHEET_READY_TIMEOUT_MS / 1e3}s; continuing with a possibly unstyled clone`);
+				else if (elapsed >= timeoutMs) {
+					logger?.warn(`Stylesheet ${href} did not finish loading within ${timeoutMs / 1e3}s; continuing with a possibly unstyled clone`);
 					settle();
 				}
 			}, 50);
@@ -8154,8 +8182,8 @@ const stylesheetsReady = (documentClone, logger, signal) => {
 			const timer = setInterval(() => {
 				elapsed += 50;
 				const currentSheet = style.sheet;
-				if (currentSheet && isSheetFullyApplied(currentSheet) || elapsed >= 1e4) {
-					if (elapsed >= 1e4 && !isSheetFullyApplied(currentSheet ?? null)) logger?.warn(`@import chain in an inline <style> did not finish loading within ${STYLESHEET_READY_TIMEOUT_MS / 1e3}s; continuing with a possibly unstyled clone`);
+				if (currentSheet && isSheetFullyApplied(currentSheet) || elapsed >= timeoutMs) {
+					if (elapsed >= timeoutMs && !isSheetFullyApplied(currentSheet ?? null)) logger?.warn(`@import chain in an inline <style> did not finish loading within ${timeoutMs / 1e3}s; continuing with a possibly unstyled clone`);
 					clearInterval(timer);
 					resolve();
 				}
@@ -9843,7 +9871,7 @@ const parseStackTree = (parent, stackingContext, realStackingContext, listItems)
 		if (treatAsRealStackingContext || createsStackingContext) {
 			const parentStack = treatAsRealStackingContext || child.styles.isPositioned() ? realStackingContext : stackingContext;
 			const stack = new StackingContext(paintContainer);
-			if (child.styles.isPositioned() || child.styles.opacity < 1 || child.styles.isTransformed()) {
+			if (treatAsRealStackingContext || child.styles.isPositioned() || child.styles.opacity < 1 || child.styles.isTransformed()) {
 				const order = child.styles.zIndex.order;
 				if (order < 0) {
 					let index = 0;
@@ -12141,6 +12169,7 @@ const paintRadialLayer = (ctx, layer, area) => {
 	ctx.fillStyle = rasterized.lastColor;
 	ctx.fillRect(area.left, area.top, area.width, area.height);
 	ctx.drawImage(rasterized.canvas, area.left + cx - rx, area.top + cy - ry, rx * 2, ry * 2);
+	releaseSurface(rasterized.canvas);
 };
 /** Draw one gradient layer filling the whole mask area. */
 const paintGradientLayer = (ctx, layer, area) => {
@@ -13054,7 +13083,10 @@ var CanvasRenderer = class CanvasRenderer {
 		maskCanvas.width = surface.width;
 		maskCanvas.height = surface.height;
 		const maskCtx = maskCanvas.getContext("2d");
-		if (!maskCtx) return;
+		if (!maskCtx) {
+			releaseSurface(maskCanvas);
+			return;
+		}
 		maskCtx.scale(this.options.scale, this.options.scale);
 		maskCtx.translate(-bounds.left, -bounds.top);
 		try {
@@ -13066,6 +13098,7 @@ var CanvasRenderer = class CanvasRenderer {
 			}, async (url) => await this.context.cache.match(url));
 		} catch (error) {
 			this.context.logger.error(`Error rendering mask-image: ${error instanceof Error ? error.message : error}`);
+			releaseSurface(maskCanvas);
 			return;
 		}
 		ctx.save();
@@ -13075,6 +13108,7 @@ var CanvasRenderer = class CanvasRenderer {
 			ctx.drawImage(maskCanvas, 0, 0);
 		} finally {
 			ctx.restore();
+			releaseSurface(maskCanvas);
 		}
 	}
 	/**
@@ -13479,6 +13513,7 @@ var CanvasRenderer = class CanvasRenderer {
 			ctx.fillStyle = rasterized.lastColor;
 			ctx.fillRect(0, 0, width, height);
 			ctx.drawImage(rasterized.canvas, cx - rx, cy - ry, rx * 2, ry * 2);
+			releaseSurface(rasterized.canvas);
 			return canvas;
 		}
 		if (source.type === 5 || source.type === 6) {