Titles in SVG inserted by a theme component get overwritten with page title after tab switch

I think I’ve found a bug in Discourse, but it’s a little hard to show a reproduction because it’s triggered by a theme component which is not officially deployed in any theme yet.

The theme component inserts an SVG which works just fine, but after switching browser tabs or minimizing the browser, all titles in the SVG have been overwritten with the page title.

SVG before tab switch:

<svg width="62pt" height="250.66666666666666" viewBox="0.00 0.00 62 188" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="graph0" class="graph" transform="translate(4,112) scale(1)">
<polygon fill="white" stroke="transparent" points="-4,4 -4,-112 58,-112 58,4 -4,4"></polygon>
<!-- a -->
<g id="node1" class="node">
<title>a</title>
<ellipse fill="none" stroke="black" cx="27" cy="-90" rx="27" ry="18"></ellipse>
<text text-anchor="middle" x="27" y="-85.8" font-family="Times,serif" font-size="14.00">a</text>
</g>
<!-- b -->
<g id="node2" class="node">
<title>b</title>
<ellipse fill="none" stroke="black" cx="27" cy="-18" rx="27" ry="18"></ellipse>
<text text-anchor="middle" x="27" y="-13.8" font-family="Times,serif" font-size="14.00">b</text>
</g>
<!-- a&#45;&gt;b -->
<g id="edge1" class="edge">
<title>a-&gt;b</title>
<path fill="none" stroke="black" d="M27,-71.7C27,-63.98 27,-54.71 27,-46.11"></path>
<polygon fill="black" stroke="black" points="30.5,-46.1 27,-36.1 23.5,-46.1 30.5,-46.1"></polygon>
</g>
</g>
</svg>

SVG after tab switch:

<svg width="62pt" height="250.66666666666666" viewBox="0.00 0.00 62 188" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="graph0" class="graph" transform="translate(4,112) scale(1)">
<polygon fill="white" stroke="transparent" points="-4,4 -4,-112 58,-112 58,4 -4,4"></polygon>
<!-- a -->
<g id="node1" class="node">
<title>First test of the Mange theme - Discourse Development - Graphviz</title>
<ellipse fill="none" stroke="black" cx="27" cy="-90" rx="27" ry="18"></ellipse>
<text text-anchor="middle" x="27" y="-85.8" font-family="Times,serif" font-size="14.00">a</text>
</g>
<!-- b -->
<g id="node2" class="node">
<title>First test of the Mange theme - Discourse Development - Graphviz</title>
<ellipse fill="none" stroke="black" cx="27" cy="-18" rx="27" ry="18"></ellipse>
<text text-anchor="middle" x="27" y="-13.8" font-family="Times,serif" font-size="14.00">b</text>
</g>
<!-- a&#45;&gt;b -->
<g id="edge1" class="edge">
<title>First test of the Mange theme - Discourse Development - Graphviz</title>
<path fill="none" stroke="black" d="M27,-71.7C27,-63.98 27,-54.71 27,-46.11"></path>
<polygon fill="black" stroke="black" points="30.5,-46.1 27,-36.1 23.5,-46.1 30.5,-46.1"></polygon>
</g>
</g>
</svg>

I’d be happy to reproduce the bug on https://try.discourse.org/ or somewhere else if I someone can tell me how I can get the theme component installed or insert the SVG directly to see if that also triggers the bug.

3 Likes

Thanks Magnus, This should be fixed now via https://github.com/discourse/discourse/commit/5a3350cd768f54bf81ab23c70f4d74e588610e66

8 Likes

Thank you so much @pmusaraj. That was super fast :smile:.

I’m on a hosted plan. How/when can I get access to the new version?

It’s working fine on my instance now. :heart:

I would like to mark your post as the solution, but it doesn’t seem possible. Are you not using the Solved plugin?

1 Like

We do use solved here, but not for the bug category.

2 Likes

This topic was automatically closed after 3 days. New replies are no longer allowed.