amphtml: amp-mustache: Better debug logging e.g. for template syntax errors

Currently, I don’t know of a good way to debug a mustache template. If I make a syntax error, or if the data returned by <amp-list> doesn’t match what the template expects, I’m just stuck. I can only debug by trial and error or by simply getting lucky.

For example, just now, my entire <amp-list> failed because I forgot the / in a close tag. Even when I added #development, AMP couldn’t help me.

It would be wonderful if #development let AMP output something about its attempts to apply my data to my template. And it would let me know if there was a mismatch or my template was simply invalid.

/cc @nainar

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Comments: 18 (15 by maintainers)

Most upvoted comments

I remember when you did this, @samouri ! I thought it was so helpful… thank you.

@choumx: can we make this a validator error in addition to a runtime one? The validator should be capable of running mustache.parse() on all of the templates within the page.

A pretty codeframe highlighting the error would take more time, but something simple like this would be trivial. WDYT: image

The lack of good error messages bit me today as well.

Consider this amp-list markup:

<amp-list
	layout="fixed-height"
	height="300"
	items="."
	src="https://make.wordpress.org/core/wp-json/wp/v2/posts"
>
	<template type="amp-mustache">
		<div>{{{title.rendered}}</div>
	</template>
	<div placeholder>Loading...</div>
	<div fallback>Failed to load data.</div>
</amp-list>

Notice the unbalanced braces in {{{title.rendered}}. Even with #development=1&log=4 the only relevant console entries are:

image

I would expect there to be some error message about a syntax error for unbalanced braces. Instead I only see “Unknown error”.