HTML characters are parsed (why?)

[username99987]

Hi there,

Is it possible that react compiler turns html characters (like <) inside a React code into literal characters, when compiled, causing problems when opened in a browser.
Is there a way to fix it?

[syranide]

That should definitely not be happening, but it seems like you're asking a question rather than having an actual issue. Quick testing on my side shows no issues, if you're having an issue it would be great if you could provide some code that reproduces the error.

[username99987]

Well, I am using gulp-react that uses react-tools.
For example, I have this in .jsx

var Card = React.createClass({
    render: function() {
        return (
            <div className="star">
                &#9733;
            </div>
        );
    }
});

As the result of transformation I get this

var Card = React.createClass({displayName: 'Card',
    render: function() {
        return (
            React.DOM.div( {className:"star"}, 
                " ★ "
            )
        );
    }
});

[syranide]

Ah yes, React does not actually render it as straight HTML, so you cannot have HTML-entities in the strings. Is this an issue for you somehow or are you just curious?

[username99987]

Yes, the issue was that my browser somehow set the encoding to 'ISO'.
I believe forcing the encoding with <meta charset="utf8"../> will solve the issue.
Thanks!

[syranide]

@onion-soup Ah, it's also worth knowing that you can do <script charset="utf-8">, if you're unable to use utf-8 as document charset.

PS. Correct is <meta charset="utf-8">, also unless you're using XHTML you should (technically) not be using the self-closing slash.