djlint 1.28.0 → 1.30.0

package/tests/test_html/test_css.py

@@ -0,0 +1,193 @@
+"""Test css.
+
+poetry run pytest tests/test_html/test_css.py
+"""
+import pytest
+
+from src.djlint.reformat import formatter
+from tests.conftest import printer
+
+test_data = [
+    pytest.param(
+        ("<style></style>\n"),
+        ("<style></style>\n"),
+        id="empty",
+    ),
+    pytest.param(
+        (
+            '<style type="text/less">\n'
+            "  @nice-blue: #5B83AD;\n"
+            "  @light-blue: @nice-blue + #111;\n"
+            "  #header {\n"
+            "    color: @light-blue;\n"
+            "  }\n"
+            "</style>\n"
+            '<style lang="less">\n'
+            "  @nice-blue: #5B83AD;\n"
+            "  @light-blue: @nice-blue + #111;\n"
+            "  #header {\n"
+            "    color: @light-blue;\n"
+            "  }\n"
+            "</style>\n"
+        ),
+        (
+            '<style type="text/less">\n'
+            "  @nice-blue: #5B83AD;\n"
+            "  @light-blue: @nice-blue + #111;\n"
+            "  #header {\n"
+            "    color: @light-blue;\n"
+            "  }\n"
+            "</style>\n"
+            '<style lang="less">\n'
+            "  @nice-blue: #5B83AD;\n"
+            "  @light-blue: @nice-blue + #111;\n"
+            "  #header {\n"
+            "    color: @light-blue;\n"
+            "  }\n"
+            "</style>\n"
+        ),
+        id="less",
+    ),
+    pytest.param(
+        (
+            '<style type="text/css">\n'
+            "  body { background: navy; color: yellow; }\n"
+            "</style>\n"
+            '<style lang="postcss">\n'
+            "  body { background: navy; color: yellow; }\n"
+            "</style>\n"
+        ),
+        (
+            '<style type="text/css">body { background: navy; color: yellow; }</style>\n'
+            '<style lang="postcss">body { background: navy; color: yellow; }</style>\n'
+        ),
+        id="postcss",
+    ),
+    pytest.param(
+        (
+            '<style type="text/x-scss">\n'
+            "  $font-stack:    Helvetica, sans-serif;\n"
+            "  $primary-color: #333;\n"
+            "  body {\n"
+            "    font: 100% $font-stack;\n"
+            "    color: $primary-color;\n"
+            "  }\n"
+            "</style>\n"
+            '<style lang="scss">\n'
+            "  $font-stack:    Helvetica, sans-serif;\n"
+            "  $primary-color: #333;\n"
+            "  body {\n"
+            "    font: 100% $font-stack;\n"
+            "    color: $primary-color;\n"
+            "  }\n"
+            "</style>\n"
+            '<style lang="scss">\n'
+            ".someElement {\n"
+            "    @include bp-medium {\n"
+            "      display: flex;\n"
+            "    }\n"
+            "\n"
+            "    @include bp-large {\n"
+            "      margin-top: 10px;\n"
+            "      margin-bottom: 10px;\n"
+            "    }\n"
+            "}\n"
+            "</style>\n"
+        ),
+        (
+            '<style type="text/x-scss">\n'
+            "  $font-stack:    Helvetica, sans-serif;\n"
+            "  $primary-color: #333;\n"
+            "  body {\n"
+            "    font: 100% $font-stack;\n"
+            "    color: $primary-color;\n"
+            "  }\n"
+            "</style>\n"
+            '<style lang="scss">\n'
+            "  $font-stack:    Helvetica, sans-serif;\n"
+            "  $primary-color: #333;\n"
+            "  body {\n"
+            "    font: 100% $font-stack;\n"
+            "    color: $primary-color;\n"
+            "  }\n"
+            "</style>\n"
+            '<style lang="scss">\n'
+            ".someElement {\n"
+            "    @include bp-medium {\n"
+            "      display: flex;\n"
+            "    }\n"
+            "\n"
+            "    @include bp-large {\n"
+            "      margin-top: 10px;\n"
+            "      margin-bottom: 10px;\n"
+            "    }\n"
+            "}\n"
+            "</style>\n"
+        ),
+        id="scss",
+    ),
+    pytest.param(
+        (
+            "<!DOCTYPE html>\n"
+            "<html>\n"
+            "  <head>\n"
+            "    <title>Sample styled page</title>\n"
+            "    <style>a { color: red; }</style>\n"
+            "    <style>\n"
+            "      body { background: navy; color: yellow; }\n"
+            "    </style>\n"
+            "  </head>\n"
+            "  <body>\n"
+            "    <h1>Sample styled page</h1>\n"
+            "    <p>This page is just a demo.</p>\n"
+            "  </body>\n"
+            "</html>\n"
+        ),
+        (
+            "<!DOCTYPE html>\n"
+            "<html>\n"
+            "    <head>\n"
+            "        <title>Sample styled page</title>\n"
+            "        <style>a { color: red; }</style>\n"
+            "        <style>body { background: navy; color: yellow; }</style>\n"
+            "    </head>\n"
+            "    <body>\n"
+            "        <h1>Sample styled page</h1>\n"
+            "        <p>This page is just a demo.</p>\n"
+            "    </body>\n"
+            "</html>\n"
+        ),
+        id="simple",
+    ),
+    pytest.param(
+        (
+            "<style>a { color: red; }</style>\n"
+            "<style>\n"
+            "  h1 {\n"
+            "    font-size: 120%;\n"
+            "    font-family: Verdana, Arial, Helvetica, sans-serif;\n"
+            "    color: #333366;\n"
+            "  }\n"
+            "</style>\n"
+        ),
+        (
+            "<style>a { color: red; }</style>\n"
+            "<style>\n"
+            "  h1 {\n"
+            "    font-size: 120%;\n"
+            "    font-family: Verdana, Arial, Helvetica, sans-serif;\n"
+            "    color: #333366;\n"
+            "  }\n"
+            "</style>\n"
+        ),
+        id="single_style",
+    ),
+]
+
+
+@pytest.mark.parametrize(("source", "expected"), test_data)
+def test_base(source, expected, basic_config):
+    output = formatter(basic_config, source)
+
+    printer(expected, source, output)
+    assert expected == output

package/tests/test_html/test_doctype_declarations.py

@@ -0,0 +1,202 @@
+"""Tests for doctype.
+
+poetry run pytest tests/test_html/test_doctype_declarations.py
+"""
+import pytest
+
+from src.djlint.reformat import formatter
+from tests.conftest import printer
+
+test_data = [
+    pytest.param(
+        ("<!DocType htMl>"),
+        ("<!DOCTYPE htMl>\n"),
+        id="case",
+    ),
+    pytest.param(
+        ("<!DocType htMl  >"),
+        ("<!DOCTYPE htMl>\n"),
+        id="case_2",
+    ),
+    pytest.param(
+        (
+            '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"\n'
+            '  "http://www.w3.org/TR/html4/frameset.dtd">\n'
+            "<html>\n"
+            "  <head>\n"
+            "    <title>An HTML standard template</title>\n"
+            '    <meta charset="utf-8"  />\n'
+            "  </head>\n"
+            "  <body>\n"
+            "    <p>… Your HTML content here …</p>\n"
+            "  </body>\n"
+            "</html>\n"
+        ),
+        (
+            '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">\n'
+            "<html>\n"
+            "    <head>\n"
+            "        <title>An HTML standard template</title>\n"
+            '        <meta charset="utf-8" />\n'
+            "    </head>\n"
+            "    <body>\n"
+            "        <p>… Your HTML content here …</p>\n"
+            "    </body>\n"
+            "</html>\n"
+        ),
+        id="html4_01_frameset",
+    ),
+    pytest.param(
+        (
+            '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"\n'
+            '  "http://www.w3.org/TR/html4/strict.dtd">\n'
+            "<html>\n"
+            "  <head>\n"
+            "    <title>An HTML standard template</title>\n"
+            '    <meta charset="utf-8" />\n'
+            "  </head>\n"
+            "  <body>\n"
+            "    <p>… Your HTML content here …</p>\n"
+            "  </body>\n"
+            "</html>\n"
+        ),
+        (
+            '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">\n'
+            "<html>\n"
+            "    <head>\n"
+            "        <title>An HTML standard template</title>\n"
+            '        <meta charset="utf-8" />\n'
+            "    </head>\n"
+            "    <body>\n"
+            "        <p>… Your HTML content here …</p>\n"
+            "    </body>\n"
+            "</html>\n"
+        ),
+        id="html4_01_strict",
+    ),
+    pytest.param(
+        (
+            '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"\n'
+            '  "http://www.w3.org/TR/html4/loose.dtd">\n'
+            "<html>\n"
+            "  <head>\n"
+            "    <title>An HTML standard template</title>\n"
+            '    <meta charset="utf-8" />\n'
+            "  </head>\n"
+            "  <body>\n"
+            "    <p>… Your HTML content here …</p>\n"
+            "  </body>\n"
+            "</html>\n"
+        ),
+        (
+            '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">\n'
+            "<html>\n"
+            "    <head>\n"
+            "        <title>An HTML standard template</title>\n"
+            '        <meta charset="utf-8" />\n'
+            "    </head>\n"
+            "    <body>\n"
+            "        <p>… Your HTML content here …</p>\n"
+            "    </body>\n"
+            "</html>\n"
+        ),
+        id="html4_01_transitional",
+    ),
+    pytest.param(
+        (
+            "<!DOCTYPE html>\n"
+            "<html>\n"
+            "  <head>\n"
+            "    <title>An HTML standard template</title>\n"
+            '    <meta charset="utf-8" />\n'
+            "  </head>\n"
+            "  <body>\n"
+            "    <p>… Your HTML content here …</p>\n"
+            "  </body>\n"
+            "</html>\n"
+        ),
+        (
+            "<!DOCTYPE html>\n"
+            "<html>\n"
+            "    <head>\n"
+            "        <title>An HTML standard template</title>\n"
+            '        <meta charset="utf-8" />\n'
+            "    </head>\n"
+            "    <body>\n"
+            "        <p>… Your HTML content here …</p>\n"
+            "    </body>\n"
+            "</html>\n"
+        ),
+        id="html5",
+    ),
+    pytest.param(
+        (
+            '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\n'
+            '<html xmlns="http://www.w3.org/1999/xhtml">\n'
+            "  <head>\n"
+            '    <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />\n'
+            "    <title>XHTML markup</title>\n"
+            "  </head>\n"
+            '  <body style="background-color:#ffffcc; color:#008800">\n'
+            "    <br />\n"
+            '    <h2 align="center">Sample XHTML page</h2>\n'
+            "    <br />\n"
+            '    <div align="center">\n'
+            '      <img src="../images/bee3.jpg" width="400" height="250" alt="Beep" vspace="20" />\n'
+            "    </div>\n"
+            '    <p align="center" style="font-size:17px">Bar Foo,<br />\n'
+            "      Foo,<br />\n"
+            "      Bar<br />\n"
+            "      Foo</p>\n"
+            '    <p align="center"><em>String</em></p>\n'
+            "    <br />\n"
+            "    <hr />\n"
+            "  </body>\n"
+            "</html>\n"
+        ),
+        (
+            '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\n'
+            '<html xmlns="http://www.w3.org/1999/xhtml">\n'
+            "    <head>\n"
+            '        <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />\n'
+            "        <title>XHTML markup</title>\n"
+            "    </head>\n"
+            '    <body style="background-color:#ffffcc; color:#008800">\n'
+            "        <br />\n"
+            '        <h2 align="center">Sample XHTML page</h2>\n'
+            "        <br />\n"
+            '        <div align="center">\n'
+            '            <img src="../images/bee3.jpg"\n'
+            '                 width="400"\n'
+            '                 height="250"\n'
+            '                 alt="Beep"\n'
+            '                 vspace="20" />\n'
+            "        </div>\n"
+            '        <p align="center" style="font-size:17px">\n'
+            "            Bar Foo,\n"
+            "            <br />\n"
+            "            Foo,\n"
+            "            <br />\n"
+            "            Bar\n"
+            "            <br />\n"
+            "            Foo\n"
+            "        </p>\n"
+            '        <p align="center">\n'
+            "            <em>String</em>\n"
+            "        </p>\n"
+            "        <br />\n"
+            "        <hr />\n"
+            "    </body>\n"
+            "</html>\n"
+        ),
+        id="xhtml1_1",
+    ),
+]
+
+
+@pytest.mark.parametrize(("source", "expected"), test_data)
+def test_base(source, expected, basic_config):
+    output = formatter(basic_config, source)
+
+    printer(expected, source, output)
+    assert expected == output

package/tests/test_html/test_ignored.py

@@ -0,0 +1,193 @@
+"""Test ignored content.
+
+poetry run pytest tests/test_html/test_ignored.py
+"""
+import pytest
+
+from src.djlint.reformat import formatter
+from tests.conftest import printer
+
+test_data = [
+    pytest.param(
+        ("<!-- <span> -->\n" "<div><p><span></span></p></div>\n" "<!-- <div> -->\n"),
+        (
+            "<!-- <span> -->\n"
+            "<div>\n"
+            "    <p>\n"
+            "        <span></span>\n"
+            "    </p>\n"
+            "</div>\n"
+            "<!-- <div> -->\n"
+        ),
+        id="ignored_1",
+    ),
+    # check custom ignore tag {# djlint:off #} {# djlint:on #}
+    pytest.param(
+        (
+            "<!-- djlint:off -->\n"
+            "<div><p><span></span></p></div>\n"
+            "<!-- djlint:on -->\n"
+            "{# djlint:off #}\n"
+            "<div><p><span></span></p></div>\n"
+            "{# djlint:on #}\n"
+            "{% comment %} djlint:off {% endcomment %}\n"
+            "<div><p><span></span></p></div>\n"
+            "{% comment %} djlint:on {% endcomment %}\n"
+            "{{ /* djlint:off */ }}\n"
+            "<div><p><span></span></p></div>\n"
+            "{{ /* djlint:on */ }}\n"
+            "{{!-- djlint:off --}}\n"
+            "<div><p><span></span></p></div>\n"
+            "{{!-- djlint:on --}}\n"
+        ),
+        (
+            "<!-- djlint:off -->\n"
+            "<div><p><span></span></p></div>\n"
+            "<!-- djlint:on -->\n"
+            "{# djlint:off #}\n"
+            "<div><p><span></span></p></div>\n"
+            "{# djlint:on #}\n"
+            "{% comment %} djlint:off {% endcomment %}\n"
+            "<div><p><span></span></p></div>\n"
+            "{% comment %} djlint:on {% endcomment %}\n"
+            "{{ /* djlint:off */ }}\n"
+            "<div><p><span></span></p></div>\n"
+            "{{ /* djlint:on */ }}\n"
+            "{{!-- djlint:off --}}\n"
+            "<div><p><span></span></p></div>\n"
+            "{{!-- djlint:on --}}\n"
+        ),
+        id="ignored_2",
+    ),
+    pytest.param(
+        (
+            '{# djlint: off #}<meta name="description" content="{% block meta_content %}Alle vogelkijkhutten van Nederland{% endblock %}">{# djlint:on #}'
+        ),
+        (
+            '{# djlint: off #}<meta name="description" content="{% block meta_content %}Alle vogelkijkhutten van Nederland{% endblock %}">{# djlint:on #}\n'
+        ),
+        id="ignored_3",
+    ),
+    pytest.param(
+        (
+            "{% comment %}djlint:off{% endcomment %}<div><img><p></p></div>{% comment %}djlint:on{% endcomment %}<div><img></div>{% comment %}djlint:off{% endcomment %}<div><img><p></p></div>"
+        ),
+        (
+            "{% comment %}djlint:off{% endcomment %}<div><img><p></p></div>{% comment %}djlint:on{% endcomment %}\n"
+            "<div>\n"
+            "    <img>\n"
+            "</div>\n"
+            "{% comment %}djlint:off{% endcomment %}<div><img><p></p></div>\n"
+        ),
+        id="{% comment don't require an on block",
+    ),
+    pytest.param(
+        (
+            "{# djlint: off #}<div><img><p></p></div>{# djlint: on #}<div><img></div>{# djlint: off #}<div><img><p></p></div>"
+        ),
+        (
+            "{# djlint: off #}<div><img><p></p></div>{# djlint: on #}\n"
+            "<div>\n"
+            "    <img>\n"
+            "</div>\n"
+            "{# djlint: off #}<div><img><p></p></div>\n"
+        ),
+        id="{# don't require an on block",
+    ),
+    pytest.param(
+        (
+            "{{!-- djlint:off--}}<div><img><p></p></div>{{!-- djlint:on--}}<div><img></div>{{!-- djlint:off--}}<div><img><p></p></div>"
+        ),
+        (
+            "{{!-- djlint:off--}}<div><img><p></p></div>{{!-- djlint:on--}}\n"
+            "<div>\n"
+            "    <img>\n"
+            "</div>\n"
+            "{{!-- djlint:off--}}<div><img><p></p></div>\n"
+        ),
+        id="{{!-- don't require an on block",
+    ),
+    pytest.param(
+        (
+            "{{ /* djlint:off */ }}<div><img><p></p></div>{{ /* djlint:on */ }}<div><img></div>{{ /* djlint:off */ }}<div><img><p></p></div>"
+        ),
+        (
+            "{{ /* djlint:off */ }}<div><img><p></p></div>{{ /* djlint:on */ }}\n"
+            "<div>\n"
+            "    <img>\n"
+            "</div>\n"
+            "{{ /* djlint:off */ }}<div><img><p></p></div>\n"
+        ),
+        id="{{ /* don't require an on block",
+    ),
+    pytest.param(
+        ("<script>\n" "    <div><p><span></span></p></div>\n" "</script>\n"),
+        ("<script>\n" "    <div><p><span></span></p></div>\n" "</script>\n"),
+        id="script",
+    ),
+    pytest.param(
+        (
+            "<html>\n"
+            "    <head>\n"
+            '        <link href="{% static  \'foo/bar.css\' %}" rel="stylesheet"/>\n'
+            "        <!--JS-->\n"
+            "        <script src=\"{% static  'foo/bar.js' %}\"></script>\n"
+            "    </head>\n"
+            "</html>\n"
+        ),
+        (
+            "<html>\n"
+            "    <head>\n"
+            '        <link href="{% static  \'foo/bar.css\' %}" rel="stylesheet" />\n'
+            "        <!--JS-->\n"
+            "        <script src=\"{% static  'foo/bar.js' %}\"></script>\n"
+            "    </head>\n"
+            "</html>\n"
+        ),
+        id="inline_scripts_links",
+    ),
+    pytest.param(
+        (
+            "<style>\n"
+            "    {# override to fix text all over the place in media upload box #}\n"
+            "    .k-dropzone .k-upload-status {\n"
+            "        color: #a1a1a1;\n"
+            "    }\n"
+            "</style>\n"
+        ),
+        (
+            "<style>\n"
+            "    {# override to fix text all over the place in media upload box #}\n"
+            "    .k-dropzone .k-upload-status {\n"
+            "        color: #a1a1a1;\n"
+            "    }\n"
+            "</style>\n"
+        ),
+        id="style_tag_1",
+    ),
+    pytest.param(
+        (
+            "<style>\n"
+            " .k-dropzone .k-upload-status {\n"
+            "       color: #a1a1a1;\n"
+            "           }\n"
+            "</style>\n"
+        ),
+        (
+            "<style>\n"
+            " .k-dropzone .k-upload-status {\n"
+            "       color: #a1a1a1;\n"
+            "           }\n"
+            "</style>\n"
+        ),
+        id="style_tag_2",
+    ),
+]
+
+
+@pytest.mark.parametrize(("source", "expected"), test_data)
+def test_base(source, expected, basic_config):
+    output = formatter(basic_config, source)
+
+    printer(expected, source, output)
+    assert expected == output

package/tests/test_html/test_interpolation.py

@@ -0,0 +1,56 @@
+"""Test interpolation.
+
+poetry run pytest tests/test_html/test_interpolation.py
+"""
+import pytest
+
+from src.djlint.reformat import formatter
+from tests.conftest import printer
+
+test_data = [
+    pytest.param(
+        (
+            "<!--interpolations in html should be treated as normal text--><div>Fuga magnam facilis. Voluptatem quaerat porro.{{\n"
+            "x => {\n"
+            "    const hello = 'world'\n"
+            "    return hello;\n"
+            "}\n"
+            "}} Magni consectetur in et molestias neque esse voluptatibus voluptas. {{\n"
+            "\n"
+            "\n"
+            "    some_variable\n"
+            "}} Eum quia nihil nulla esse. Dolorem asperiores vero est error {{\n"
+            "                    preserve\n"
+            "                    invalid\n"
+            "\n"
+            "                    interpolation\n"
+            "}} reprehenderit voluptates minus {{console.log(  short_interpolation )}} nemo.</div>\n"
+        ),
+        (
+            "<!--interpolations in html should be treated as normal text-->\n"
+            "<div>\n"
+            "    Fuga magnam facilis. Voluptatem quaerat porro.{{\n"
+            "    x => {\n"
+            "    const hello = 'world'\n"
+            "    return hello;\n"
+            "    }\n"
+            "    }} Magni consectetur in et molestias neque esse voluptatibus voluptas. {{\n"
+            "    some_variable\n"
+            "    }} Eum quia nihil nulla esse. Dolorem asperiores vero est error {{\n"
+            "    preserve\n"
+            "    invalid\n"
+            "    interpolation\n"
+            "    }} reprehenderit voluptates minus {{ console.log(short_interpolation) }} nemo.\n"
+            "</div>\n"
+        ),
+        id="interpolation_in_text",
+    ),
+]
+
+
+@pytest.mark.parametrize(("source", "expected"), test_data)
+def test_base(source, expected, basic_config):
+    output = formatter(basic_config, source)
+
+    printer(expected, source, output)
+    assert expected == output