magento2 icon indicating copy to clipboard operation
magento2 copied to clipboard

In WYSIWYG editor, i tags with class but no content are removed.

Open LiamKarlMitchell opened this issue 4 years ago • 24 comments

Summary (*)

These are used for icons to be shown in some blocks/content and so editing the content causes the icons to be removed.

It probably removes empty spans as well but I have not tried this yet.

Duplicate of #21602 which was closed for no reason. https://github.com/magefan/module-wysiwyg-advanced/issues/13

Preconditions

Magento 2.3.0 Magento 2.4-develop

Examples (*)

Steps to Reproduce

Edit a block or page content in the source edit.

<i class="icon-paperclip"></i>

Click show editor. Click hide editor.

Actual Result

And its gone... peek

Expected Result

Tag is not removed

Another example

Test
<i class="footer-icon icon-line-clock"></i>
Test

Becomes

<p>Test Test</p>

You can hack around it with an html comment as content such as

<i class="icon-paperclip"><!-- icon --></i>

But then it gets changed into an em.

<em class="icon-paperclip"><!-- icon --></em>

Font awesome for example uses i tags. In my case, WeltPixel Pearl theme uses i tags, especially their example content that is imported with the theme which we just want to edit/tweak as needed.

Proposed solution

Keep tags if they have no content when there are classes or attributes set. Maybe this should only apply to some tags such as a, i, div, span?

Perhaps not p tags as TinyMCE if I recall litters them all over the place and the removal of empty elements was made to clean up such issues, best if can consider i and span tags as non empty when they have class.


  • [ ] Severity: S0 - Affects critical data or functionality and leaves users with no workaround.
  • [x ] Severity: S1 - Affects critical data or functionality and forces users to employ a workaround.
  • [ ] Severity: S2 - Affects non-critical data or functionality and forces users to employ a workaround.
  • [ ] Severity: S3 - Affects non-critical data or functionality and does not force users to employ a workaround.
  • [ ] Severity: S4 - Affects aesthetics, professional look and feel, “quality” or “usability”.

LiamKarlMitchell avatar Jun 12 '20 04:06 LiamKarlMitchell