in HTML format, embedded SVG gets modified

[cderv]

Here are two svg plot produced (with a SVG graphic device in R)

Let's use those .svg files in a .md document to convert to HTML with embed-resources

> pandoc -t html -f markdown -s -o test.html --embed-resources
---
title: Test
---

# Plot 1

![](https://user-images.githubusercontent.com/6791940/284527411-15509b05-33ca-4341-ac98-82311741df88.svg)

# Plot 2

![](https://user-images.githubusercontent.com/6791940/284527415-a93c5319-073f-4ab9-bb76-79c2931bc515.svg)

This is the html produced:

See how the second plot has

• Wrong Y axis numbers
• Wrong X axis label

Without `--embed-resources` we get correct plots

So it seems something in the embedding process modifies the SVG...

With Pandoc 3.1.5, the old way to embed SVG was used (src data uri for img) and the issue does not happen. It happens since Pandoc 3.1.6, since #8948

Also, if only the second SVG is file provided, then it is not modified.

Details

> pandoc -t html -f markdown -s -o test.html --embed-resources
---
title: Test
---

# Plot 2

![](https://user-images.githubusercontent.com/6791940/284527415-a93c5319-073f-4ab9-bb76-79c2931bc515.svg)

Pandoc version?

Pandoc 3.1.9 on Windows

This comes from

• svg device + embed-resources: true not working as expected quarto-dev/quarto-cli#7584 (comment)

[jgm]

Currently we're using tagsoup to parse, adjust, and rerender the SVG. That seems to create problems, e.g. tagsoup will generate a bare attribute d instead of d="", leading to an invalid SVG. It would be better to switch to using an XML parser/renderer for this part of the code. [EDIT:] But this might be hard since this part of the code is operating on a tagsoup Tag stream.

[jgm]

This is extremely weird.
Pandoc isn't modifying anything significant in these SVGs.
But if you produce the HTML file, then manually delete the first svg (plot 1), then the second one renders fine. Somehow the two SVGs are interfering with each other.

[jgm]

I think the problem is that the two SVGs contain elements with duplicate IDs, e.g.

<symbol overflow="visible" id="glyph0-0">

Manually making the ids unique fixes the problem.
We will need to do something to ensure unique ids.

[cderv]

Thanks a lot for investigating this @jgm !