Shortcode arguments not passed correctly when called from liquid layout

[lexoyo]

Hello

Thank you for this great tool, we do good and things with it (social and environmental) and I have a lot of fun 🙏

Describe the bug

When using shortcodes in liquid, the parameters are not passed correctly to the js function

To Reproduce

$ git clone git@github.com:11ty/eleventy-base-blog.git
$ cd eleventy-base-blog
$ npm i && npm start

Then in another terminal window

$ echo '{% image "NJK", "arg2", "arg3", "arg4", "arg5", "arg6", "arg7", "arg8", "arg9" %}' > _includes/layouts/post.njk
$ echo '{% image "LIQUID", "arg2", "arg3", "arg4" "arg5" "arg6" "arg7" "arg8" "arg9" %}' > _includes/layouts/post.liquid

In .eleventy.js I add this line: eleventyConfig.addShortcode("image", (...args) => console.log('image', args));

The output at this stage is correct:

image [
  'NJK', 'arg2',
  'arg3',    'arg4',
  'arg5',    'arg6',
  'arg7',      'arg8',
  'arg9'
]
image [
  'NJK', 'arg2',
  'arg3',    'arg4',
  'arg5',    'arg6',
  'arg7',      'arg8',
  'arg9'
]
image [
  'NJK', 'arg2',
  'arg3',    'arg4',
  'arg5',    'arg6',
  'arg7',      'arg8',
  'arg9'
]
image [
  'NJK', 'arg2',
  'arg3',    'arg4',
  'arg5',    'arg6',
  'arg7',      'arg8',
  'arg9'
]
image [
  'NJK', 'arg2',
  'arg3',    'arg4',
  'arg5',    'arg6',
  'arg7',      'arg8',
  'arg9'
]

In posts/firstpost.md I set layout to layouts/post.liquid, then the output is still correct

image [
  'NJK', 'arg2',
  'arg3',    'arg4',
  'arg5',    'arg6',
  'arg7',      'arg8',
  'arg9'
]
image [
  'NJK', 'arg2',
  'arg3',    'arg4',
  'arg5',    'arg6',
  'arg7',      'arg8',
  'arg9'
]
image [
  'NJK', 'arg2',
  'arg3',    'arg4',
  'arg5',    'arg6',
  'arg7',      'arg8',
  'arg9'
]
image [
  'NJK', 'arg2',
  'arg3',    'arg4',
  'arg5',    'arg6',
  'arg7',      'arg8',
  'arg9'
]
image [ 'LIQUID', 'arg2', 'arg3', 'arg4', 'arg5', 'arg6', 'arg7', 'arg8', 'arg9' ]

Finally in posts/secondpost.md I set layout to layouts/post.liquid, then the output is NOT correct anymore

image [
  'NJK', 'arg2',
  'arg3',    'arg4',
  'arg5',    'arg6',
  'arg7',      'arg8',
  'arg9'
]
image [
  'NJK', 'arg2',
  'arg3',    'arg4',
  'arg5',    'arg6',
  'arg7',      'arg8',
  'arg9'
]
image [
  'NJK', 'arg2',
  'arg3',    'arg4',
  'arg5',    'arg6',
  'arg7',      'arg8',
  'arg9'
]
image [ 'LIQUID', 'arg2', 'arg4', 'arg6', 'arg8' ]
image [ 'LIQUID', 'arg3', 'arg5', 'arg7', 'arg9' ]

Expected behavior

The arguments should be passed 2 times the same and the output would be

image [ 'LIQUID', 'arg2', 'arg3', 'arg4', 'arg5', 'arg6', 'arg7', 'arg8', 'arg9' ]
image [ 'LIQUID', 'arg2', 'arg3', 'arg4', 'arg5', 'arg6', 'arg7', 'arg8', 'arg9' ]

instead of

image [ 'LIQUID', 'arg2', 'arg4', 'arg6', 'arg8' ]
image [ 'LIQUID', 'arg3', 'arg5', 'arg7', 'arg9' ]

Environment:

• OS and Version: Linux
• Eleventy Version: 1.0.1

Additional context
If I add one more page using the liquid template it outputs something like this

image [ 'LIQUID', 'arg4', 'arg7' ]
image [ 'LIQUID', 'arg2', 'arg5', 'arg8' ]
image [ 'LIQUID', 'arg3', 'arg6', 'arg9' ]

[pdehaan]

Interesting. I can reproduce in 1.0.0 and 1.0.1 when using a smaller test case: https://github.com/pdehaan/11ty-2348

But it only seems to happen when using Liquid, and only from a layout file. If I use the shortcode directly in my template it seems to pass all attributes.

[denisenadal]

I'm experiencing the same issue and was banging my head against the desk trying to figure out why my shortcode worked on one page, and different variables would be display as "undefined" on rendered pages that used the exact same data. Turns out it was exactly the behavior @pdehaan described. The variables are passed through correctly on page files, but get lost when the shortcode is called on a layout file.

With a bit more playing around, I discovered that shortcode will work in layout files if its in an include file, so a hacky work around is to move your shortcode call into an include file and call the include from your layout file.

_layouts/myLayout.html

{% include 'myshortcode.html' %}

_includes/myshortcode.html

{% shortcodeName var1 var2 var3 var4 %}

[epelc]

We just ran into this and are seeing random invocations of the same shortcode get variables passed in as undefined despite actually passing in values. Also seem to just be seeing this in layout files for some reason.

On eleventy 1.0.1 and also doesn't work on 2.0.0-canary.8

[epelc]

Did some digging and looks like duplicate of #2154

[zachleat]

Fixed by #2367. Thank you @epelc!

Release versions here: #2367 (comment)