Same code executed on the server does not produce the same results as in the browser

[laszlo1337]

Bug Report

Description of the problem

I have created working example of drawing SVG path into pdf using PDFKit browser sandbox (https://pdfkit.org/demo/browser.html) The problem is, while it's working perfectly here, the same code ported to server environment produces different results. The exact issue is within translate function, which translates the SVG path way too much (mathematically incorrectly). I assume the units would be at fault? Attaching expected result from browser sandbox and result produced by the same code on the server (the same code minus blobStream code of course) (set the one from the browser as blue color) 4282dfc2-f3f1-4399-9ec4-191e59185540.pdf 2SFtR3p2.pdf

EDIT: Also just discovered, when drawing rect and then drawing the path, it works as expected in the browser, but on the server the drawn rect is drawn OVER the path, even though the order of drawing is preserved. To test, place doc.save().rect(0, 0, totalSize, totalSize).fill('#00FF00').restore() just before path drawing result when rendered on the server: 5Hl7kt4n.pdf result from browser sandbox: 8b7edae8-0a0c-412d-8fa9-4412d5963b9d.pdf

Code sample

var paddingFactor = 3
var size = 500

var sizeFactor = 25
var additionalSpaceIfNoPadding = 1
var scale = size / sizeFactor
var padding = paddingFactor * scale
var hasNoPadding = padding === 0
var totalSize = size + (hasNoPadding ? additionalSpaceIfNoPadding * 2 : padding * 2)

var doc = new PDFDocument({size:[totalSize,totalSize]});
var stream = doc.pipe(blobStream());

const delta = hasNoPadding ? additionalSpaceIfNoPadding : padding

doc
  .save()
  .translate(delta, delta)
  .scale(scale)
  .strokeColor('#0000ff')
  .path('M0 0.5h7m1 0h1m1 0h5m3 0h7M0 1.5h1m5 0h1m2 0h2m1 0h1m1 0h2m2 0h1m5 0h1M0 2.5h1m1 0h3m1 0h1m3 0h1m1 0h2m1 0h2m1 0h1m1 0h3m1 0h1M0 3.5h1m1 0h3m1 0h1m6 0h2m1 0h1m1 0h1m1 0h3m1 0h1M0 4.5h1m1 0h3m1 0h1m2 0h1m1 0h2m1 0h1m3 0h1m1 0h3m1 0h1M0 5.5h1m5 0h1m3 0h1m2 0h4m1 0h1m5 0h1M0 6.5h7m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h7M8 7.5h1m1 0h1m1 0h1m3 0h1M0 8.5h2m1 0h2m1 0h1m2 0h2m1 0h3m1 0h1m1 0h1m5 0h1M0 9.5h1m1 0h1m1 0h1m2 0h3m2 0h2m2 0h8M0 10.5h4m1 0h3m2 0h1m2 0h1m1 0h2m4 0h1m2 0h1M0 11.5h1m1 0h3m4 0h2m1 0h1m3 0h1m2 0h1m1 0h4M1 12.5h2m1 0h3m2 0h1m3 0h1m3 0h1m1 0h2m3 0h1M0 13.5h3m4 0h2m3 0h3m1 0h2m1 0h2m2 0h1M0 14.5h5m1 0h1m4 0h1m2 0h1m3 0h7M0 15.5h1m1 0h1m2 0h1m1 0h3m2 0h1m1 0h2m1 0h2m1 0h1m1 0h1m1 0h1M0 16.5h1m1 0h1m1 0h3m4 0h1m1 0h1m1 0h9M8 17.5h7m1 0h1m3 0h1m1 0h2M0 18.5h7m5 0h2m1 0h2m1 0h1m1 0h3m1 0h1M0 19.5h1m5 0h1m2 0h4m2 0h2m3 0h3m1 0h1M0 20.5h1m1 0h3m1 0h1m1 0h1m3 0h1m3 0h9M0 21.5h1m1 0h3m1 0h1m1 0h5m1 0h1m4 0h1m1 0h2m1 0h1M0 22.5h1m1 0h3m1 0h1m2 0h2m3 0h1m1 0h1m1 0h2m2 0h3M0 23.5h1m5 0h1m1 0h1m3 0h1m4 0h5m1 0h2M0 24.5h7m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h1m1 0h2m2 0h1')
  .stroke()
  .restore()

// end and display the document in the iframe to the right
doc.end();
stream.on('finish', function() {
  iframe.src = stream.toBlobURL('application/pdf');
});

Your environment

• pdfkit version: 0.14.0
• Node version: 18.12.0
• Browser version (if applicable): Opera 106.0.4998.28
• Operating System: Windows 10

[blikblum]

Can you test with v0.15 and a browser app using webpack (https://github.com/foliojs/pdfkit/tree/master/examples/webpack)?

Currently the docs build system is broken, so (https://pdfkit.org/demo/browser.html) is outdated