975583 - SVG in div tabs dont show correct

Status: VERIFIED INVALID

(Firefox :: Untriaged, defect)

Description

[Johan]

Attachment: visitekaartje_herbalife_makeadifference_1.svg

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.9; rv:27.0) Gecko/20100101 Firefox/27.0 (Beta/Release)
Build ID: 20140212131424

Steps to reproduce:

I am designing a website with Bootstrap and in the Tabs i have stored a SVG image.
When i switch the tab the SVG from the hidden tab does not show correct.

When i set both of the tabs to active the images get loaded correct.



Actual results:

The image is not viewed correct. 


Expected results:

In IE8+, Chrome, Safari the result is ok. De SVG on the hidden tab shows correct.

Comment 1

[Robert Longson [:longsonr]]

You've multiple elements with the same id attribute e.g. id="SVGID_1_". This is invalid, all ids mut be unique within a document.

Comment 2

[Johan]

This is not a bug? So you cant load 2 documents with the same name? Why do the other browser do this ok?
And it only show when you load them in different tabs! Because when i load them both in front they load ok!

This is a Bug!

See this fiddle: http://jsfiddle.net/v5tZm/2/ that is does not work when i load them in the hidden tab
See this fiddle: http://jsfiddle.net/v5tZm/3/ that if they are both loaded on non hidden tabs they load fine!

In IE8+ Chrome Safari they load ok! Only in Firefox its not ok! Name spacing should not be of influences because its inside a different div!

Comment 3

[Robert Longson [:longsonr]]

You can't have document with conflicting id values. Sometimes some browsers will work as you want in some circumstances and sometimes they won't that's the nature of an invalid file.

Comment 4

[Robert Longson [:longsonr]]

http://www.w3.org/TR/2008/REC-xml-20081126/

Validity constraint: ID

Values of type ID MUST match the Name production. A name MUST NOT appear more than once in an XML document as a value of this type; i.e., ID values MUST uniquely identify the elements which bear them.

Comment 5

[Johan]

I know its a structure of a xml file but its graphics should be calculated ok. So if i show 5 SVG files from 5 different artists and they use 1 same ID its normal that the graphics in Firefox are corrupted?

Damn thank god there are different browsers!

Comment 6

[Johan]

Within the SVG file (XML structered file) i am not using the same identity!!!!!! So is it normal that Firefox should interpret it as such! (Other browser do this ass well) Please let someone else also give its opinion about it! The SVG file used is attached so you could see its valid!

The problem its not that its viewed multiple times because then Firefox works ok! I kan put it 10 times on a page and it will show up ok!

The problem is when i put one in a hidden Tab then it does not view ok!

Comment 7

[Johan]

Dear Robert,

I would like to ask you in all kindness to review my problem! Because it has nothing to do with my SVG (wich is valid) file but the way Firefox is displaying its graphics. So please would you consider that if i display 10 different svg files include 1 same ID its normal that the data is not displayed correct?

I know its a XML file but should in case of a SVG which its soul purpose is to hold graphical data that its displayed correct?

Please be so kind to respond because you allready closed this bug report but maybe after you thought logical about the main purpose of a SVG we could get to a understanding of one and other?

With kind regards,

Johan

Comment 8

[Robert Longson [:longsonr]]

(In reply to Johan from comment #6)
> Within the SVG file (XML structered file) i am not using the same
> identity!!!!!!

I'm afraid that's irrelevant. IDs must be unique in the document as a whole. You'd be better off referencing the SVG data via an <object> or <iframe> tag as then the SVG data would be logically separate and you wouldn't have to worry about them having conflicting IDs.

> (Other browser do this ass well) Please let someone else also give its
> opinion about it! The SVG file used is attached so you could see its valid!

The SVG file is OK but you can only include it one time in an HTML document. This time Firefox is not doing what you think it should, in other invalid documents it would be Webkit, in yet others it would be Internet Explorer.

> 
> The problem its not that its viewed multiple times because then Firefox
> works ok! I kan put it 10 times on a page and it will show up ok!
> 
> The problem is when i put one in a hidden Tab then it does not view ok!

If you do invalid things then weird things happen. It's better therefore not to do invalid things don't you think?

Comment 9

[Johan]

Dear Robert,

I think your a great expert on XML files. But i think that your stepping over the soul purpose of a SVG file and what it should do on a website. Its to display Vector Graphics correctly!

If i let 10 designers make me a artwork with illustrator or inkscape and want to display them on tabs i am going to have a lot of troubles with firefox! This is to bad!

For now i will include a warning on my site not to use Firefox because i am not in control of the designers who design these artworks!

Thanks for your input not that it helps the end users of my website but who said that firefox was made for end users.

With kind regards,

Johan

Comment 10

[Robert Longson [:longsonr]]

As I said other invalid files will cause Safari to go wrong, yet others will make IE go wrong. You're basing your decision on this one file which causes a problem in Firefox. Eventually you'll find other issues in other browsers with different invalid files and in the end you'll have to put a warning on your site that no browser works properly.

Use an <object> or <iframe> tag and all your problems will go away and it will work with all browsers. What's wrong with that advice?

Comment 11

[Johan]

Dear Robert,

Nothing is wrong with that advice but its not suitable for my website because i need direct access to these files. And its not only this file that goes wrong in Firefox. I can send you more but this wont help my case.

The problem of this is that designers do not name there objects so the case that id are the same is a chance from 1:2 because they just make a export from illustrator or inkscape (And then its auto named).

Strangely the only browser that has a problem with this is Firefox. 

But for now i would like to call it: Tomato or Tamato? Potato or Patato? Bug or no Bug?
For me its IE PNG Fix all over again. So yes not all browsers are perfect but for me Firefox was until today :)

For now i will write a script that will change all ids as a file is loaded so Firefox wont have a problem with it!

With kind regards,

Johan