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;
0
1 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

0

Please sign in to leave a comment.