Email template body truncated when used

[pettys]

I’ve customized the template under Settings > Templates & Reminders > choose “Invoice” and customize Body.

When I select an invoice and “Send Email,” the lower/preview portion of the email shows all the content I expect to be in the email body, but the upper/HTML portion of the email is truncated.

The biggest problem with this is often I want to tweak the text, but if I do, then the preview updates and the truncation of the HTML portion carries into the preview and if I send the email, it’s missing most of the content of the template.

I’m using the desktop app, v5.5.55-W104. The same problem occurs, though, on v5.5.55-C104. I’m including details below that I hope will allow you to reproduce the problem.

Jason

My saved body template, under Settings, that gives me problems:

Hi $contact.first_name,<br>
<br>
Thank you for your business - I appreciate it. Your invoice for the last billing period is 
<strong>Invoice $number</strong> for $amount.<br>
<br>
<div class="view-invoice">$view_button</div>
<br>
<br>
Contact me if you have any questions. Thanks!<br>
<br>
Jason

When this template is used with Invoice > “Send Email” it appears like this:

Hi $contact.first_name,<br>
<br>
Thank you for your business - I appreciate it. Your invoice for the last billing period is 
<strong>Invoice $number</strong> for $amount.<br>
<br>

The content starting with the <div> is truncated. In experimentation, <p> tags also cause truncation.

If I tweak the text, eg, “Your invoice for January is…” then the very inconvenient thing is the rest of the body content is lost:

[hillel]

Hi,

@david do you have any ideas?

[david]

@pettys

Thanks for the detailed post! I used your exact steps, but couldn’t recreate this::

As a test, are you able to do the same via a web browser, just to exclude the interface as an issue.

[david]

@pettys

One other thing, it looks like you are using a custom email template, my spider senses are telling me this may be the issue. If you can switch to the light template and recheck, we’ll also be able to exclude the custom email design.

[pettys]

Hi @david, thanks for trying to repro my issue. I am able to reproduce the error in a web browser. There is a difference in the lower/preview area: the web browser includes the whole email template (both the Email Settings > Email Design content AND the Template > Body content), while the desktop does not include the former of those two. Here’s a side-by-side showing the difference after I’ve switched to the light template as you proposed:

From the image I think you can see how I tried both of your suggestions (use browser, use Light) but am still seeing the HTML truncation.

This might be helpful: I replaced the <div>…</div> of the Body content with just “$view_button” and the problem went away. I tried with with both Light and my custom Email Design, and it worked in both cases. So for my account, the problem seems to be related to whether my Body content has <div> or <p> tags in it.

This probably isn’t helpful but just in case: I used browser dev tools to inspect the POST to /templates and saw in the JSON response that “raw_body” is there and is complete. I was going to try to trace any transformations between that JSON property and the UI control, but found you’re using flutter so that would be pretty hard.

I realize it’s tricky when you plug in the same values and can’t recreate the problem. Are there any other settings that affect that screen that may be causing the issue?

Thanks for looking into this so promptly!
Jason

[hillel]

The difference is due to a limitation of the desktop app, it isn’t able to use the browser to render the email.

Are you seeing a problem in the emails themselves or just the preview?

[pettys]

Hi @hillel, the preview difference between web and desktop isn’t actually the problem. The difference is the top/HTML part is truncated at <div> or <p> tags, and it occurs on both desktop and web. It does affect the actual sent email in this way: if I make any change in the top/HTML part, the truncation propagates to the bottom preview, and into the sent email (which did result in one of our clients being sent an odd-looking email).

I updated my response from a few minutes ago with a few more things I’ve tried.

[pettys]

@david Any other ideas of something I could try or information about this issue I can supply?

[david]

@pettys we’ll update here, need to work with @hillel to try and recreate this.

[hillel]

Is the email markdown option on Settings > Account Management enabled or disabled?

[pettys]

@hillel Settings > Account Management > “Enable Email Markdown” is enabled.

[hillel]

I think there may be two separate issues.

The difference in the display of the email preview on the web app is different to desktop due to current limitations.

I believe there is also a problem with actual sent email, is that correct?

[pettys]

@hillel Your repetition makes me feel like you are not fully following my explanations. As I’ve already said, “the preview difference between web and desktop isn’t actually the problem.” Please be certain that the limitation you’ve brought up twice has nothing to do with the problem I’m experiencing.

I guess you’re being thrown off by my image where I put the web and desktop versions side-by-side. What’s important about this image isn’t the bottom difference. The important part is the “still missing” note at the top of both the web and desktop versions. That was the main point of the image: the problem occurs on both web and desktop clients. I apologize for the red herring I unintentionally added by also annotating that the CSS is applied to the web preview but not the desktop preview. I didn’t realize this was a known thing and thought it might be a clue to the actual problem.

Here is the problem. In my original post, in the first screenshot, please note where I hand-wrote the word “trunc” in red. At that point, there should be more HTML content, but it’s truncated. After that final <br> there is supposed to be a <div class="view-invoice"> but it’s not there. This is the main problem. (The full expected HTML is listed in a code snippet further above in the post.)

As my original post goes on to explain, this is inconvenient because if I want to tweak the content I’m sending to the client for this invoice, then the email that gets sent out is missing all the content that was truncated in the top/HTML section. See the next image of the original post where I wrote in red “gone :(”

Hope this clarifies the problem.
Jason

[david]

@pettys

Just a thought, are you including any special script tags in the body?

ie

<script></script>

or any other type of html entity that can potentially hide the content beneath it?

I can reproduce an issue like the one you have described above when inserting tags like this.

[pettys]

@david Thanks for the reply - the original post contains the template in its entirety, so I don’t think there’s anything there. The Email Settings > Email Design > Custom does contain a <style> tag, but I’m reproducing the issue even when I change that email design to “Light” as you originally suggested so I guess that wouldn’t be it.

[david]

@pettys

Can you send an email to contact@invoiceninja.com

if you can advise in the email the invoice number that got the truncated text, i’ll inspect the email payload to see if there is anything there we can look at.

[pettys]

@david The invoice in the original post, INV-1781, did have an email sent out. You could check that payload. I’ll send an email to this effect as well.

[pettys]

Reporting back here after working directly with support. The problem was a combination of the HTML tags I was using in the email template along with having email markdown enabled. The best fix for me was to disable Settings > Account Management > Enable Email Markdown.