# How do I pass SVG through port?

**URL:** <https://discourse.elm-lang.org/t/how-do-i-pass-svg-through-port/8906>\
**Category:** Learn\
**Created:** [January 23, 2023, 11:06am UTC](https://discourse.elm-lang.org/t/how-do-i-pass-svg-through-port/8906 "2023-01-23T11:06:54Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![mckahz](https://avatars.discourse-cdn.com/v4/letter/m/c68b51/32.png) [@mckahz](https://discourse.elm-lang.org/u/mckahz)\
**Post date:** [January 23, 2023, 11:06am UTC](https://discourse.elm-lang.org/t/how-do-i-pass-svg-through-port/8906/1 "2023-01-23T11:06:54Z")

</div>

Hi,

I’m trying to use MathJax to convert a String (with valid TeX code) into a data structure I can attach event handlers / change the attributes of. In theory this should be easy, given that MathJax has a function `MathJax.tex2svg` which does exactly that. The only issue is that the output is in JS. The following code will render nicely formatted maths to the screen

```auto
let svg = MathJax.tex2svg(texString, { em: 12, ex: 6, display: false });
document.body.appendChild(svg);
let mathJaxStyleSheet = MathJax.svgStylesheet();
document.head.appendChild(mathJaxStyleSheet);

```

And will even work if, instead of using `svg`, I use a new div with only the `innerHTML` of said div set to the innerHTML of `svg`.

From my understanding, this should mean that sending the `innerHTML` through a port to Elm then using `SvgParser.parse` successfully should render properly no? But instead I get

![image](https://canada1.discourse-cdn.com/flex035/uploads/elm_lang/original/2X/0/011ba5bf096e23015dbb4b5e93247e8a1d861099.png)

When it should look like a well typeset 2π.

Thanks for reading- any and all criticism/advice is welcome!

You might find this page helpful-  
[https://docs.mathjax.org/en/latest/web/typeset.html#converting-a-math-string-to-other-formats](https://docs.mathjax.org/en/latest/web/typeset.html#converting-a-math-string-to-other-formats)

---

<div class="post-metadata">

**Author:** ![mckahz](https://avatars.discourse-cdn.com/v4/letter/m/c68b51/32.png) [@mckahz](https://discourse.elm-lang.org/u/mckahz)\
**Post date:** [January 24, 2023, 2:55am UTC](https://discourse.elm-lang.org/t/how-do-i-pass-svg-through-port/8906/2 "2023-01-24T02:55:25Z")

</div>

Found the issue- the output SVG text was using the deprecated `xlink:href` instead of `href`. Removing that makes it work. Confusing as to why it works at all through JS though.

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex035/uploads/elm_lang/original/1X/50a05e53677a2c3b47776d7abd0f113eb50193a1.png) [@system](https://discourse.elm-lang.org/u/system)\
**Post date:** [February 3, 2023, 2:56am UTC](https://discourse.elm-lang.org/t/how-do-i-pass-svg-through-port/8906/3 "2023-02-03T02:56:16Z")

</div>

Closed on February 3, 2023, 2:56am UTC

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.