Carbide-Software / Carbide-Support

Support for Carbide
https://carbide.dev
1 stars 0 forks source link

Diagram rendering broken in locales that use "," as decimal point #23

Open garlic-os opened 1 year ago

garlic-os commented 1 year ago

Describe the bug Under cetain browser locale settings, the numbers in SVG paths in the Diagram view are using commas as decimal points instead of periods, causing the SVGs to render incorrectly. Several locales, including es-AR — the one I'm on — use a comma for the decimal point instead of a period, so you would say Pi is "3,14159". For some reason this is carrying over to the numbers in the app's dynamically generated SVG code. Of course, SVG still expects periods as the decimal point, so this causes problems.

To Reproduce Assuming you are on a locale that uses period decimal points (like en-US):

  1. Install Locale Switcher or similar
  2. Open a diagram in Carbide
  3. Verify that it is rendering correctly
  4. Switch to a locale that uses comma decimals, such as es-AR (don't worry Carbide will still be in English)
  5. You might have to refresh
  6. See that the diagram is now rendering incorrectly. Specifically, elements' sizes and dimensions are all wrong

Expected behavior A typical element within the SVGs should look like this:

<path ... d="M 212,150.66666666666669 L 366.7111111111111,186 L 566.7111111111111,186 L 722.7555555555556,140.66666666666669"></path>

but instead they look like this:

<path ... d="M 212,150,66666666666669 L 366,7111111111111,186 L 566,7111111111111,186 L 722,7555555555556,140,66666666666669"></path>

Note that all of the decimals are being separated with commas and thus being treated as separate numbers.
In this example the intended sequence is 212, then 150.66666666666669, and so on.
In the incorrectly-generated SVG, we are getting 212, then 150, then 66666666666669. Oh no.

Screenshots Expected image

Actual image

Desktop: