<p dir="auto">Opening <a href="6to5.org/repl/#?experimental=true&amp;playground=true&amp;evaluate=true&amp;loose=false&amp;code=let%20foo%20%3D%20Symbol%28%27foo%27%29%3B%0Aconsole.log%28String%28foo%29%3D%3D%3D%27Symbol%28foo%29%27%29%3B%0Atry%20%7B%0A%20%20console.log%28foo%20%2B%20%22%22%29%3B%0A%7D%20catch%20%28e%29%20%7B%7D%0Atry%20%7B%0A%20%20console.log%28foo%20%2B%200%29%3B%0A%7D%20catch%20%28e%29%20%7B%7D">this link</a> in Firefox only produces <code class="notranslate">let foo</code> in the left pane.</p>
<p dir="auto">I have a reproducible case where whitspace isn't preserved correctly:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="var Foo = React.createClass({
  render() {
    return (
      &lt;span&gt;foo&lt;/span&gt;
    );
  }
});

var Bar = React.createClass({
  render() {
    return (
      &lt;div&gt;
        &lt;Foo/&gt; bar
      &lt;/div&gt;
    );
  }
});"><pre class="notranslate"><code class="notranslate">var Foo = React.createClass({
  render() {
    return (
      &lt;span&gt;foo&lt;/span&gt;
    );
  }
});

var Bar = React.createClass({
  render() {
    return (
      &lt;div&gt;
        &lt;Foo/&gt; bar
      &lt;/div&gt;
    );
  }
});
</code></pre></div>
<p dir="auto">When we render <code class="notranslate">&lt;Bar/&gt;</code> the text <code class="notranslate">foobar</code> is rendered in browser without a space character between <code class="notranslate">foo</code> and <code class="notranslate">bar</code>.</p>
<p dir="auto">React's jsx tranformer outputs something like <code class="notranslate">&lt;span&gt; bar&lt;/span&gt;</code> while 6to5 outputs <code class="notranslate">&lt;span&gt;bar&lt;/span&gt;</code>.</p>