Js-beautify: The result of "Format document" is weird of certain HTML content.

Created on 3 Aug 2017 · 3Comments · Source: beautify-web/js-beautify

_From @slayerxj on July 28, 2017 7:28_
_Originally reported against VSCode (which uses jsbeautifier as formatter for HTML): Microsoft/vscode#31628_

Steps to Reproduce:

paste the following example to the http://jsbeautifier.org/ playground:

<!DOCTYPE html>
<html>

<head></head>

<body>
    <div>
        <div>
            <p>Reconstruct the schematic editor the EDA system <a href="http://www.jedat.co.jp/eng/products.html"><i>AlphaSX</i></a> series</p>
        </div>
    </div>
</body>

</html>

set 'Wrap lines near 120 characters'
format
the result is

...<p>EDA system <a href="http://www.jedat.co.jp"><i>Alpha-SX</i></a>                series</p>

Notice the unnecessary spaces added before 'series'

html bug

Source

aeschli

👍3

All 3 comments

@aeschli -
Excellent bug report.
With the repro steps you provided, I can reproduce the issue.

I see your original comment said you have "editor.wordWrap": "off". But then your repro steps talk mention setting wrap to 120. To have wordWrap turned off you'd set the wrap value to 0. Then this problem does not occur.

bitwiseman on 3 Aug 2017

@bitwiseman Sorry for the confusion. Ignore the "editor.wordWrap": "off" comment. That's a VSCode setting and is not related to html formatting. I'll update the description...

aeschli on 4 Aug 2017

👍1

I am seeing the same thing in VSCode 1.16.1, particularly after inline a and code tags.

I am using " " instead of spaces to prevent the unwanted white space appearing (the unwanted white space can cause problems in output).