html2canvas-pro 2.0.4 → 2.1.0

package/{dist/lib/dom/__tests__/dom-normalizer.test.js → src/dom/__tests__/dom-normalizer.test.ts}

@@ -1,21 +1,21 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const assert_1 = require("assert");
-const dom_normalizer_1 = require("../dom-normalizer");
-const css_1 = require("../../css");
-const context_1 = require("../../core/context");
-const bounds_1 = require("../../css/layout/bounds");
-const config_1 = require("../../config");
+import { strictEqual } from 'assert';
+import { DOMNormalizer } from '../dom-normalizer';
+import { CSSParsedDeclaration } from '../../css';
+import { Context } from '../../core/context';
+import { Bounds } from '../../css/layout/bounds';
+import { Html2CanvasConfig } from '../../config';
+
 describe('DOMNormalizer', () => {
-    let context;
-    let mockElement;
+    let context: Context;
+    let mockElement: HTMLElement;
+
     beforeEach(() => {
         const mockWindow = {
             document: {
-                createElement: (_name) => {
+                createElement: (_name: string) => {
                     let _href = '';
                     return {
-                        set href(value) {
+                        set href(value: string) {
                             _href = value;
                         },
                         get href() {
@@ -39,14 +39,20 @@ describe('DOMNormalizer', () => {
                 transform: 'rotate(45deg)',
                 rotate: '45deg'
             })
-        };
-        const config = new config_1.Html2CanvasConfig({ window: mockWindow });
-        context = new context_1.Context({
-            logging: false,
-            imageTimeout: 15000,
-            useCORS: false,
-            allowTaint: false
-        }, new bounds_1.Bounds(0, 0, 800, 600), config);
+        } as unknown as Window;
+
+        const config = new Html2CanvasConfig({ window: mockWindow });
+        context = new Context(
+            {
+                logging: false,
+                imageTimeout: 15000,
+                useCORS: false,
+                allowTaint: false
+            },
+            new Bounds(0, 0, 800, 600),
+            config
+        );
+
         // Create a mock HTMLElement with style property
         mockElement = {
             nodeType: 1, // Node.ELEMENT_NODE
@@ -56,58 +62,72 @@ describe('DOMNormalizer', () => {
                 transform: 'rotate(45deg)',
                 rotate: '45deg'
             }
-        };
+        } as unknown as HTMLElement;
     });
+
     it('should disable animations on element', () => {
-        const styles = new css_1.CSSParsedDeclaration(context, {
+        const styles = new CSSParsedDeclaration(context, {
             animationDuration: '1s',
             transform: null,
             rotate: null
-        });
-        dom_normalizer_1.DOMNormalizer.normalizeElement(mockElement, styles);
-        (0, assert_1.strictEqual)(mockElement.style.animationDuration, '0s');
+        } as any);
+
+        DOMNormalizer.normalizeElement(mockElement, styles);
+
+        strictEqual(mockElement.style.animationDuration, '0s');
     });
+
     it('should replace transform with identity translate (preserves containing block, Issue #101)', () => {
-        const styles = new css_1.CSSParsedDeclaration(context, {
+        const styles = new CSSParsedDeclaration(context, {
             animationDuration: '0s',
             transform: 'rotate(45deg)',
             rotate: null
-        });
-        dom_normalizer_1.DOMNormalizer.normalizeElement(mockElement, styles);
-        (0, assert_1.strictEqual)(mockElement.style.transform, 'translate(0, 0)');
+        } as any);
+
+        DOMNormalizer.normalizeElement(mockElement, styles);
+
+        strictEqual(mockElement.style.transform, 'translate(0, 0)');
     });
+
     it('should replace rotate with 0deg (preserves containing block, Issue #101)', () => {
-        const styles = new css_1.CSSParsedDeclaration(context, {
+        const styles = new CSSParsedDeclaration(context, {
             animationDuration: '0s',
             transform: null,
             rotate: '45deg'
-        });
-        dom_normalizer_1.DOMNormalizer.normalizeElement(mockElement, styles);
-        (0, assert_1.strictEqual)(mockElement.style.rotate, '0deg');
+        } as any);
+
+        DOMNormalizer.normalizeElement(mockElement, styles);
+
+        strictEqual(mockElement.style.rotate, '0deg');
     });
+
     it('should normalize all properties when all are set', () => {
-        const styles = new css_1.CSSParsedDeclaration(context, {
+        const styles = new CSSParsedDeclaration(context, {
             animationDuration: '2s',
             transform: 'rotate(90deg)',
             rotate: '90deg'
-        });
-        dom_normalizer_1.DOMNormalizer.normalizeElement(mockElement, styles);
-        (0, assert_1.strictEqual)(mockElement.style.animationDuration, '0s');
-        (0, assert_1.strictEqual)(mockElement.style.transform, 'translate(0, 0)');
-        (0, assert_1.strictEqual)(mockElement.style.rotate, '0deg');
+        } as any);
+
+        DOMNormalizer.normalizeElement(mockElement, styles);
+
+        strictEqual(mockElement.style.animationDuration, '0s');
+        strictEqual(mockElement.style.transform, 'translate(0, 0)');
+        strictEqual(mockElement.style.rotate, '0deg');
     });
+
     it('should not modify element if it is not an HTMLElement', () => {
         const svgElement = {
             nodeType: 1,
             tagName: 'svg'
-        };
-        const styles = new css_1.CSSParsedDeclaration(context, {
+        } as unknown as Element;
+
+        const styles = new CSSParsedDeclaration(context, {
             animationDuration: '1s',
             transform: 'rotate(45deg)',
             rotate: '45deg'
-        });
+        } as any);
+
         // Should not throw and should not try to access style
-        dom_normalizer_1.DOMNormalizer.normalizeElement(svgElement, styles);
+        DOMNormalizer.normalizeElement(svgElement, styles);
     });
 });
-//# sourceMappingURL=dom-normalizer.test.js.map

package/src/dom/__tests__/element-container.test.ts

@@ -0,0 +1,129 @@
+import { strictEqual, ok } from 'assert';
+import { ElementContainer, ElementContainerOptions } from '../element-container';
+import { Context } from '../../core/context';
+import { Bounds } from '../../css/layout/bounds';
+import { Html2CanvasConfig } from '../../config';
+
+describe('ElementContainer', () => {
+    let context: Context;
+    let mockElement: HTMLElement;
+
+    beforeEach(() => {
+        const mockWindow = {
+            document: {
+                createElement: (_name: string) => {
+                    let _href = '';
+                    return {
+                        set href(value: string) {
+                            _href = value;
+                        },
+                        get href() {
+                            return _href;
+                        },
+                        get protocol() {
+                            return 'http:';
+                        },
+                        get hostname() {
+                            return 'localhost';
+                        },
+                        get port() {
+                            return '';
+                        }
+                    };
+                }
+            },
+            location: { href: 'http://localhost/' },
+            getComputedStyle: () =>
+                ({
+                    animationDuration: '1s',
+                    transform: 'rotate(45deg)',
+                    rotate: '45deg',
+                    display: 'block',
+                    position: 'static'
+                }) as CSSStyleDeclaration
+        } as unknown as Window;
+
+        const config = new Html2CanvasConfig({ window: mockWindow });
+        context = new Context(
+            {
+                logging: false,
+                imageTimeout: 15000,
+                useCORS: false,
+                allowTaint: false
+            },
+            new Bounds(0, 0, 800, 600),
+            config
+        );
+
+        mockElement = {
+            nodeType: 1,
+            tagName: 'DIV',
+            style: {
+                animationDuration: '1s',
+                transform: 'rotate(45deg)',
+                rotate: '45deg'
+            },
+            getAttribute: () => null,
+            getBoundingClientRect: () => ({
+                left: 0,
+                top: 0,
+                width: 100,
+                height: 100,
+                right: 100,
+                bottom: 100
+            })
+        } as unknown as HTMLElement;
+    });
+
+    it('should normalize DOM by default', () => {
+        const container = new ElementContainer(context, mockElement);
+
+        ok(container.styles);
+        ok(container.bounds);
+        // DOM should be normalized (animationDuration set to '0s')
+        strictEqual(mockElement.style.animationDuration, '0s');
+    });
+
+    it('should not normalize DOM when normalizeDom is false', () => {
+        const originalAnimation = mockElement.style.animationDuration;
+        const options: ElementContainerOptions = {
+            normalizeDom: false
+        };
+
+        const container = new ElementContainer(context, mockElement, options);
+
+        ok(container.styles);
+        ok(container.bounds);
+        // DOM should NOT be normalized
+        strictEqual(mockElement.style.animationDuration, originalAnimation);
+    });
+
+    it('should support explicit normalizeDom: true', () => {
+        const options: ElementContainerOptions = {
+            normalizeDom: true
+        };
+
+        const container = new ElementContainer(context, mockElement, options);
+
+        ok(container.styles);
+        ok(container.bounds);
+        strictEqual(mockElement.style.animationDuration, '0s');
+    });
+
+    it('should initialize empty arrays for textNodes and elements', () => {
+        const container = new ElementContainer(context, mockElement);
+
+        ok(Array.isArray(container.textNodes));
+        ok(Array.isArray(container.elements));
+        strictEqual(container.textNodes.length, 0);
+        strictEqual(container.elements.length, 0);
+    });
+
+    it('should initialize stacking context flags to false', () => {
+        const container = new ElementContainer(context, mockElement);
+
+        strictEqual(container.createsStackingContext, false);
+        strictEqual(container.createsRealStackingContext, false);
+        strictEqual(container.isListOwner, false);
+    });
+});