djLint
djLint copied to clipboard
Release 2.0.0 ⚠️ Help Needed! ⚠️
Feature Request
From #167
Using similar logic to linter rule H025 we can indent the templates using blocks instead of going linearly through the code line by line.
This will also match the settings using the compressor.
This will also allow us to use {% blocktrans trimmed %}
tags, and format them.
It will also fix poor formatting like this:
{% if %}
<div>
{% endif %}
{% if %}
</div>
{% endif %}
This is started on branch https://github.com/Riverside-Healthcare/djLint/tree/beast_mode. Basically it will used modified version of pythons html module that is expanded to handle template tags.
If you are familiar with python your help would be welcome! Please reach out if you'd like to build on this branch!
Hi, what is the status of this ? I thought about some feature requests but i think your big refactoring is probably the highest priority so maybe i could find some time to assist about Python things or to tests. I tried to join the discord to talk about it but it does not work so i'm coming here.
Lastly i created a tool to lint/fix class attribute value that i run just after djLint. I've used the Django template lexer to parse templates without template tag (i'm isolating them out and restore them after the lint, it's a little bit tricky) since they can contain quotes that could break my regex. Although it works pretty well, i assume this could not be efficient as your parser when parsing the whole template and not just attributes.
Thanks, just sent you an email.
Update
I'm making pretty decent progress on the next major version of djLint. Some tests are stating to pass well. I will push updates in a few days. Thanks to @sveetch and others who have helped along the way so far. The formatting method of djlint is completly changing. Below there is a mini diagram showing a basic overview of how formatting is done.
Inspiration for the new method comes from a few places.
- parser (python package
html-template-parser
andparser.py
) > python 3 htmllib - tree (
builder.py
) > older version of python bs4 html tree builder - formatting instructions (
tag.py
) > prettier's html printer - file writer (
writer.py
) > bs4's printer and prettier's writer
Thanks to them for thinking through most of this for us :)
There are a few main differences between djLint's new formatting and traditional formatters.
- djLint will not "autofix" missing html tags.
- nested quotes in attribute values will not be escaped.
Planned changes
- [ ] Support C# Razor Pages
- [ ] Support more handlebars syntax
- [ ] Fast (closes #104). currently takes almost 50% less time to format a file.
- [ ] Support formatting of nunjuck SET w/ loose dict style values (closes #370, closes #287)
- [ ] Support nested if (or other template stuff) statements in html attributes (closes #443)
- [ ] Changes attribute indentation to use tabbed indent similiar to prettiers syntax. Sad to switch but easier in the long run. (closes #335)
- [ ] Preserve intended and unintended spaces around html tags and template tags. HTML tags will now auto wrap to keep "no space" as well. (closes #165, closes #182)
- [ ] Fixes extra space inside of template syntax... multi spaces consolidated. (closes #262, closes #287)
- [ ] Fix quotes inside attributes. Nested quotes will never be escaped like other formaters, but here we assume the dev knows what they are doing and we will alternate quotes between double and single as nesting gets deeper. This is for supporting alpinejs and other js tools. (closes #262)
- [ ] Adding an option to disable auto closing void tags. default will close them. (Closes #252)
Old Formatting Method:
Used the regex
package for all formatting.
graph TD;
id1(Whitespace is removed where appropriate)-->id2(Whitespace is added where appropriate)
id2(Whitespace is added where appropriate)-->id3(Short lines consolidated back to a single line)
id3(Short lines consolidated back to a single line)-->id4(Lines are indented where appropriate);
id4(Lines are indented where appropriate)-->id5(Attributes are formatted);
New Formatting Method:
Uses tokens.
graph TD;
id1(html parsed into elements `parser.py`)-->id2(elements built into a tree `builder.py`)
id2-->id3(elements in tree are built into a nested list with formatting instructions `tag.py`)
id3-->id4(new list is written back to file `writer.py`)
How Can You Help
The top priority is to pass the html formatting tests. Once those are in place the template syntax can be fairly easily added.
- checkout the
beast_mode
branchgit checkout beast_mode
- install
poetry install
- run the html tests and find one that fails
poetry run pytest tests/test_html/
- try to fix it! Make sure the other tests don't break ;)
To make development easier, you can create a file called badtest.html
in the /test directory. This file will be excluded from git. Add the failing html into that file and then you can cd into the src directory and run djlint with poetry run python -m djlint ../tests/badtest.html --check
- we will alternate quotes between double and single as nesting gets deeper.
Will it be possible for the current code to determine whether the top level is single or double quotes? In HTML, I use double-quotes on the top level and single quotes inside. Currently djLint turns the single quotes to double, which VSCode doesn't like:
Then with JS, I use single quotes. If I had to pick one over the other for all files, I'd choose single quotes for the top level. But it would be amazing if it could be made flexible given the file in question!
I wish I could help! I'll check out the docs but doubt I'll be much use.
@dannypernik thanks, can you open a new issue for this? We can probably swap them to single quotes. We use the json5 lib for that.
@dannypernik thanks, can you open a new issue for this? We can probably swap them to single quotes. We use the json5 lib for that.
Done. Thank you!