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

Import doesn't work completely #43

Open
dhardtke opened this issue Jun 4, 2015 · 3 comments
Open

Import doesn't work completely #43

dhardtke opened this issue Jun 4, 2015 · 3 comments

Comments

@dhardtke
Copy link

dhardtke commented Jun 4, 2015

Hey,

apparently some commit broke the import of the following SVG string:

<svg xmlns="http://www.w3.org/2000/svg" width="500" height="100" viewBox="0 0 500 100"><defs><linearGradient id="s4a" x1=".5" x2=".5" y2="1"><stop offset=".307"/><stop offset=".916" stop-color="#990b0b"/></linearGradient></defs><ellipse rx="249" ry="49" cx="250" cy="50" stroke="#000" fill="url(#s4a)" data-angle="180"/><rect width="109" height="51" stroke="#000" rx="0" ry="0" x="43" y="20"/></svg>

The rect doesn't appear with the latest version, but with the one on the Amazon CDN it works:
https://s3-eu-west-1.amazonaws.com/svgjs/svg.import.js

Have a look at this diff:
https://www.diffchecker.com/ojcpdhyf

After further investigation I found out that if I swap

well.innerHTML = raw
        .replace(/\n/, '')
        .replace(/<([^\s]+)([^<]+?)\/>/g, '<$1$2></$1>')

with

well.innerHTML = raw
        .replace(/\n/, '')
        .replace(/<(\w+)([^<]+?)\/>/g, '<$1$2></$1>')

everything works as expected.. mmh..

This commit introduced that change: db0156c

What are elements with namespaces? Can't find anything about them in the docs

@EternityForest
Copy link

That's a great bug writeup! I think I was able to find the problem.

Using the regex101.com tool, I was able to find that the broken version of the regex will match this entire substring:

</linearGradient></defs><ellipse rx="249" ry="49" cx="250" cy="50" stroke="#000" fill="url(#s4a)" data-angle="180"/>

The reason being the new one will match any non whitespace char, and there is no whitespace until the ellipse tag, which has a slash at the end, completing the pattern.

If the point really is to allow XML namespaces and other symbols with special meaning in SVG, maybe you could specify them explicitly as [\w-.:] or some such?

@dhardtke
Copy link
Author

dhardtke commented Sep 1, 2016

For me it does not matter anymore since I've switched to SVG.js version 2, where you don't need an export or import plugin anymore - it comes "out of the box".

@Fuzzyma
Copy link
Member

Fuzzyma commented Sep 1, 2016

Iam sorry that you used so much effort to find that bug. The svg.import.js plugin is obsolete because its feature was introduced in the core since svg.js v2

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

3 participants