describe("canvas2svg", function() { describe("can by created", function() { it("with options", function() { var ctx = new C2S({width:100, height:200, enableMirroring:true}); expect(ctx instanceof C2S).toBe(true); expect(ctx.width).toEqual(100); expect(ctx.height).toEqual(200); expect(ctx.enableMirroring).toEqual(true); var ctx2 = new C2S(300,400); expect(ctx2 instanceof C2S).toBe(true); expect(ctx2.width).toEqual(300); expect(ctx2.height).toEqual(400); expect(ctx2.enableMirroring).toEqual(false); }); it("with no options and have defaults", function() { var ctx = new C2S(); expect(ctx instanceof C2S).toBe(true); expect(ctx.width).toEqual(500); expect(ctx.height).toEqual(500); expect(ctx.enableMirroring).toEqual(false); }); it("even if it's called as a function", function() { //notice the lack of new! var ctx = C2S({width:100, height:200, enableMirroring:true}); expect(ctx instanceof C2S).toBe(true); expect(ctx.width).toEqual(100); expect(ctx.height).toEqual(200); expect(ctx.enableMirroring).toEqual(true); var ctx2 = C2S(300,400); expect(ctx2 instanceof C2S).toBe(true); expect(ctx2.width).toEqual(300); expect(ctx2.height).toEqual(400); expect(ctx2.enableMirroring).toEqual(false); var ctx3 = C2S(); expect(ctx3 instanceof C2S).toBe(true); expect(ctx3.width).toEqual(500); expect(ctx3.height).toEqual(500); expect(ctx3.enableMirroring).toEqual(false); }); }); describe("has implemented methods", function() { var ctx, methods = [ "save", "restore", "scale", "rotate", "translate", "transform", "beginPath", "moveTo", "closePath", "lineTo", "bezierCurveTo", "quadraticCurveTo", "stroke", "fill", "rect", "fillRect", "strokeRect", "clearRect", "createLinearGradient", "createRadialGradient", "fillText", "strokeText", "measureText", "arc", "clip", "drawImage", "createPattern" ]; beforeEach(function() { ctx = new C2S(); }); //TODO: better tests for each method for(var i=0; i'); }); }); describe("it will generate ids", function() { it("that start with a letter", function() { var ctx = new C2S(); ctx.createRadialGradient(6E1, 6E1, 0.0, 6E1, 6E1, 5E1); var svg = ctx.getSvg(); var id = svg.children[0].children[0].id; var test = /^[A-Za-z]/.test(id); expect(test).toEqual(true); }); }); describe("will split up rgba", function() { //while browsers support rgba values for fill/stroke, this is not accepted in visio/illustrator it("to fill and fill-opacity", function() { var ctx = new C2S(); ctx.fillStyle="rgba(20,40,50,0.5)"; ctx.fillRect(100,100,100,100); var svg = ctx.getSvg(); expect(svg.querySelector("rect").getAttribute("fill")).toBe("rgb(20,40,50)"); expect(svg.querySelector("rect").getAttribute("fill-opacity")).toBe("0.5"); }); it("to stroke and stroke-opacity", function() { var ctx = new C2S(); ctx.strokeStyle="rgba(10,20,30,0.4)"; ctx.strokeRect(100,100,100,100); var svg = ctx.getSvg(); expect(svg.querySelector("rect").getAttribute("stroke")).toBe("rgb(10,20,30)"); expect(svg.querySelector("rect").getAttribute("stroke-opacity")).toBe("0.4"); }); }); describe("supports path commands", function() { it("and moveTo may be called without beginPath, but is not recommended", function() { var ctx = new C2S(); ctx.moveTo(0,0); ctx.lineTo(100,100); ctx.stroke(); }); }); describe("supports text align", function() { it("not specifying a value defaults to 'start'", function() { var ctx = new C2S(); ctx.font = "normal 36px Times"; ctx.fillStyle = "#000000"; ctx.fillText("A Text Example", 0, 50); var svg = ctx.getSvg(); expect(svg.querySelector("text").getAttribute("text-anchor")).toBe("start"); }); it("assuming ltr, left maps to 'start'", function() { var ctx = new C2S(); ctx.textAlign = "left"; ctx.font = "normal 36px Times"; ctx.fillStyle = "#000000"; ctx.fillText("A Text Example", 0, 50); var svg = ctx.getSvg(); expect(svg.querySelector("text").getAttribute("text-anchor")).toBe("start"); }); it("assuming ltr, right maps to 'end'", function() { var ctx = new C2S(); ctx.textAlign = "right"; ctx.font = "normal 36px Times"; ctx.fillStyle = "#000000"; ctx.fillText("A Text Example", 0, 50); var svg = ctx.getSvg(); expect(svg.querySelector("text").getAttribute("text-anchor")).toBe("end"); }); it("center maps to 'middle'", function() { var ctx = new C2S(); ctx.textAlign = "center"; ctx.font = "normal 36px Times"; ctx.fillStyle = "#000000"; ctx.fillText("A Text Example", 0, 50); var svg = ctx.getSvg(); expect(svg.querySelector("text").getAttribute("text-anchor")).toBe("middle"); }); it("stores the proper values on save and restore", function() { var ctx = new C2S(); ctx.textAlign = "center"; expect(ctx.textAlign).toBe("center"); ctx.save(); expect(ctx.textAlign).toBe("center"); ctx.textAlign = "right"; expect(ctx.textAlign).toBe("right"); ctx.restore(); expect(ctx.textAlign).toBe("center"); }); }); });