svg-sprite / svg-sprite

SVG sprites & stacks galore — A low-level Node.js module that takes a bunch of SVG files, optimizes them and bakes them into SVG sprites of several types along with suitable stylesheet resources (e.g. CSS, Sass, LESS, Stylus, etc.)

Home Page:https://github.com/svg-sprite/svg-sprite

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

bug: 2.0.0: `shape.id.separator` does not produce an `id` with the parent directory names

artuska opened this issue · comments

In 1.5.0 shape.id.separator traversed full directory path + file name into the shape ID. Now in 2.0.0 shape ID is always a svg file name, without any parent folders.

@artuska hello!
Can you provide some examples? It'll be great if you provide a new corresponding failing test case in test/svg-sprite/shape.

Hi, the problem is related with the change in shape.js line 150:

In version 1.5.4 it was:
https://github.com/svg-sprite/svg-sprite/blob/v1.5.4/lib/svg-sprite/shape.js#L150

(It was getting the difference between the full path to the file and the path used to search files).

And now in version 2.0:

[https://github.com/svg-sprite/svg-sprite/blob/v2.0.0/lib/svg-sprite/shape.js#L151)

It's getting the name of the full path:

image

image

Before:

image

And the code in the createIdGenerator (not changed), at line 41, it's waiting a relative path (it's also explined in the variable comment).
https://github.com/svg-sprite/svg-sprite/blob/v1.5.4/lib/svg-sprite/shape.js#L33
https://github.com/svg-sprite/svg-sprite/blob/v2.0.0/lib/svg-sprite/shape.js#L33

So, it can restore the previous line, or comparing the directory full path with the directory base path used to search with path.relative:

image

And the ID generated is going to have the expected value:

image

Released in v2.0.1

why did you considere that the bug persists?

The only different between previous code and this one is related with the final directory separtor.

The previous code was keeping a final separator. Now not.
In both cases are ok when it's using path.resolve and setting the file.base.

image

I have a directory with icons
image
I use the command svg-sprite -C svg-sprite.json 'libs/ui-kit/src/lib/icons/svg-icons/./**/*.svg'
And I want to see an icon id as eva--line--info, but I get just info.

If I patch svg-sprite.js then all is working well.

P.S. I use ubuntu maybe this is the reason

In my case here https://github.com/svg-sprite/svg-sprite/blob/main/lib/svg-sprite.js#L83

file is /home/egor/projects/yourapp-uikit-web/libs/ui-kit/src/lib/icons/svg-icons/eva/line/info.svg

name is eva/line/info.svg

Sounds like e85b53c is to blame. Can someone who's having this issue try it with:

npm i github:svg-sprite/svg-sprite#2.x

I thought this was covered by the tests but maybe it slipped through.

Sounds like e85b53c is to blame. Can someone who's having this issue try it with:

npm i github:svg-sprite/svg-sprite#2.x

I thought this was covered by the tests but maybe it slipped through.

I can confirm that this version works as expected

@egorkel-altexsoft can you try one more time please? I tried with a different approach.

BTW if someone wants to submit a test case, that would make sure we don't hit this again in the future and is more than welcome.

Nope, it doesn't work
libs--ui-kit--src--lib--icons--svg-icons--eva--line--info

Alright, I'll just revert that change, thanks for testing!

No problem

when I was checking the first time this problem, I was using gulp-svg-sprite.

https://github.com/svg-sprite/svg-sprite/blob/main/lib/svg-sprite.js#L83
In the that method from gulp-svg-sprite is receiving directly a File object with this information:

image

With "base" property that contains the source folder:

image

path: with the full path, and so on.

But, now checking with the bin script file like @egorkel-altexsoft is using, I'm having the same problem.
But, this problems happens inside of the file object created here https://github.com/svg-sprite/svg-sprite/blob/main/lib/svg-sprite.js#L127

image

With my configuration:

image

In line 126 is calculating the base for a File object from the full string path, and taking the dirname. That's something completely different that is doing when we received a file object.

image

Released in v2.0.2

commented

I just wanted to add that this didn't work for me if the glob-pattern does not contain the "./" in the beginning.

Does not work:

path/to/somefolder/**/*.svg

Does work:

path/to/somefolder/./**/*.svg

Unless someone provides a patch with proper tests, I'm not sure how all these issues can be safely fixed... The code now should be what's used in 1.5.x too.

@Kreeg I think this is the only regression blocking us for v3.0.0 stable. Last time I had a look at it, I couldn't fix the issue myself so any help is welcome.

commented

Possible cause: #220 (commit).
Possible fix: #804