beautifier / js-beautify

Beautifier for javascript
https://beautifier.io
MIT License
8.55k stars 1.37k forks source link

Dynamic selection of `inline` HTML elements #1669

Open alexreg opened 5 years ago

alexreg commented 5 years ago

It would be very useful to be able to specify a function to the options that would take an HTML node object as a parameter, and returns a boolean value to specify whether the element should be beautified (or conversely, whether it should be considered inline). Returning "undefined" would fall back to the static include/include+/include- properties in options. This feature would allow you to only inline for example ul.classA > li elements (to use CSS notation). Adding support for such CSS/jQuery notation to the existing include family of properties is an alternative solution.

cf. https://github.com/beautify-web/js-beautify/issues/1668

bitwiseman commented 5 years ago

@alexreg Thanks for filing this.
This can be done, but it will probably be difficult and error prone until after the beautifier does a much better job of parsing. The html beautifier only recently reached the point of parsing tokens before beautifying. Before that it would have been impossible to even do a ul.classA query, let alone ul.classA > li.

Allowing some query notation in the existing inline setting would be preferable IMO - that would allow us to keep the behavior well defined and keep us from having to lock down APIs that are currently internal and in-progress. Implementing some querying would be involved but would be less of a bug farm than taking a function.

alexreg commented 5 years ago

Do you use htmlparser2 internally for parsing? If so (or even if not), cheerio is a great layer over that, which gives you a jQuery-like interface to the DOM, and allows querying/checking of the form ul.classA > li very easily. :-)