chrisathook / display-standard-previewer

GNU General Public License v3.0
6 stars 1 forks source link

Possibility of compiling SVGs with unique IDs to avoid conflicts and rendering errors #12

Closed craigthings closed 7 years ago

craigthings commented 7 years ago

In most cases, when you have two separate SVG elements, IDs inside those separate elements can't conflict with each other. However, in Safari and certain older versions of Chrome, these IDs can conflict, as if separate SVGs are all combined into the same SVG element behind the scenes.

A decent solution to fix this so it doesn't create strange issues in the future would be to run through all SVG elements found in a document and insert unique IDs, or possibly test to make sure no IDs are the same.

This is similar to the "class conflict" issue, but because it doesn't behave in the same way or have the same effect, I think it makes sense for it to have its own issue.

To explain it in more detail: if you have a "kitchen" SVG element with a path ID "sandwich", and a "restaurant" SVG element also with a path ID "sandwich", then later, even if you select $('.restaurant #sandwich') it will actually return $('.kitchen #sandwich') because it came first in the document. Very strange behavior.

chrisathook commented 7 years ago

I think a test makes the most sense. I can parse through all the svg code and inventory all the IDS. is the goal to have every single ID be unique?

chrisathook commented 7 years ago

is this only a problem if you need to address the SVG IDs for animations?