svgdotjs / svgdom

Straightforward DOM implementation to make SVG.js run headless on Node.js
MIT License
269 stars 53 forks source link

Path.width() - RangeError: Maximum call stack size exceeded #84

Closed dreerr closed 2 years ago

dreerr commented 2 years ago

I have working code for the browser and need to port it to a server side solution. It seems that there is a bug similar to this issue here but in this case it has to do with the bounding box when trying to get Path.width().

/cwd/node_modules/@svgdotjs/svg.js/dist/svg.node.js:1812
      throw new Error(`Getting bbox of element "${el.node.nodeName}" is not possible: ${e.toString()}`);
      ^

Error: Getting bbox of element "path" is not possible: RangeError: Maximum call stack size exceeded
    at retry (/cwd/node_modules/@svgdotjs/svg.js/dist/svg.node.js:1812:13)
    at getBox (/cwd/node_modules/@svgdotjs/svg.js/dist/svg.node.js:1792:11)
    at Path.bbox (/cwd/node_modules/@svgdotjs/svg.js/dist/svg.node.js:1816:15)
    at Path.width (/cwd/node_modules/@svgdotjs/svg.js/dist/svg.node.js:4564:33)
    at /cwd/src/minimal-example.js:10:48
    at List.forEach (<anonymous>)
    at Object.<anonymous> (/cwd/src/minimal-example.js:10:19)
    at Module._compile (node:internal/modules/cjs/loader:1101:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)

this is a minimal example of the code failing with svgdom

const fs = require('fs');
const { SVG, registerWindow } = require('@svgdotjs/svg.js')
const { createSVGWindow } = require('svgdom')
const window = createSVGWindow()
const document = window.document
registerWindow(window, document)

let svg = fs.readFileSync('./minimal-example-bug.svg', 'utf8')
let draw = SVG(document.documentElement)
draw.svg(svg)
draw.find('path').forEach(el => console.log(el.width()))

you can find the svg file here it is most definitely the complex object in the background.

Any ideas on how to solve this? In a browser environment the code ist working fine.

Fuzzyma commented 2 years ago

Do you use the latest version? If not try to update. If that doesn't work, paste the SVG file so i can debug it I cant read

dreerr commented 2 years ago

Thanks for the prompt reply @Fuzzyma

Yes, using the lastest version, can you reproduce the error on you system?

You could download the SVG from the URL, right?

Fuzzyma commented 2 years ago

I did not test yet. It's a bit busy atmπŸ˜…

Fuzzyma commented 2 years ago

@dreerr your minimal example file consists of thousands of paths and transformed groups. Its more like the most complicated example one can imagine :D. This is almost impossible to debug

Fuzzyma commented 2 years ago

I just run the example and it was working correctly. It could depend on the node version but since the error is a stack-size error, you can also try to run the example with a bigger stack (--max-stack afaik)

dreerr commented 2 years ago

Yes the example is rather complex πŸ˜‡ Which version of node were you running the example with?

Fuzzyma commented 2 years ago

Well, the whole reason of a minimal example is, that it is minimal :D. My code has to parse the whole svg file after all.

My node is v17.1

dreerr commented 2 years ago

With running Node.js v17.1.0 and @svgdotjs/svg.js@3.1.1 I am getting the same Maximum call stack size exceeded error, no matter what --stack_size= I enter. Any idea on how I can debug this any further?

Fuzzyma commented 2 years ago

find out which path actually triggers this error. There are only a few thousands of them so that should be easy (irony off :D)

Fuzzyma commented 2 years ago

its just strange that it doesnt happen for me. what version of svgdom are you running?

dreerr commented 2 years ago

Yes very strange indeed, I am using svgdom@0.1.10 that would be the most recent version. I will identify the path and get back to you.

dreerr commented 2 years ago

Here minimal-example-path.svg is the SVG with the problematic path, it is a big compound path. I opened the SVG with Illustrator and saved it again just to be sure it has not to do with a faulty syntax.

UPDATE 1: It seems to be architecture specific 😩 when running the example on x64 it does not get an error, but with arm64 it throws the RangeError

UPDATE 2: I installed a x64 Version of Node with the help of this article and the example is working now.

Fuzzyma commented 2 years ago

Yeah this new file doesnt help with debugging. I would need to step through every single pass command in order to find the one failing and its not even failing for me :D - impossible to debug

Hope your solution works

dreerr commented 2 years ago

Yes indeed, thanks for your support!