Why ignore em/strong/span?

[zxti]

I get ignoring something like pre, but was just curious why span tags are not beautified.

[Paul-Hebert]

:+1: I'm curious about this as well. For my use case beautifying spans improves the readability of some code examples.

This is great overall though, thanks!

[jonschlinkert]

The main reason was that span and strong are both inline elements, and js-beautify seemed to produce unexpected results (often) when those elements weren't ignored.

I believe you can override the defaults by passing an unformatted array on the options.

[Paul-Hebert]

That makes sense. Thanks @jonschlinkert !

[rbottomley]

Please continue to ignore inline elements. Don't break my markup like Prettier does. Prettier will change:

text (<em>something here</em>) and stuff

to:

text (
  <em>something here</em>
) and stuff

which changes the rendered output from:

text (something here) and stuff

to:

text ( something here ) and stuff

Making the code more legible = good, altering the rendered output = bad.

[DanKaplanSES]

Please continue to ignore inline elements. Don't break my markup like Prettier does. Prettier will change:

It is possible for you to print it out the way you want, and for others to printed out the way they want.

I believe you can override the defaults by passing an unformatted array on the options.

Although you can do this, it doesn't seem to have any effect: strong and em are still on the same lines as their parents.

Relevant issue: https://github.com/beautify-web/js-beautify/issues/1900

Here is how you can achieve this:

  // eslint-disable-next-line @typescript-eslint/no-explicit-any
  return pretty($.html(), { unformatted: [], inline: [] } as any);

By the way, there are a lot of options that are undocumented and not in the types. Would it be possible to add what's missing?