How to parse all outputs from template string?

[timsofteng]

Hello.
I need to parse all outputs from template.

{{bucket}}
{% for product in products %}
   {{ product.name }} ads
{% endfor %}

So I want to get array like ["bucket", "product.name"] or something like that.
How can I do it?

[harttle]

There is a way, but now there's no AST definition, that means the way to access the parsed tokens is implementation specific and subject to change. For example the following code outputs what you mentioned above:

const { Liquid } = require('liquidjs')
const engine = new Liquid()
const tpls = engine.parse(`
{{bucket}}
{% for product in products %}
   {{ product.name }} ads
{% endfor %}
`)
console.log(tpls[1].token.content) // outputs: bucket
console.log(tpls[3].impl.templates[1].token.content) // outputs: product.name

Note that the name .impl is defined in for implementation, and the way to access children nodes can be different for each tag. And tpls[0] is represents \n before the first output {{bucket}}.

I'm planning to provide a well-defined AST in the next major version (latter this year). Just created this work item to remind me: https://github.com/harttle/liquidjs/projects/1#card-84455385

[timsofteng]

Hm. I still don't understand how can I know specific indexes of array's elements? Imagine I have big complex template. How can I grab outputs?

[pbojinov]

My use case is similar, I wanted to find all liquid handles in a template. I solved it using the following approach.

Input:

My top selling product is {{ products[0].title }} with a total of {{ products[0].total_sales }}

Code:

const template = engine.parse(cleanedHTML);

const handles = template
  .map(({token}: {token: Token}) => {
    if (token?.kind === TokenKind.Output) {
      return token.content;
    }
  })
  .filter((item) => item != null)

Output:

['products[0].title', 'products[0].total_sales']

[harttle]

In v10, I consolidated property names refering to child templates and created a demo for iterating templates. Sorry I forgot to update this thread after released v10. Here's the demo entry point to get all outputs: https://github.com/harttle/liquidjs/blob/master/demo/template/index.ts

The most important part is:

liquidjs/demo/template/get-outputs.ts

Lines 8 to 24 in 7526d40

	for (const template of templates) {
	if (template instanceof Tag) {
	if (isIfTag(template) || isUnlessTag(template) || isCaseTag(template)) {
	for (const branch of template.branches) {
	yield * getOutputs(branch.templates)
	}
	yield * getOutputs(template.elseTemplates)
	} else if (isForTag(template)) {
	yield * getOutputs(template.templates)
	yield * getOutputs(template.elseTemplates)
	} else if (isLiquidTag(template) || isCaptureTag(template) || isTablerowTag(template) || isLayoutTag(template)) {
	yield * getOutputs(template.templates)
	}
	} else if (template instanceof Output) {
	yield template
	}
	}

[harttle]

I created a PR to AST explorer, hopefully it'll be availabel soon fkling/astexplorer#680