"Viewer does not support full SVG 1.1" added to image during optimization

[michaeljmcd]

Describe the bug
When I run an SVG 1.1 document through svgo (version 2.2.1 installed via yarn global), I get the text "Viewer does not support full SVG 1.1" added to the bottom of the image. I don't see anything else wrong with the image. Checking the output SVG source shows that the text is added by svgo, not the viewer.

To Reproduce
Steps to reproduce the behavior:

1. Use diagrams.net / draw.io to create a simple diagram.
2. Export the image to SVG with default settings.
3. Run svgo my.svg -o my2.svg
4. View the resulting image.

Expected behavior

Assuming that the warning is legitimate, I would expect it to either appear on stdout or else to fail processing and be on stderr. Showing up silently on the output image was unexpected.

Screenshots

Desktop (please complete the following information):

• SVGO Version - 2.2.1
• NodeJs Version - 15.10.0
• OS: MacOS Catalina 10.15.7

[TrySound]

Hi, could you please submit svg file here?

[TrySound]

Alright, I see the problem

[michaeljmcd]

Good deal - do you still need that SVG file?

[TrySound]

You can submit one in case service will be unavailable

[vincentbernat]

If useful, here is SVG with the problem: https://raw.githubusercontent.com/vincentbernat/vincent.bernat.ch/fcdf778c74bd9717552e323abaef2a73982c5d8a/content/media/images/rsync-remote-remote.svg

[acalvo]

For anyone else hitting this problem:

draw.io graphs are generated with this piece of code:

<switch>
  <g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/>
  <a transform="translate(0,-5)" xlink:href="[https://www.diagrams.net/doc/faq/svg-export-text-problems](view-source:https://www.diagrams.net/doc/faq/svg-export-text-problems)" target="_blank">
    <text text-anchor="middle" font-size="10px" x="50%" y="100%">Viewer does not support full SVG 1.1</text>
  </a>
</switch>

And SVGO's removeEmptyContainers plugin strips out the g tag, making the message appear unconditionally.

The workaround, until that plugin deals with this case, is to disable it through config. I.e.:

module.exports = {
    plugins: [
      {
        name: 'preset-default',
        params: {
          overrides: {
            removeEmptyContainers: false,
          },
        },
      },
    ],
  };

[vincentbernat]

This seems easy to fix: check if parentNode tag is switch and don't remove the container if it is.

[SethFalco]

This seems easy to fix: check if parentNode tag is switch and don't remove the container if it is.

Thanks for investigating this and opening a PR. I'll review it soon and get it merged.
Just writing a note for how to approach this.

I was checking if we should really skip if the parent is a <switch>, or if instead we should only skip if any of the requiredFeatures, requiredExtensions, or systemLanguage attributes are present.

Indeed, I think the best solution is to check if the parent is a <switch> though, as it is valid for a <switch> to contain an empty <g/> with no attributes, which will render nothing. Removing that would affect the rendering of the SVG.

It could also be worth updating Remove Hidden Elements to delete the <switch> entirely if the first node doesn't contain a conditional attribute and is a non-rendering element. I'll look into this separately, though.