RequireJS Text Plugin Imports My Templates Incorrectly

Question

When importing a text file using require.js with the text plugin, some of the forward slashes are missing in the final output, causing the parser to fail because of unclosed block statements. The JavaScript is pretty standard and looks something like:

define(['handlebars', 'some/dependency', 'text!some/text.html'], function (Handlebars, SomeDependency, text) {
    var MyView = Backbone.View.Extend({
        template: Handlebars.compile(text),
        // etc.
    })
})

The import works, meaning I get data from require, but I've found that if the content of text.html looks like this:

<div {{#if prop}}class="{{prop}}" {{else}} class="other-class"{{/if}}></div>

it doesn't return correctly. Instead what I get is:

<div {{#if prop}}class="{{prop}}" {{else}} class="other-class"{{ if}}></div>

It somehow loses the closing forward slash for the if block while it is within an html element. However, if I change it to:

{{#if prop}}
    <div class="{{prop}}"></div>
{{else}}
    <div class="other-class"></div>
{{/if}}

It comes back correctly.

Now, an obvious solution is to use the second paradigm, but all of my templates are set up like the first one, and they worked correctly until a few days ago (week, tops).

Anyone have any ideas about what might be causing this?

For now I'm going to go through the commit logs and see if I can find anything obvious, and if I find anything I'll add it here.

Answer 1

After much discussion with our various teams, we narrowed down the problem to being caused by the Apache pageSpeed module in our Amazon instance.

This setting caused the <head/> tag to appear: https://developers.google.com/speed/pagespeed/module/filter-head-add

and I'm not sure which specific setting might have been the cause of the corruption of the {{/if}}.

After disabling the mod, the problem was resolved.