How to debug template in Meteor/handlebars?

Question

According to this blog post, I should register a helper to better debug handlebars templates, but is not working:

ReferenceError: Handlebars is not defined

So, how can I {{debug}} in Meteor/handlebars?

Answer 1

This is the helper function I use for debugging in my own projects:

Template.registerHelper("debug", function(optionalValue) { 
  console.log("Current Context");
  console.log("====================");
  console.log(this);

  if (optionalValue) {
    console.log("Value"); 
    console.log("===================="); 
    console.log(optionalValue); 
  } 
});

You can then call it in your templates with {{debug}} and it displays the context you are currently in. Read more at http://docs.meteor.com/#/full/template_registerhelper.

Answer 2

In Meteor 0.4.0 you register handlers like this:

Template.myTemplate.helpers({
  helper: function () {
    // some code here
    console.log(arguments);
  }
});

There is no need to call Handlebars directly.

Answer 3

Make sure that you register your helper in client (or shared) meteor code.

Handlebars.registerHelper('helper', function() {
  // Do stuff
});

This should be callable via {{helper}} in your templates.

Answer 4

For the sake of completeness: you can also use

Template.registerHelper('helper', helperFunc);

instead of Handlebars.regsterHelper('h',f);

A small reason this is better is that then your app won't need that much refactoring if you decide somewhere down the road that you want to use something else instead of Handlebars(i.e. Spacebars, the real name of meteors adaption) like jade for meteor.

This is really a comment to the accepted answer. Looking forward to one day hit 50 rep.