CODEWITHSUNDEEP
javascripthtmlhandlebars.js
Eriedor
Eriedor

Reputation: 411

HandlebarsJS White Space in Precompiled Templates

I'm in the process of migrating one of my projects to use HandlebarsJS templates instead of underscore templates and I have come across a very strange issue.

I'm using precompiled templates and everywhere i'm appending rendered templates to the DOM i'm getting an empty text element appended as well which is causing layout issues with gaps rendering in place of them

Looking at the chrome dev console shows the following markup of 3 templates appended to a div:

> <div>
      ""
      <div><!--content --></div>
      ""
      <div><!--content --></div>
      ""
      <div><!--content --></div>
  </div>

When dumping the parent div HTML to the javascript console there aren't any spaces at all, it's simply:

<div><!--content --></div><div><!--content --></div><div><!--content --></div>

Upvotes: 3

Views: 1594

Answers (1)

Eriedor
Eriedor

Reputation: 411

Ok this is now resolved, as per the comments on the original question the issue was a \ufeff character which was being added during precompilation, my IDE and developer browser extensions don't display the character even with visible white-space options enabled.

To resolve the issue i updated my template appending code to 

$container.append(template({ *data* }).replace(/\ufeff/, ''));

Upvotes: 1

Related Questions