js-beautify icon indicating copy to clipboard operation
js-beautify copied to clipboard

Allow preserving end tag of self-closing element at its own line

Open TomasHubelbauer opened this issue 2 years ago • 0 comments

Description

I'd like to request an option be introduced to allow preserving a self-closing tag's /> on its own line. This is so that VS Code can re-export this setting to enable doing this in the built-in VS Code HTML formatter. See microsoft/vscode#170796

Input

The code looked like this before beautification:

<input
    placeholder="test"
    …
/>

Expected Output

The code should have looked like this after beautification:

<input
    placeholder="test"
    …
/>

Actual Output

The code actually looked like this after beautification:

<input
    placeholder="test"
    … />

Steps to Reproduce

  • Go to https://beautifier.io/
  • Switch to Beautify HTML
  • Add "wrap-attributes": "preserve" to custom options
  • Run on the above snippet

Environment

https://beautifier.io

Settings

Custom:

{
  "wrap-attributes": "preserve"
}

Initial on https://beautifier.io:

{
  "indent_size": "4",
  "indent_char": " ",
  "max_preserve_newlines": "0",
  "preserve_newlines": true,
  "keep_array_indentation": false,
  "break_chained_methods": false,
  "indent_scripts": "normal",
  "brace_style": "collapse",
  "space_before_conditional": true,
  "unescape_strings": false,
  "jslint_happy": false,
  "end_with_newline": false,
  "wrap_line_length": "0",
  "indent_inner_html": false,
  "comma_first": false,
  "e4x": false,
  "indent_empty_lines": false,
  "wrap-attributes": "preserve"
}

TomasHubelbauer avatar Jan 24 '23 18:01 TomasHubelbauer