Safari export fails with images

[TorsteinHonsi]

Reproduction steps

1. Open Safari on the Mac
2. Go to http://jsfiddle.net/highcharts/n1h9rfc5/
3. From the menu, click Download as PNG.

The reason for the failure is that Safari adds an inferred namespace tag, NS1 in front of the image's href attribute. Thereby our exporting clean-up fails on this line:

.replace(/ href=/g, ' xlink:href=')

Workaround

I'm not sure if this is a generic fix across all cases and browsers, but filtering out the NS1 prefix is possible like this: http://jsfiddle.net/highcharts/n1h9rfc5/1/ .

[saifelse]

The workaround suggest is pretty hacky, especially since the more href's you have, a new prefix is generated, i.e. NS1, NS2, NS3, etc. I believe this is resulting from serializing an SVG as if it were HTML. When an SVG is serialized as HTML, it can lose its namespaces... and it looks like newer versions of Safari will generate an arbitrary namespace.

See Parsing and Serializing Nodes:

An XML serialization differs from an HTML serialization in the following ways:

Elements and attributes will always be serialized such that their namespaceURI is preserved. In some cases this means that an existing prefix, prefix declaration attribute or default namespace declaration attribute might be dropped, substituted or changed. An HTML serialization does not attempt to preserve the namespaceURI.
...

With XMLSerializer, doing new XMLSerializer().serializeToString(svg) instead of container.innerHTML seems like it should do the trick.

[TorsteinHonsi]

@saifelse It that works it is awesome, it would probably make many of our regex replacements while postprocessing the innerHTML obsolete as well.

Unfortunately the NS1 namespace is still present: http://jsfiddle.net/n1h9rfc5/3/

Any idea?