list of HTML inline elements incomplete; wraps inappropriately

[garretwilson]

Over at https://github.com/Glavin001/atom-beautify/ we went round and round trying to find out why atom-beautify was wrapping some elements and http://jsbeautifier.org/ was not. It turns out that your default code has an unformatted option that defaults to not formatting the "inline" elements --- but it's not made explicit what these inline elements are, so we have to dig into the code.

That's when @Glavin001 figured out that you're using these elements as the default list of inline elements:

['a', 'span', 'img', 'bdo', 'em', 'strong', 'dfn', 'code', 'samp', 'kbd',
        'var', 'cite', 'abbr', 'acronym', 'q', 'sub', 'sup', 'tt', 'i', 'b', 'big', 'small', 'u', 's', 'strike',
        'font', 'ins', 'del', 'pre', 'address', 'dt', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6']

https://github.com/beautify-web/js-beautify/blob/bc5b7b5a3310df19cfe44489f3d0731d0c9b49cf/js/lib/beautify-html.js#L120-L122

Then I realized that this list is incomplete. You don't seem to include all HTML5 inline elements, such as those at:

http://www.w3.org/TR/html5/text-level-semantics.html#text-level-semantics

The first one missing that comes to mind is <mark>. If you leave that out, then you'll wind up wrapping inside of paragraphs, or just in a single list item.

So please revisit your list of "inline" elements and make sure that all HTML5 inline elements are included. Thanks.

[garretwilson]

Here's as close an official list of inline elements as I could find:

http://www.w3.org/TR/html5/dom.html#phrasing-content

[bitwiseman]

@Glavin001 - I've pulled an updated list.