Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

A tags and figures are not handled correctly #1158

Open
humaknlght opened this issue Dec 11, 2024 · 0 comments
Open

A tags and figures are not handled correctly #1158

humaknlght opened this issue Dec 11, 2024 · 0 comments

Comments

@humaknlght
Copy link

humaknlght commented Dec 11, 2024

I am trying to minify an HTML fragment with HTML inside an anchor tag. The minifier moves the content from inside the a tag to outside the a tag.

The command used for minifying:

html-minifier --keep-closing-slash --remove-comments --collapse-whitespace --minify-js --minify-css --decode-entities --no-html5 --process-conditional-comments --remove-redundant-attributes --remove-script-type-attributes --remove-style-link-type-attributes --use-short-doctype --trim-custom-fragments -o index.htm.min index.html

Source file
https://github.com/humaknlght/ericperretsinfo/blob/master/src/art/index.html

<div class="artContent" contenteditable="false">
    <a href="/art/img/2.jpg">
        <figure>
            <img src="/art/img/2.jpg" width="552" height="795"/>
            <figcaption>Tetris</figcaption>
        </figure>
    </a>
    <a href="/art/img/3.jpg">
        <figure>
            <img src="/art/img/3.jpg" loading="lazy" width="552" height="795"/>
            <figcaption>Shapes</figcaption>
        </figure>
    </a>
    <a href="/art/img/4.jpg">
        <figure>
            <img src="/art/img/4.jpg" loading="lazy" width="552" height="807"/>
            <figcaption>Boxes and Lines</figcaption>
        </figure>
    </a>
    <a href="/art/img/6.jpg">
        <figure>
            <img src="/art/img/6.jpg" loading="lazy" width="552" height="781"/>
            <figcaption>Maze 1</figcaption>
        </figure>
    </a>
    <a href="/art/img/7.jpg">
        <figure>
            <img src="/art/img/7.jpg" loading="lazy" width="552" height="804"/>
            <figcaption>Maze 2</figcaption>
        </figure>
    </a>
    <a href="/art/img/8.jpg">
        <figure>
            <img src="/art/img/8.jpg" loading="lazy" width="552" height="803"/>
            <figcaption>Concentric Lines</figcaption>
        </figure>
    </a>
    <a href="/art/img/9.jpg">
        <figure>
            <img src="/art/img/9.jpg" loading="lazy" width="552" height="800"/>
            <figcaption>Lines</figcaption>
        </figure>
    </a>
    <a href="/art/img/10.jpg">
        <figure>
            <img src="/art/img/10.jpg" loading="lazy" width="552" height="808"/>
            <figcaption>Concentric Lines ontop of Tetris</figcaption>
        </figure>
    </a>
    <a href="/art/img/11.jpg">
        <figure>
            <img src="/art/img/11.jpg" loading="lazy" width="552" height="786"/>
            <figcaption>Triangles</figcaption>
        </figure>
    </a>
    <a href="/art/img/12.jpg">
        <figure>
            <img src="/art/img/12.jpg" loading="lazy" width="552" height="800"/>
            <figcaption>Concentric ERIC</figcaption>
        </figure>
    </a>
    <a href="/art/img/13.jpg">
        <figure>
            <img src="/art/img/13.jpg" loading="lazy" width="552" height="797"/>
            <figcaption>Boxes and Lines 2</figcaption>
        </figure>
    </a>
    <a href="/art/img/14.jpg">
        <figure>
            <img src="/art/img/14.jpg" loading="lazy" width="552" height="802"/>
            <figcaption>Concentric Lines 2</figcaption>
        </figure>
    </a>
    <a href="/art/img/15.jpg">
        <figure>
            <img src="/art/img/15.jpg" loading="lazy" width="552" height="795"/>
            <figcaption>L Shapes</figcaption>
        </figure>
    </a>
    <a href="/art/img/16.jpg">
        <figure>
            <img src="/art/img/16.jpg" loading="lazy" width="552" height="791"/>
            <figcaption>Boxes with Patterns</figcaption>
        </figure>
    </a>
    <a href="/art/img/17.jpg">
        <figure>
            <img src="/art/img/17.jpg" loading="lazy" width="552" height="792"/>
            <figcaption>Angles</figcaption>
        </figure>
    </a>
    <a href="/art/img/18.jpg">
        <figure>
            <img src="/art/img/18.jpg" loading="lazy" width="552" height="794"/>
            <figcaption>Triangles and Squares</figcaption>
        </figure>
    </a>
    <a href="/art/img/19.jpg">
        <figure>
            <img src="/art/img/19.jpg" loading="lazy" width="552" height="796"/>
            <figcaption>⊔, ⊓, ⊏, and ⊐</figcaption>
        </figure>
    </a>
    <a href="/art/img/20.jpg">
        <figure>
            <img src="/art/img/20.jpg" loading="lazy" width="552" height="802"/>
            <figcaption>Triangles and Diamonds</figcaption>
        </figure>
    </a>
    <a href="/art/img/21.jpg">
        <figure>
            <img src="/art/img/21.jpg" loading="lazy" width="552" height="793"/>
            <figcaption>Tetris Lines with a Box and Triangle Fissure.</figcaption>
        </figure>
    </a>
    <a href="/art/img/5.jpg">
        <figure>
            <img src="/art/img/5.jpg" loading="lazy" width="552" height="811"/>
            <figcaption>Triangles</figcaption>
        </figure>
    </a>
</div>

Actual Minified version

<div class="artContent" contenteditable="false"><a href="/art/img/2.jpg"></a><figure><img src="/art/img/2.jpg" width="552" height="795"/><figcaption>Tetris</figcaption></figure><a href="/art/img/3.jpg"></a><figure><img src="/art/img/3.jpg" loading="lazy" width="552" height="795"/><figcaption>Shapes</figcaption></figure><a href="/art/img/4.jpg"></a><figure><img src="/art/img/4.jpg" loading="lazy" width="552" height="807"/><figcaption>Boxes and Lines</figcaption></figure><a href="/art/img/6.jpg"></a><figure><img src="/art/img/6.jpg" loading="lazy" width="552" height="781"/><figcaption>Maze 1</figcaption></figure><a href="/art/img/7.jpg"></a><figure><img src="/art/img/7.jpg" loading="lazy" width="552" height="804"/><figcaption>Maze 2</figcaption></figure><a href="/art/img/8.jpg"></a><figure><img src="/art/img/8.jpg" loading="lazy" width="552" height="803"/><figcaption>Concentric Lines</figcaption></figure><a href="/art/img/9.jpg"></a><figure><img src="/art/img/9.jpg" loading="lazy" width="552" height="800"/><figcaption>Lines</figcaption></figure><a href="/art/img/10.jpg"></a><figure><img src="/art/img/10.jpg" loading="lazy" width="552" height="808"/><figcaption>Concentric Lines ontop of Tetris</figcaption></figure><a href="/art/img/11.jpg"></a><figure><img src="/art/img/11.jpg" loading="lazy" width="552" height="786"/><figcaption>Triangles</figcaption></figure><a href="/art/img/12.jpg"></a><figure><img src="/art/img/12.jpg" loading="lazy" width="552" height="800"/><figcaption>Concentric ERIC</figcaption></figure><a href="/art/img/13.jpg"></a><figure><img src="/art/img/13.jpg" loading="lazy" width="552" height="797"/><figcaption>Boxes and Lines 2</figcaption></figure><a href="/art/img/14.jpg"></a><figure><img src="/art/img/14.jpg" loading="lazy" width="552" height="802"/><figcaption>Concentric Lines 2</figcaption></figure><a href="/art/img/15.jpg"></a><figure><img src="/art/img/15.jpg" loading="lazy" width="552" height="795"/><figcaption>L Shapes</figcaption></figure><a href="/art/img/16.jpg"></a><figure><img src="/art/img/16.jpg" loading="lazy" width="552" height="791"/><figcaption>Boxes with Patterns</figcaption></figure><a href="/art/img/17.jpg"></a><figure><img src="/art/img/17.jpg" loading="lazy" width="552" height="792"/><figcaption>Angles</figcaption></figure><a href="/art/img/18.jpg"></a><figure><img src="/art/img/18.jpg" loading="lazy" width="552" height="794"/><figcaption>Triangles and Squares</figcaption></figure><a href="/art/img/19.jpg"></a><figure><img src="/art/img/19.jpg" loading="lazy" width="552" height="796"/><figcaption>⊔, ⊓, ⊏, and ⊐</figcaption></figure><a href="/art/img/20.jpg"></a><figure><img src="/art/img/20.jpg" loading="lazy" width="552" height="802"/><figcaption>Triangles and Diamonds</figcaption></figure><a href="/art/img/21.jpg"></a><figure><img src="/art/img/21.jpg" loading="lazy" width="552" height="793"/><figcaption>Tetris Lines with a Box and Triangle Fissure.</figcaption></figure><a href="/art/img/5.jpg"></a><figure><img src="/art/img/5.jpg" loading="lazy" width="552" height="811"/><figcaption>Triangles</figcaption></figure></div>

You can see that the a tags are empty, causing the HTML to be different.

Expected Minified version

<div class="artContent" contenteditable="false"><a href="/art/img/2.jpg"><figure><img src="/art/img/2.jpg" width="552" height="795"/><figcaption>Tetris</figcaption></figure></a><a href="/art/img/3.jpg"><figure><img src="/art/img/3.jpg" loading="lazy" width="552" height="795"/><figcaption>Shapes</figcaption></figure></a><a href="/art/img/4.jpg"><figure><img src="/art/img/4.jpg" loading="lazy" width="552" height="807"/><figcaption>Boxes and Lines</figcaption></figure></a><a href="/art/img/6.jpg"><figure><img src="/art/img/6.jpg" loading="lazy" width="552" height="781"/><figcaption>Maze 1</figcaption></figure></a><a href="/art/img/7.jpg"><figure><img src="/art/img/7.jpg" loading="lazy" width="552" height="804"/><figcaption>Maze 2</figcaption></figure></a><a href="/art/img/8.jpg"><figure><img src="/art/img/8.jpg" loading="lazy" width="552" height="803"/><figcaption>Concentric Lines</figcaption></figure></a><a href="/art/img/9.jpg"><figure><img src="/art/img/9.jpg" loading="lazy" width="552" height="800"/><figcaption>Lines</figcaption></figure></a><a href="/art/img/10.jpg"><figure><img src="/art/img/10.jpg" loading="lazy" width="552" height="808"/><figcaption>Concentric Lines ontop of Tetris</figcaption></figure></a><a href="/art/img/11.jpg"><figure><img src="/art/img/11.jpg" loading="lazy" width="552" height="786"/><figcaption>Triangles</figcaption></figure></a><a href="/art/img/12.jpg"><figure><img src="/art/img/12.jpg" loading="lazy" width="552" height="800"/><figcaption>Concentric ERIC</figcaption></figure></a><a href="/art/img/13.jpg"><figure><img src="/art/img/13.jpg" loading="lazy" width="552" height="797"/><figcaption>Boxes and Lines 2</figcaption></figure></a><a href="/art/img/14.jpg"><figure><img src="/art/img/14.jpg" loading="lazy" width="552" height="802"/><figcaption>Concentric Lines 2</figcaption></figure></a><a href="/art/img/15.jpg"><figure><img src="/art/img/15.jpg" loading="lazy" width="552" height="795"/><figcaption>L Shapes</figcaption></figure></a><a href="/art/img/16.jpg"><figure><img src="/art/img/16.jpg" loading="lazy" width="552" height="791"/><figcaption>Boxes with Patterns</figcaption></figure></a><a href="/art/img/17.jpg"><figure><img src="/art/img/17.jpg" loading="lazy" width="552" height="792"/><figcaption>Angles</figcaption></figure></a><a href="/art/img/18.jpg"><figure><img src="/art/img/18.jpg" loading="lazy" width="552" height="794"/><figcaption>Triangles and Squares</figcaption></figure></a><a href="/art/img/19.jpg"><figure><img src="/art/img/19.jpg" loading="lazy" width="552" height="796"/><figcaption>⊔, ⊓, ⊏, and ⊐</figcaption></figure></a><a href="/art/img/20.jpg"><figure><img src="/art/img/20.jpg" loading="lazy" width="552" height="802"/><figcaption>Triangles and Diamonds</figcaption></figure></a><a href="/art/img/21.jpg"><figure><img src="/art/img/21.jpg" loading="lazy" width="552" height="793"/><figcaption>Tetris Lines with a Box and Triangle Fissure.</figcaption></figure></a><a href="/art/img/5.jpg"><figure><img src="/art/img/5.jpg" loading="lazy" width="552" height="811"/><figcaption>Triangles</figcaption></figure></a></div>

I validated the HTML fragment using https://validator.w3.org/nu/ and the input is valid.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant