Append invisible characters to <mj-preview>

[vdemcak]

Currently, the <mj-preview> tag functions by placing its contents into an invisible <div> tag. This approach allows the contents to appear in the email preview on clients such as Gmail. However, there is a minor issue with this implementation.

<div style="display:none;font-size:1px;color:#ffffff;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;">    
  Hello World!
</div>

If the preview text provided by the <mj-preview> tag is too short, the email client may grab the next text-containing element, potentially resulting in the title not accurately reflecting what the user has defined.

Wouldn't it be possible to improve the <mj-preview> functionality by introducing an option to append invisible characters to the title during the compilation step? This modification would ensure that the title contains only the elements explicitly defined by the user, improving the accuracy of email previews.

<div style="display:none;font-size:1px;color:#ffffff;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;">    
  Hello World!
  <div>
    <!-- A sequence of U+200F and U+200E characters  -->
  <div/>
</div>

[iRyusa]

👋 Closing in favor of #1829
But we don't want to be the default behavior of preview tag and put it behind an attribute.