Improper SVG result

[Rastopapola]

I just stumbled over a bug, which seems to occur recently (> 7.3.1)

The resulting svg contains <svg:rect> instead of <rect> elements, which are not interpreted properly by browsers. I tried to follow the code snippets provided on the documentation of 7.4.2, since I thought maybe my usage of the package is not suitable with recent versions, but it resulted in improper SVGs as well.

For versions > 7.3.1 I found a workaround, which is not very smart but works:

...
xyz = svg_img.to_string(encoding='unicode')
xyz = xyz.replace("svg:rect", "rect")  # just replace svg:rect with rect
...

The result can be interpreted by browsers properly. Resulting SVGs can be checked on validity using this nice tool: https://svg.enshrined.co.uk/

[dkirkham]

Same issue with me... I'm now having to lock qrcode<7.4 in my project as I'm inlining the SVG. Hoping for a fix that doesn't require manipulation of the SVG string.

[pbriet]

Same issue with me.

[Rastopapola]

Finally had some free time to dig into this again:

• https://developer.mozilla.org/en-US/docs/Web/SVG/Namespaces_Crash_Course#sect1

  • XML namespaces are not valid in HTML

  • Therefore svg:rect is not validated successfully by browsers, whilst the image files themselve (img.save('/path/to/file.svg')) are valid indeed
• ElementTree adds spurious ns0: namespace prefix python/cpython#113425

  • For example, the SVG viewer in VS Code and in the GitHub file browser get confused if an SVG file uses namespace prefixes. (This is how I stumbled upon this issue)

  • It seems namespaces in svg strings are a common headache, even in other applications
• https://github.com/lincolnloop/python-qrcode/blob/main/qrcode/image/styles/moduledrawers/svg.py
  • There has been a code refactoring in early 2022 (which went live in version 7.4, the 'problematic one') by @SmileyChris
  • https://github.com/lincolnloop/python-qrcode/blob/main/qrcode/image/styles/moduledrawers/svg.py#L55
    • The base class (which is further used by more specific ones) defines the member attribute tag_qname which (in the end) is responsible for our svg:rect problem
  • https://github.com/lincolnloop/python-qrcode/blob/main/qrcode/image/styles/moduledrawers/svg.py#L67-L97
    • As we can see, these classes inherit the one I mentioned above and use the self.tag_qname as tag names for the xml elements, resulting in our incompatible svg:rect elements

Suggestion

I tested a little bit around to find out where the root cause could be found. In the end I replaced https://github.com/lincolnloop/python-qrcode/blob/main/qrcode/image/styles/moduledrawers/svg.py#L93 with self.tag which resulted in a valid svg string and was saveable to a valid image file as well.

@SmileyChris Are there any important reasons to hold on to tag_qname or could I provide a pull request, holding the fix for this issue, as suggested?

[Emad88]

This issue is still present in version 8.0

[Rastopapola]

This issue is still present in version 8.0

I know, I hope @SmileyChris or any other active maintainer (@maribedran ?) may reply on my suggestion.