Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

TypeError: unsupported file type: undefined (file: undefined) with what I think are valid SVG files #397

Open
dabeeeenster opened this issue Jan 8, 2024 · 7 comments

Comments

@dabeeeenster
Copy link

Test gist is here:

https://gist.github.com/dabeeeenster/004e82c3e344707751f294c16d5ddf50

Running this I get the following:

TypeError: unsupported file type: undefined (file: undefined)
    at lookup (/Users/ben/flagsmith/flagsmith/docs/node_modules/image-size/dist/index.js:42:11)
    at imageSize (/Users/ben/flagsmith/flagsmith/docs/node_modules/image-size/dist/index.js:98:16)
    at IncomingMessage.<anonymous> (/Users/ben/flagsmith/flagsmith/docs/test.js:17:19)
    at IncomingMessage.emit (node:events:526:35)
    at endReadableNT (node:internal/streams/readable:1408:12)
    at process.processTicksAndRejections (node:internal/process/task_queues:82:21)

Node.js v20.9.0

But I think the SVG file is fine?

@netroy
Copy link
Member

netroy commented Jan 8, 2024

The issue seems to be that the test regexp for SVGs is failing because of the long encoded content attribute in this file.
Stuff like this is why I wonder if I should simply drop SVG support, and recommend that people use a proper SVG/XML parser instead.
using regular expressions to parse SVGs is always going to be janky.
We have more test images for SVGs than any other format in this repo, and yet this continues to be a game of whack-a-mole.

@dabeeeenster
Copy link
Author

Thanks for the info. I ended up running my svgs through https://github.com/svg/svgo and that cleared the warnings. The SVGs were originally exported from draw.io so I guess its doing something odd with the export. I guess this could be closed now?

@netroy
Copy link
Member

netroy commented Jan 9, 2024

let's leave this open for now.
also, thanks for reporting this 🙏🏽

@dabeeeenster
Copy link
Author

👍

for completeness an svg that throws warnings is:

 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="461" height="471" content="&lt;mxfile host=&quot;app.diagrams.net&quot; modified=&quot;2023-07-13T12:25:25.269Z&quot; agent=&quot;Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Safari/537.36&quot; etag=&quot;pL3P766dTkG_ieSSRFbr&quot; version=&quot;21.4.0&quot; type=&quot;device&quot; pages=&quot;3&quot;&gt;&lt;diagram id=&quot;XNaEL_YklisSCj5vr4Ki&quot; name=&quot;Page-1&quot;&gt;7Vnbcts2EP0azdgP1pAASVGP1s3N1G0VKzNtnzIgCVKIIYIFoVu+PosQvImy47iWLU9reUTg4LZY7NldUD08Xu1uJMmWv4mI8h6yol0PT3oIIcuz4aGRfYHY2McFkkgWGawGFuwrNaBl0DWLaN7qqITgimVtMBRpSkPVwoiUYtvuFgveXjUjCe0Ai5DwLvoni9SyQH00qPFfKEuW5cq2NyxaVqTsbHaSL0kktg0IT3t4LIVQRWm1G1OutVfqpRg3e6C1EkzSVD1lwJzGX8Nsw24+3m32CK2jz258ZWbZEL42G76bLj4Bcj3/AN8Xky8kTQSU7miu4DGTZEW3Qt7DOvO9Wor00uxO7UuVSbFOI6pXtXt4tF0yRRcZCXXrFqwEsKVacdMcM87Hggv5fSyOXOpHDuC5kuKeNlp8FGDPg5buvstNUKnorgEZPdxQsaJK7qFLaZeOORNjldgz9W19xE7ZZ9k43rIfMVaVVFPXioeC0f3PnAPuqJFGYIimKiSoOhEp4dMaHdWKtqBW97kVIjPq/UKV2htWkbUSbeXnikh1rVkCQMhJnrOwhGeMl91A0XL/l16mb/sV8DcAV1bfsipksjOiFLV9szankoGqqDTgg6eYi7UM6SOqMpoCGROqfmzaWo2P2oSknCi2afP92AGboXPBUlXbEkZWH1mNP7dtWu6g77XnLCQ30xzYTSXX800Jdyg94yTJVwwsG1kTki8DQWTUQx4H9Y0CCaVEly7uKAEPima/gxt/WVpTG4g9OEbroTfA5ES0Rm6X1rb3mrSufP+r0rrB14HlNPlq95/H1ic6iueT2i5j+6uz+t+57W78nItcJZIuPt52jh4ygEwXwz1ncMIS/5hHQWELt0EFkPA++W4hf6wVTENLV14Yg+0eiamE+nF4jHxe6NMgfhnyuVabfI5/hHzWEfL5J4upgzcmnz9wm+TTsRKdJ/uc98k+p8O+MqrlGUlbR+/9s9aJ9igsrP9aC5kEF2B78A/LW43SpS5qfVo1264OBiLXrQYclC/r1crQupj8Cm1jzvTRGBFhy4WURZeOrYqC3+PqYqNlikWqGgSGz0wrbJRIEunJy7ZUaM9w6Amq7m1PYDpHkBpUlq+Jz+AadEsCysGnMcVECm1K06BqveYs0WgglBIraCAGCEEWbb+tnABkN7SxUVk3+9VLkjwrNhqznZZjlOkUicrpBibLSz9nfOhql+gbZ59sc6e/EgHj9HNY6BeP+IHQlTQv4Oc8u+3n7CNJBrb6zrDr6Vz/VGmG3bGe1/V0aNjydPb5errh+/R0w46n+5DGfL2bjLp5/CdQKfRdgG5p/t9KQjA6tyQEeW9MzXYKcpakRE+90uOzIiXq3rQndEO5yEB1h4f+QCwr3ghah9G39Y7mSKg+IJdr6c9jge+Z4fxoDtKJ8YcxWcQxC2k/oht45H1OsmKZFyA4Gtrt6OuhDsHLMNvkN3ZOZQRvfcnw0ODwjZztnSfN3+ctA3VvGe10/n+mn4LpVeiu8myvw/TBkUjueD9tB1Ctf4YpXsPWv2bh6Tc=&lt;/diagram&gt;&lt;diagram id=&quot;oh8OrfCXsYfyTmtY3FNg&quot; name=&quot;SaaS&quot;&gt;7Vxbd6M2EP41fowPd/CjY2fTdrNbN97s7aVHBtlmg5Er5CTur68Ewlwk3wI2OE32bAKDwDDffDOj0eCOPli83GKwnH9CHgw6muK9dPRhR9NUw9boHyZZJ5Ke4ySCGfY9PigTjP1/IRcqXLryPRgVBhKEAuIvi0IXhSF0SUEGMEbPxWFTFBQ/dQlmUBCMXRCI0m++R+aJ1DGVTP4b9Gfz9JNVhR9ZgHQwF0Rz4KHnnEi/6egDjBBJthYvAxgw5aV6Sc77sOXo5sYwDMkhJ4x+9qw7//nzIBr+Gt8+os+jl+CKo/MEghV/4I5mgcWyo1+Hk4j96bDLvovaLfoKscuIF9sZWafGi9Eq9CDDX6Xjnuc+geMlcNnRZ0pXKpuTRcAPg8CfhXQ7gFNqT9dPEBOf8qDPxQSx8bMARIxRCt2OHiFx53wHYJeT16B7Uz8IBihAOL4PfWqyf0yOQpKTJz/sUgSjR5g7YsU/8cPF9klvBr5sNXx1QyfqhyBaQILXdAg/wVR73V4vOYt7IaPHSfmccVpLmTvP8dnhMsDdyGxz9YxpdIOTbQuPqbsCt89IedBtZfr9408SWVd2jczrfxvT37cBmoA3bAMC4BKzEG2AA26aIuC6KQFcN06GuFof4u+id9GlihJvdYdCD4Xv3koasajXKIQrUxKuNiGs4L3SGFbFe/Xv3d7No3L91x8u7A3++QrQ3+h1ieLNYHwGhEvQeSZ0PEMGkaNN9Nog6hUhsjQJRLIAo2o1QCQNMI4hKBt6dDLDdxEmczRDIQhuMul1BgfjRDbmDjHdxiD8goSsOVXAiqAiRPDFJ9/56Wz7B9vumnxv+JI7NFynOyF93u/pBdhO7iy2m50W76XnRQRg0mezOioIUQhT2QefqYqf4aUjXEZ9302EfIi6C/4IrbALd7BA1fkUFOAZJDuw0Hi+yQDYaU4YBoD4T8XZZu3sTe/7OPreDxug73QKLdeV0dezexNFOQ19bUl+eDr6yjFSBWWfg74pFXPs+1Egn5yK8d4IYp8+PMQ5kueuxb1B6iXkvqDA6YyxeVpX5KxIWfk4pW7KxqfSRwPr3IAl8kMS5a48YoLMMjeBJLVMu1TWOW483UjuIDPMzaNUCDWN2OqBpnLSCGAcak3GSaxJgN9QivAbdukSyZ3yszK7ONYsDb2Ukuq7zXLP+MpmuQucXJS7h6wkonyhbopGt4BFoQmmWzO2NSYYgoUfzuiIMcRPPkW+UrwTQtlU2xLKrIll1pSJli3AssRQtola+VBmnSySKQIO/RVGGFDZCEVkhmEkKDqagyXbdNeBTzWO9f3qniTY3E02AuA+zmLE/lwRehmYOo7Eo6imiBFU6XzBlmHUs2wd1ITRpvyUOmlHgpEhwcg+2Xyu17gHf30Cn+YZV0pXUYzCxMMw90w96E45bamQW0jCgTxgOucJB5qtdW29FBGsbs/sbX6cg+JDXS5ZF33BPZxSBzAX/fGHAMyibW5aaq53YAID+ZzDpWAyhIVZx8L3vMSaIfULYBJfj5kBD4H04uZ1xxxKDWMnlySrFHxZkn9KJ7/yJ/MT1KBVQzML+HE0KxrGlV24aOl8NJ1G8CT4q2JMZqGWIsNibnyHN08wTj3KuA+Gn6uF48NNoV3VP6tkAPaBAb13qsqSbgsgCsiwuLs8/OmPpkZ5miNb0FFPNWHfWeM5ekFnuA7BArENtpeu2ylfmCrExKidFZfddrLf1puDTRdL2TcPF52OVsUiPap37aLnkc0kdAlY5smwkkQPtKL3oin9Bc3iXPAOnAw43WwaOFMArh/5IL5nTREXKv6PqJUW+ZonmyVg9jDmiInx/h2x5llmmgIsb6MMu3c+bXHwSvPp4pR9x0y89om3WkrajXLnWHJjdcyzpY8lqbm9rj2DmQoLr6Pf6e8r+v8OLCaeGGfbsI5f6OcoNHqkvbY1LReWJh+yxf4zZ7HpamEpi62lr6ahMnbXKGWfkimeqvW6qdfLK/pkerbEDDQOigNq0lOEQ78iM9qia2mN4dy63po0flotJsC/QE2rTslztMKmxXJOsYVY6bsuDCAGhOqkmRKcB6AzlcJjuQ6cTE/i103JsozUr+s1QCN9H6PN6+pbMq496yZyC3TEPG9788YZuqZ23mWOJ/ESxcKPKxBDEM0nCGCvIYpMFKhDS0YRBToKzXPrWbrUna5aXFEyJemPamVFiLqZIm+nF4NFHJj/nPvoAgOFJCRLmn7PHipssSbAlLwpviljwArZI7AK3obWbbUNWpcE6CQRGvvhDCwRvsRGFSEXakPOaYs+PlU1RKuKr1O1Q82t8CPiWlmq5rUXwvUb0HMrPIcjFmrf8jsADTWBHtpSXHsPaLW2PIGCgziQJLW+i+OfaZX83Dn7HuXkE5MlQa+nbpMwy80jsoLDeUuVqb6PK03nZ1oPEcRNNEbU2Qa022KOapg4N36yF5dLWKSrgatF0HdZ1ShTcdyjN0KRT3zEVD1BhKDFVgxymKFkUXCw+WqPI1pRjtDsZi5QII4h8ka2tnc6Z9KCniu1VB9rgTNxxHz9AGcyHn58027kVX1X50ZO1i7XejdydJNAy9xIOvlrZUW5riR9Z9qxv5eg9t78SksAVhOASTWwV+/S+zdFtW+fHDWlZPsyWMFfkckooTSDlbolTzgPWGKl/x56/uW9QlbpW6zKL1TKXiGzJJGljjfIpKg08gJZjbbftiVI+XpwI+H7tbU56ZcCnHR1uRqyVb1afOqxb1LbpbqVo5olM6n2ZvQuleRc6BcQPVLJCCMXRlHVPo/XVgArucRNxf0MFUC6m31VZ4JK9oWn+s1/&lt;/diagram&gt;&lt;diagram name=&quot;Self Hosted&quot; id=&quot;YmJ6SFfmmwLSLWzwg-ZU&quot;&gt;5Vrbdps4FP0aP3YWd8ij4ySdrslM3aZdM+2bABk0EchLyLE9Xz9HRlyFE6cxtjtjPwRtxAHtfbTRkTOxZ9nmPUfL9HcWYzqxjHgzsW8mlmWapgN/JLItEd8JSiDhJFadGuCB/IMVaCh0RWJcdDoKxqggyy4YsTzHkehgiHO27nZbMNq96xIlWAMeIkR19E8Si7REA9do8F8xSdLqzqahzmSo6qyAIkUxW7cg+3ZizzhjojzKNjNMJXkVL9/Rpz/s4MNDOOWf3n0Onr5+NDbvymB3r7mkHgLHuThuaCXuE6IrxZcaq9hWBHK2ymMsg5gT+3qdEoEfliiSZ9eQMoClIqPqNKIkyeGY4gU86fUT5oKAFlMFCyb7JxQVUlUDjotHLKJUNRCPVAI50FoQSmeMMr57Dnvhyq/EWS5aePmRoQRnj7h1xtt94IwaJDwM3vSy4gVKzVpnmCCYZVjwLVynojhVrqi54VXtdZNpjqewtJVllq9ApLI7qWM3CsKBEvEVgroDgnook7TnYbHckWH0oflWpCyHE59XuSAZPkEO9MSNXRzEzpCIgRXa44po9US0BkS0BkQ0rbFEDDQBcAymppqMg1oJyxG9bdDrRiI5k5o+90zyvRPmbyzEVk0wtBKsKxtwyLd/yet/cavmNxVu17jZdFrbdmuOOeSNwLwCN0S0YkHrW3UbOG4iyUYVqBCIi6m0fAAi6REkquA7QqvnLLmRhPxAFgCpbMUj/Ew/W00huG2Cnw24J684pkiQp+7jDeXI7lIYMNq2OiwZyUXRijyXQJOuXi9dfb9n+6/rDwflEzTZWg/lxxPYNDUbmrNCJBwXWmrDa3UpD6MtJZDB3H7ZYcIy1+/DGkDRY7KbAR9XAsJghRdlspuu7jjYBM/xhxznyvNtNKbjuG5PkkB3HNMZcJzR3hrVwE7rOAdOeJzHeicAO10q7+o4V2Nke7xrbC+pRHzRS0rTeauXaJPf9NxOpjlBL4PKEairnnER0+8GcvuByhFqgY5lKJZ/wQk6dhZZwamy6G0mEmimf4OKNGSIx8dZUUbAp1xiaGvKjMTxTvKeyYcGtrE3ZPIGDowgGNPkvd6y0h4w+aFlpT2Wydt6bTBjHBb7xnT+4W0C9Uu1xcKKoiHaYy/03FHfrX3avQNp90aj3dNo18iWa5flXkrU1ggKq+7GUajynC5VzkD1aponLXxsX+PqjqKkyAg8kGV8LTDXF5DHtZLB8vQsew9l4ujynVEe3eE1Narl/Cqj00iwNsX3KMQU6gAiCJNUh0wIlu3VoKUaK1f1s3qP0BiF2XpbpzcvtGlhn9RAri7UQOrV5OUYSKVVi6uHm98AmFGCVV39/zCPq0szD0ffE/g5zWMPs5dpHo5O8uUUTgdU9pORa6tqxfFibVVWN+eqrRzvHDKOTb7zcxS2zlk2H+o9rbpx2J7W4H78hexkHCz4efbW/V7xGJhuL3lG2Ct39EX1F1Q8AjLnLMJFAa/B/0hx7vd/Lx2xOIdm89N8qVXzDw727b8=&lt;/diagram&gt;&lt;/mxfile&gt;" version="1.1" viewBox="-0.5 -0.5 461 471" style="background-color:#fff"><g><rect width="460" height="270" x="0" y="200" fill="#f5f5f5" stroke="#666" pointer-events="all" rx="10.8" ry="10.8"/><rect width="420" height="120" x="20" y="220" fill="#d5e8d4" stroke="#82b366" pointer-events="all" rx="18" ry="18"/><g transform="translate(-0.5 -0.5)scale(0.9999999999999999)"><switch><foreignObject width="101%" height="101%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left"><div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe flex-start;justify-content:unsafe flex-start;width:418px;height:1px;padding-top:227px;margin-left:22px"><div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:left"><div style="display:inline-block;font-size:12px;font-family:Helvetica;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">Python Runtime</div></div></div></foreignObject><text x="22" y="239" fill="#000" font-family="Helvetica" font-size="12">Python Runtime</text></switch></g><path fill="none" stroke="#000" stroke-miterlimit="10" d="M 220 326.37 L 220 370 L 220 373.63" pointer-events="stroke"/><path fill="#000" stroke="#000" stroke-miterlimit="10" d="M 220 321.12 L 223.5 328.12 L 220 326.37 L 216.5 328.12 Z" pointer-events="all"/><path fill="#000" stroke="#000" stroke-miterlimit="10" d="M 220 378.88 L 216.5 371.88 L 220 373.63 L 223.5 371.88 Z" pointer-events="all"/><path fill="#e1d5e7" stroke="#9673a6" stroke-miterlimit="10" d="M 150 395 C 150 386.72 181.34 380 220 380 C 238.57 380 256.37 381.58 269.5 384.39 C 282.63 387.21 290 391.02 290 395 L 290 435 C 290 443.28 258.66 450 220 450 C 181.34 450 150 443.28 150 435 Z" pointer-events="all"/><path fill="none" stroke="#9673a6" stroke-miterlimit="10" d="M 290 395 C 290 403.28 258.66 410 220 410 C 181.34 410 150 403.28 150 395" pointer-events="all"/><g transform="translate(-0.5 -0.5)scale(0.9999999999999999)"><switch><foreignObject width="101%" height="101%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left"><div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:138px;height:1px;padding-top:428px;margin-left:151px"><div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center"><div style="display:inline-block;font-size:12px;font-family:Helvetica;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">Postgres</div></div></div></foreignObject><text x="220" y="432" fill="#000" font-family="Helvetica" font-size="12" text-anchor="middle">Postgres</text></switch></g><path fill="none" stroke="#000" stroke-miterlimit="10" d="M 135.03 126.37 L 135.03 290 L 153.63 290" pointer-events="stroke"/><path fill="#000" stroke="#000" stroke-miterlimit="10" d="M 135.03 121.12 L 138.53 128.12 L 135.03 126.37 L 131.53 128.12 Z" pointer-events="all"/><path fill="#000" stroke="#000" stroke-miterlimit="10" d="M 158.88 290 L 151.88 293.5 L 153.63 290 L 151.88 286.5 Z" pointer-events="all"/><path fill="none" stroke="#000" stroke-miterlimit="10" d="M 220 266.37 L 220 280 L 220 240 L 220 253.63" pointer-events="stroke"/><path fill="#000" stroke="#000" stroke-miterlimit="10" d="M 220 261.12 L 223.5 268.12 L 220 266.37 L 216.5 268.12 Z" pointer-events="all"/><path fill="#000" stroke="#000" stroke-miterlimit="10" d="M 220 258.88 L 216.5 251.88 L 220 253.63 L 223.5 251.88 Z" pointer-events="all"/><rect width="120" height="30" x="160" y="230" fill="#b0e3e6" stroke="#0e8088" pointer-events="all" rx="4.5" ry="4.5"/><g transform="translate(-0.5 -0.5)scale(0.9999999999999999)"><switch><foreignObject width="101%" height="101%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left"><div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:118px;height:1px;padding-top:245px;margin-left:161px"><div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center"><div style="display:inline-block;font-size:12px;font-family:Helvetica;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">Dashboard</div></div></div></foreignObject><text x="220" y="249" fill="#000" font-family="Helvetica" font-size="12" text-anchor="middle">Dashboard</text></switch></g><rect width="120" height="60" x="160" y="260" fill="#fff2cc" stroke="#d6b656" pointer-events="all" rx="9" ry="9"/><g transform="translate(-0.5 -0.5)scale(0.9999999999999999)"><switch><foreignObject width="101%" height="101%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left"><div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:118px;height:1px;padding-top:290px;margin-left:161px"><div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center"><div style="display:inline-block;font-size:12px;font-family:Helvetica;color:#000;line-height:1.2;pointer-events:all;white-space:normal;overflow-wrap:normal">Core API</div></div></div></foreignObject><text x="220" y="294" fill="#000" font-family="Helvetica" font-size="12" text-anchor="middle">Core API</text></switch></g><rect width="110" height="120" x="240" y="0" fill="#f5f5f5" stroke="#666" pointer-events="none" rx="16.5" ry="16.5"/><g transform="translate(-0.5 -0.5)scale(0.9999999999999999)"><switch><foreignObject width="101%" height="101%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left"><div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe flex-start;justify-content:unsafe center;width:108px;height:1px;padding-top:7px;margin-left:241px"><div data-drawio-colors="color: #333333;" style="box-sizing:border-box;font-size:0;text-align:center"><div style="display:inline-block;font-size:12px;font-family:Helvetica;color:#333;line-height:1.2;pointer-events:none;white-space:normal;overflow-wrap:normal">Flagsmith Users</div></div></div></foreignObject><text x="295" y="19" fill="#333" font-family="Helvetica" font-size="12" text-anchor="middle">Flagsmith Users</text></switch></g><ellipse cx="295" cy="47.5" fill="#FFF" stroke="#000" pointer-events="none" rx="7.5" ry="7.5"/><path fill="none" stroke="#000" stroke-miterlimit="10" d="M 295 55 L 295 80 M 295 60 L 280 60 M 295 60 L 310 60 M 295 80 L 280 100 M 295 80 L 310 100" pointer-events="none"/><rect width="110" height="120" x="80" y="0" fill="#f5f5f5" stroke="#666" pointer-events="none" rx="16.5" ry="16.5"/><g transform="translate(-0.5 -0.5)scale(0.9999999999999999)"><switch><foreignObject width="101%" height="101%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left"><div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe flex-start;justify-content:unsafe center;width:108px;height:1px;padding-top:7px;margin-left:81px"><div data-drawio-colors="color: #333333;" style="box-sizing:border-box;font-size:0;text-align:center"><div style="display:inline-block;font-size:12px;font-family:Helvetica;color:#333;line-height:1.2;pointer-events:none;white-space:normal;overflow-wrap:normal">SDK Clients</div></div></div></foreignObject><text x="135" y="19" fill="#333" font-family="Helvetica" font-size="12" text-anchor="middle">SDK Clients</text></switch></g><ellipse cx="135" cy="47.5" fill="#FFF" stroke="#000" pointer-events="none" rx="7.5" ry="7.5"/><path fill="none" stroke="#000" stroke-miterlimit="10" d="M 135 55 L 135 80 M 135 60 L 120 60 M 135 60 L 150 60 M 135 80 L 120 100 M 135 80 L 150 100" pointer-events="none"/><path fill="none" stroke="#000" stroke-miterlimit="10" d="M 295.03 126.37 L 295.03 175.03 L 220 175.03 L 220 223.63" pointer-events="none"/><path fill="#000" stroke="#000" stroke-miterlimit="10" d="M 295.03 121.12 L 298.53 128.12 L 295.03 126.37 L 291.53 128.12 Z" pointer-events="none"/><path fill="#000" stroke="#000" stroke-miterlimit="10" d="M 220 228.88 L 216.5 221.88 L 220 223.63 L 223.5 221.88 Z" pointer-events="none"/><path fill="none" stroke="#000" stroke-miterlimit="10" d="M 300 290 L 280 290 L 300 290 L 286.37 290" pointer-events="none"/><path fill="#000" stroke="#000" stroke-miterlimit="10" d="M 281.12 290 L 288.12 286.5 L 286.37 290 L 288.12 293.5 Z" pointer-events="none"/><path fill="none" stroke="#000" stroke-miterlimit="10" d="M 360 326.37 L 360 415.03 L 296.37 415" pointer-events="none"/><path fill="#000" stroke="#000" stroke-miterlimit="10" d="M 360 321.12 L 363.5 328.12 L 360 326.37 L 356.5 328.12 Z" pointer-events="none"/><path fill="#000" stroke="#000" stroke-miterlimit="10" d="M 291.12 415 L 298.12 411.5 L 296.37 415 L 298.12 418.5 Z" pointer-events="none"/><rect width="120" height="60" x="300" y="260" fill="#fff2cc" stroke="#d6b656" pointer-events="none" rx="9" ry="9"/><g transform="translate(-0.5 -0.5)scale(0.9999999999999999)"><switch><foreignObject width="101%" height="101%" pointer-events="none" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow:visible;text-align:left"><div xmlns="http://www.w3.org/1999/xhtml" style="display:flex;align-items:unsafe center;justify-content:unsafe center;width:118px;height:1px;padding-top:290px;margin-left:301px"><div data-drawio-colors="color: rgb(0, 0, 0);" style="box-sizing:border-box;font-size:0;text-align:center"><div style="display:inline-block;font-size:12px;font-family:Helvetica;color:#000;line-height:1.2;pointer-events:none;white-space:normal;overflow-wrap:normal">Task Processor</div></div></div></foreignObject><text x="360" y="294" fill="#000" font-family="Helvetica" font-size="12" text-anchor="middle">Task Processor</text></switch></g></g><switch><a target="_blank" transform="translate(0,-5)" xlink:href="https://www.drawio.com/doc/faq/svg-export-text-problems"><text x="50%" y="100%" font-size="10" text-anchor="middle">Text is not SVG - cannot display</text></a></switch></svg>

@iPurpl3x
Copy link

I'm also experiencing this with draw.io SVGs. As I want to keep editing them, I won't be able to run them through svgo...

@Danielku15
Copy link

Same problem here: We're exporting SVGs from Draw.io and put it to our Docusaurus Docs. Rewriting them and optimizing them in the pipeline is quite an effort.

For a short term fix the SVG validation might be simply to check for .includes('<svg ').

The lib currently seems to do following:

  1. Try to find a filetype using the validate methods of all registered types.
  2. If found try to parse it fully and return the size via calculate on the detector.
  3. If not found raise an error.

What if it would do following:

  1. Loop all formats and do a tryCalculate() returning null/false.
  2. Return the data for the first format which matches.
  3. If none matches rais an error.

The benefits of this approach are:

  • The formats where we have magic numbers can keep validating reliably at the start of tryCalculate.
  • SVG could check first for <svg and if that's the case proceed with full parsing. It can still fail in this path in case matching was not successful and other formats might succeed.

@damageboy
Copy link

Experiencing the same issue with docusaurus, draw.io exported .svgs and image-size...

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants