fix(tags): allow nested each loops

src/Tags/EachTag.js

@@ -123,6 +123,9 @@ class EachTag extends BaseTag {
       buffer.indent()
     }
 
+    const varName = parser.runtimeVariable('payload')
+    buffer.writeLine(`const ${varName} = ${rhs}`)
+
     /**
      * Create a new frame before running the
      * each loop.
@@ -132,7 +135,7 @@ class EachTag extends BaseTag {
     /**
      * Write the actual each loop
      */
-    buffer.writeLine(`this.context.loop(${rhs}, (${itteratorName}, loop) => {`)
+    buffer.writeLine(`this.context.loop(${varName}, (${itteratorName}, loop) => {`)
     buffer.indent()
 
     /**

src/Template/Compiler.js

@@ -35,6 +35,7 @@ class TemplateCompiler {
     this._processedLines = {}
     this._loader = loader
     this.buffer = new InternalBuffer(asFunction)
+    this._runtimeVarIndex = 0
   }
 
   /**
@@ -203,6 +204,20 @@ class TemplateCompiler {
     debug('compiled template to %s', output)
     return output
   }
+
+  /**
+   * Get a unique runtime variable for a given template
+   *
+   * @method runtimeVariable
+   *
+   * @param  {String}        [prefix = 'var']
+   *
+   * @return {String}
+   */
+  runtimeVariable (prefix = 'var') {
+    this._runtimeVarIndex++
+    return `${prefix}_${this._runtimeVarIndex}`
+  }
 }
 
 module.exports = TemplateCompiler

test/unit/tags/each.spec.js

@@ -1,5 +1,6 @@
 'use strict'
 
+const _ = require('lodash')
 const test = require('japa')
 const Template = require('../../../src/Template')
 const TemplateRunner = require('../../../src/Template/Runner')
@@ -22,8 +23,9 @@ test.group('Tags | Each ', (group) => {
     assert.equal(output, dedent`
     return (function templateFn () {
       let out = new String()
+      const payload_1 = this.context.resolve('users')
       this.context.newFrame()
-      this.context.loop(this.context.resolve('users'), (user, loop) => {
+      this.context.loop(payload_1, (user, loop) => {
         this.context.setOnFrame('user', user)
         this.context.setOnFrame('$loop', loop)
       })
@@ -44,8 +46,9 @@ test.group('Tags | Each ', (group) => {
     assert.equal(output, dedent`
     return (function templateFn () {
       let out = new String()
+      const payload_1 = this.context.resolve('users')
       this.context.newFrame()
-      this.context.loop(this.context.resolve('users'), (user, loop) => {
+      this.context.loop(payload_1, (user, loop) => {
         this.context.setOnFrame('user', user)
         this.context.setOnFrame('$loop', loop)
         out += \`  <p> Hello \${this.context.escape(this.context.accessChild(this.context.resolve('user'), ['username']))} </p>\\n\`
@@ -65,8 +68,9 @@ test.group('Tags | Each ', (group) => {
     `
     const template = new Template(this.tags)
     const output = template.compileString(statement).split('\n')
-    assert.equal(output[3].trim(), `this.context.loop(this.context.resolve('users'), (user, loop) => {`)
-    assert.equal(output[7].trim(), `this.context.loop(this.context.accessChild(this.context.resolve('user'), ['profiles']), (profile, loop) => {`)
+    assert.equal(output[4].trim(), `this.context.loop(payload_1, (user, loop) => {`)
+    assert.equal(output[7].trim(), `const payload_2 = this.context.accessChild(this.context.resolve('user'), ['profiles'])`)
+    assert.equal(output[9].trim(), `this.context.loop(payload_2, (profile, loop) => {`)
   })
 
   test('throw exception when expression is not binary', (assert) => {
@@ -110,8 +114,9 @@ test.group('Tags | Each ', (group) => {
     assert.equal(output, dedent`
     return (function templateFn () {
       let out = new String()
+      const payload_1 = this.context.resolve('users')
       this.context.newFrame()
-      this.context.loop(this.context.resolve('users'), (user, loop) => {
+      this.context.loop(payload_1, (user, loop) => {
         this.context.setOnFrame('user', user)
         this.context.setOnFrame('$loop', loop)
         this.context.setOnFrame('index', loop.key)
@@ -201,8 +206,9 @@ test.group('Tags | Each ', (group) => {
     return (function templateFn () {
       let out = new String()
       if (this.context.hasLength(this.context.resolve('users'))) {
+        const payload_1 = this.context.resolve('users')
         this.context.newFrame()
-        this.context.loop(this.context.resolve('users'), (user, loop) => {
+        this.context.loop(payload_1, (user, loop) => {
           this.context.setOnFrame('user', user)
           this.context.setOnFrame('$loop', loop)
           out += \`  \${this.context.escape(this.context.accessChild(this.context.resolve('user'), ['username']))}\\n\`
@@ -235,4 +241,33 @@ test.group('Tags | Each ', (group) => {
     }).run()
     assert.equal(output.trim(), '<p> No users found </p>')
   })
+
+  test('parse nested loop', (assert) => {
+    const statement = dedent`
+    @each(users in usersGroup)
+      @each(user in users)
+        {{ user.username }}
+      @endeach
+    @else
+      <p> No users found </p>
+    @endeach
+    `
+    const template = new Template(this.tags).compileString(statement)
+    this.tags.each.run(Context)
+
+    const users = [{username: 'virk'}, {username: 'nikk'}]
+
+    const ctx = new Context('', {
+      usersGroup: _.chunk(users, 2)
+    })
+
+    const output = new TemplateRunner(template, {
+      context: ctx
+    }).run()
+
+    assert.equal(output.trim(), dedent`
+    virk
+        nikk
+    `)
+  })
 })