/** * @jest-environment jsdom */ import { renderSVG, svgExport } from "./../index"; /** * @jest-environment jsdom */ describe(svgExport, () => { beforeAll(() => { document.body.innerHTML = '

' + ' " + "

"; const createElement = document.createElement.bind(document); document.createElement = (tagName: any, options: any) => { if (tagName === "canvas") { return { getContext: () => ({ direction: "ltr", fillStyle: "#000000", filter: "none", font: "10px sans-serif", globalAlpha: 1, globalCompositeOperation: "source-over", imageSmoothingEnabled: true, imageSmoothingQuality: "low", lineCap: "butt", lineDashOffset: 0, lineJoin: "miter", lineWidth: 1, miterLimit: 10, shadowBlur: 0, shadowColor: "rgba(0, 0, 0, 0)", shadowOffsetX: 0, shadowOffsetY: 0, strokeStyle: "#000000", textAlign: "start", textBaseline: "alphabetic", clearRect(x: number, y: number, w: number, h: number) { jest.fn(); }, drawImage( image: HTMLElement, dx: number, dy: number, dWidth: number, dHeight: number ) { jest.fn(); }, beginPath() { jest.fn(); }, rect(x: number, y: number, w: number, h: number) { jest.fn(); }, fill() { jest.fn(); }, }), measureText: () => ({}), }; } return createElement(tagName); }; global.URL.createObjectURL = jest.fn( () => '"blob:http://localhost:4000/ea9b4b19-5ded-44ff-bc4a-227abdaabe38"' ); if (!window.SVGElement) { // @ts-ignore window.SVGElement.prototype = {}; } // @ts-ignore window.SVGElement.prototype.getBBox = () => ({ x: 0, y: 0, width: 20, height: 20, }); window.getComputedStyle = jest.fn((element) => new CSSStyleDeclaration() ) // @ts-ignore window.SVGElement.prototype.getComputedTextLength = () => 200; global.XMLSerializer = jest.fn(); // @ts-ignore global.XMLSerializer.prototype.serializeToString = jest.fn( (SVGElement) => { return '""'; } ); let onloadRef: Function | undefined; Object.defineProperty(Image.prototype, "onload", { get() { return this._onload; }, set(onload: Function) { onloadRef = onload; this._onload = onload; }, }); }); afterAll(() => { jest.clearAllMocks(); // @ts-ignore delete window.SVGElement.prototype.getBBox; }); it("should have a id in DOM", function () { const idContain = document.querySelector("#imagesave"); expect(idContain?.nodeName).toContain("DIV"); }); it("should return a blobURL", async function() { let canvas = document.createElement("canvas"); let context = canvas.getContext("2d"); const elementContainer = document.querySelector(`#imagesave`); let svg = elementContainer?.querySelector("svg"); const expected = renderSVG(svg!, context, undefined, canvas, "example"); expect(expected).toBe("http://localhost/%22blob:http://localhost:4000/ea9b4b19-5ded-44ff-bc4a-227abdaabe38%22") }); });