vscode-liquid icon indicating copy to clipboard operation
vscode-liquid copied to clipboard

Liquid formatting issues

Open t3pfaffe opened this issue 1 year ago • 1 comments

Listing all the issues I currently have with the liquid auto formatter in the recent update. I can break it down into smaller issues when I get more time in the future if desired.

I have a format that I use for my liquid comment documentation. Upon saving with 'format on save' enabled the closing {% endcomment %} tag gets merged onto the last line inside the comment block and any indents inside the comment block get overwritten and removed as well. Is there any way to have the formatter ignore any of the text inside comments? It is fairly annoying and ruins the established documentation formatting I have across my codebase. Example below:

{% comment %}
Info/Nav Header Section:
- Primary header section with info/quicklinks bar and
   navigation bar.

@author t3pfaffe
{% endcomment %}

gets formatted to:

{% comment %}
  Info/Nav Header Section:
  - Primary header section with info/quicklinks bar and
  navigation bar.

  @author t3pfaffe{% endcomment %}

In addition <script> tags seem to get erroneously moved onto the same line as any liquid tag above it. Example below:

{% endstyle %}

<script>

gets formatted to:

{% endstyle %}<script>

Also any indents of CSS in {% style %} or {% stylesheet%} tags gets removed even for those nested in @media blocks.


Additional side note not pertaining to the formatter: is there any way to get the {% schema %} tags to allow folding by JSON objects? Its very annoying to work with all these large blocks that I cant hide away to avoid distractions. I think it makes sense for all of the large multi-line liquid tags to allow folding to begin with. Is there a setting for it I am missing?

t3pfaffe avatar Oct 05 '22 17:10 t3pfaffe

Hey @t3pfaffe

Thanks so much for this detailed issue. It helps a lot. So these issues are going to be addressed in Prettify as per the groundwork from @MaxDesignFR

  • https://github.com/panoply/prettify/issues/31

Also any indents of CSS in {% style %} or {% stylesheet%} tags gets removed even for those nested in media blocks.

This was a critical defect that applied to all CSS beautification capabilities. It will no longer be the case in the 3.1.0 as it was addressed in:

Additional side note not pertaining to the formatter: is there any way to get the {% schema %} tags to allow folding by JSON objects?

Yeah, you can leverage the vscode setting editor.foldingStrategy and set it to indentation I will make this a default in v3.1.0 when working with the Liquid Language. In you workspace settings:

{
    "editor.foldingStrategy": "indentation"
}

For future reference, definitely upstream the beautification issues to Prettify because it is easier for me to address them in that project. I really appreciate you taking the time to submit a well formed issue here. Big thanks, it is such a great help.

panoply avatar Oct 06 '22 09:10 panoply

Should be resolved in https://github.com/panoply/vscode-liquid/pull/110 (Latest version)

panoply avatar Oct 25 '22 04:10 panoply