mjml
mjml copied to clipboard
Elements intended to contain plain text shouldn't include leading/trailing space
Describe the bug
When using elements intended to contain only plain text -- like <mj-title> and <mj-preview> -- a space is prepended and appended to the text. In some cases (such as a rendered <title> tag in a client's browser window) this space can be noticeable.
To Reproduce
This is visible on the docs' Try It Live for both <mj-title> and <mj-preview>, but here's one that shows both:
https://mjml.io/try-it-live/qvxPFIRrv
View the HTML and then look at the <title> tag and further down the <div style="display:none... line.
Expected behavior
For MJML elements that are intended to contain only plain text -- I think it's just <mj-title> and <mj-preview>, but maybe also <mj-raw> in some situations? -- no spaces should be added before or after the contents. For other elements which typically wrap HTML tags, it's not necessary (and also usually collapsed by client rendering anyway).
If the space is for some reason desired in some situations, it would be nice to have attributes on these elements to optionally prevent it. Something like spaceless="true" or whitespace="none".
MJML environment (please complete the following information):
- OS: Linux, but visible on Try It Live
- MJML Version: 4.12.0
- MJML tool used: npm package with gulp
Really weird that we have this issue only on those two tags. Looks to be related to beautify ?
It could be happening on other tags too, but as I said it wouldn't generally matter if the tag contains content that is wrapped in HTML. e.g. if it ends up generating <td> <p>..., clients/browsers will collapse that space. But if it's <td> Text... then it won't be collapsed.
There's no actual reason to have this whitespace anyway, i'll check if we can do something about this.
Looks fixed finally in latest version 😄