JSX formatting issue - Spaces are removed in some cases
I found an issue with the code formatter and JSX.
This is the state before formatting.
import React from 'react';
class Sample extends React.Component {
render() {
return (
<div>
<p>adsfasdfa adsf asdfa dsf asdf asdf asdf asdf asdfa sdfasd fasd asdf asdf asdf asdf adsf asdf adsf <span>Meh Space!</span></p>
</div>
);
}
}
export default Sample;
And this is the state after formatting.
import React from 'react';
class Sample extends React.Component {
render() {
return (
<div>
<p>adsfasdfa adsf asdfa dsf asdf asdf asdf asdf asdfa sdfasd fasd asdf asdf asdf asdf adsf asdf adsf
<span>Meh Space!</span></p>
</div>
);
}
}
export default Sample;
Since the span moved to a new line the space between the words is removed. The formatter should do this instead to keep the space.
import React from 'react';
class Sample extends React.Component {
render() {
return (
<div>
<p>adsfasdfa adsf asdfa dsf asdf asdf asdf asdf asdfa sdfasd fasd asdf asdf asdf asdf adsf asdf
adsf <span>Meh Space!</span></p>
</div>
);
}
}
export default Sample;
Please sign in to leave a comment.
You can add `p` to Keep whitespaces inside list in Settings | Editor | Code Style | HTML | Other - it's content won't be touched by formatter then