Handlebars parser is not handling JSON data correctly

[wardkj]

Hi,

the hanlebars parser doesn't like JSON that ends in two braces.

If, say, we pass in a template like

<template requires=""><button someAttr="{&quot;one&quot;: &quot;value&quot;,&quot;two&quot;: {&quot;inner&quot;: &quot;value&quot;}}"></button></template>

once its parsed, the final }} are missing from the attribute value

[wkeese]

Huh? The whole point of handlebars is to bind the DOM to properties in the widget, and that's what the {{ ... }} syntax is for. For example, <button someAttr="{{propertyXYZ}}">. You're expecting the }} to just be treated as literal text?

[martinfitzg]

The use case here is that certain attributes that are in the markup of the template contain json eg

<template>
     <my-custom-component someattr="{name: {first : 'john', last: 'doe'}}"></my-custom-component >
</template>

As the markup for this template is been generated server side and the json that is been set here drives some sort of state when the widget initializes.

The problem here is the last part of the json .... 'doe'}} .... as there is 2 curly closing brackets together. This causes issue with handlebars 'compiling', as it's not valid as far as it is concerned, as there is no way to tell handlebars that it should be ignored.

Is there any way that it can be told to ignore this block of json during it's 'compile' phase ?

[wkeese]

Hmm, there's no way to do that currently. I suppose the toJs() method in handlebars.js should be modified to be less fragile, and ignore the case above since there's no opening {{ characters. You've shown an example where JSON contains }} but I suppose there's never a case in JSON where there's a {{?

[wkeese]

PS: You're walking on thin ice though, because if you insert arbitrary data into the template then theoretically the string literals themselves could contain curly brackets:

<template>
     <my-custom-component someattr="{name: '{{weird name}}'}"></my-custom-component >
</template>

At that point I guess you would need to start escaping strings on the server, converting curly braces to { and |. Actually you should probably be escaping already in case your user text contains an & character.

PS: Hmm maybe even encoding wouldn't work; the browser might automatically decode before handlebars.js sees it. Not sure.