mmikkel / Retcon-Craft

A collection of powerful Twig filters for modifying HTML
MIT License
80 stars 9 forks source link

`:empty` selector in Retcon removes <br> elements incorrectly** #70

Open romainpoirier opened 1 week ago

romainpoirier commented 1 week ago

Description:

I'm using Retcon to modify my content, specifically to remove unnecessary tags. However, it seems that the CSS :empty selector is also targeting self-closing <br> elements when it shouldn't:

{{ entry.text | striptags('<br>') | retcon([
    ['remove', ':empty']
]) | typogrify }}

In this case, the <br> elements are being removed along with genuinely empty elements, which is unexpected behavior.

Is this a bug? If not, how can I remove truly empty elements (e.g., <p></p>) while keeping <br> elements intact?

Versions used:

Thank you!

mmikkel commented 1 week ago

Retcon uses Symfony's CssSelector component under the hood, and I'm not sure if that supports the :empty selector (guessing not).

There's a dedicated retconRemoveEmpty filter for removing empty nodes, though. The default behavior for that is to retain any <br> tags; you might want to try that and see if it works better for your use case:

{{ entry.text | striptags('<br>') | retcon([
    ['removeEmpty']
]) | typogrify }}

or

{{ entry.text | striptags('<br>') | retconRemoveEmpty | typogrify }}

...if you ever want to remove <br> tags in addition to empty nodes, set the removeBr param to true, e.g.

{{ entry.text | striptags('<br>') | retconRemoveEmpty(removeBr=true) | typogrify }}
romainpoirier commented 1 week ago

Thank you for your response, but the | retconRemoveEmpty filter is not functioning as intended.

Steps to reproduce:

The following input text in CKEditor:

lorem

ipsum

Results in the following HTML output:

<p>
    lorem
</p>
<p>
    &nbsp;
</p>
<p>
    &nbsp;
</p>
<p>
    ipsum
</p>

When using the following Twig code:

{{ entry.text | retconRemoveEmpty }}

The rendered front-end output is:

<p>lorem</p><p>&nbsp;</p><p>&nbsp;</p><p>ipsum</p>

Expected behavior:

The | retconRemoveEmpty filter should remove the empty paragraphs, but it seems to retain the line breaks (&nbsp;) as seen in the HTML output.

Could you provide a solution or clarify if this behavior is expected?

mmikkel commented 1 week ago

That's interesting; I was not aware of that behaviour. It seems specific to CK Editor output, as I'm not able to reproduce it with Redactor, or with raw HTML (i.e. something like '<p> </p>'|retconRemoveEmpty).

I'll investigate; in the meantime if you need a quick fix you could do

{{ entry.text | retconRemoveEmpty | replace('<p>&nbsp;</p>', '') | raw }}