Plan to implement {{block.super}}

Hello, thanks for your hard works! currently I’m using nunjucks in our frontend project(mock server with express), but I have a plan to migrate to liquidjs instead, because our Backend is also using liquid, some of their syntax differencies bother me a lot because each time I have to manually adjust nunjucks templates to standard liquid syntax before sending them to backend developers, I have searched a lot and finally found liquidjs, really amazing, but I really miss the {{block.super}} syntax, since we have already supported “block”, I would like to know do we have some plan to implement it as well? It would be a huge benefit and I think some others might also have the same question as me 😃

[rdmurphy]

Hello @harttle! 👋 I was hunting around to see if this feature had already been mentioned and ended up here.

I do wonder if this is something that may be reconsidered (AFAICT it still does not exist in Ruby Liquid). However, I do think the value of having something like {{ block.super }} may have been a little muddled back in 2017.

As it exists in Django, {{ block.super }} is a way to tap into the contents of a block as it exists in a parent layout without overriding it, but it does not attempt to mix the parent or child scopes. As explained here in Django docs (emphasis mine):

If you need to get the content of the block from the parent template, the {{ block.super }} variable will do the trick. This is useful if you want to add to the contents of a parent block instead of completely overriding it. Data inserted using {{ block.super }} will not be automatically escaped (see the next section), since it was already escaped, if necessary, in the parent template.

(This also exists in the Jinja2-inspired Nunjucks as the {{ super() }} function.)

What I’ve commonly used this to do is append or prepend markup that has been defined in a parent layout’s block without overriding it. A good example of this with CSS linking:

Parent layout: base.html

{% block css %}
<link href="base.css" rel="stylesheet">
{% endblock css %}

Child page: index.html

{% layout "base.html" %}

{% block css %}
{{ block.super }}
<link href="extra.css" rel="stylesheet">
{% endblock css %}

Output

<link href="base.css" rel="stylesheet">
<link href="extra.css" rel="stylesheet">

What’s nice about this is you can define some defaults or base values in a block that the inheriting template can choose to overwrite or add to as needed. As provided in the two scenarios I am familiar with (Django and Nunjucks) there is never the intention that the parent and child pages’ scopes combine or interact in any way — either the as-rendered contents of the parent page’s block is rendered as-is where {{ block.super }} was called, or it’s overwritten by the contents of the child page’s contents of the block.

I believe this is can be very helpful for defining blocks in a parent layout with smart defaults that a child page can augment instead of completely overwrite (or as it often happens, content that appeared in the parent’s block gets copy-pasted to the child page’s block because it needed the exact same content + an extra line on the end).

[harttle]

Now supported on @9.20.0, thank you guys.