Behavior of widget changes when wrapped in block


#1

My team and I noticed some surprising behavior in HubL that I wanted to highlight.

We have two templates:

<!-- custom/page/layouts/test.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
  </head>
  <body>
    {% block defaults %}
      {% set say_hi = True %}
    {% endblock %}

    {% block magic %}
      {% boolean "say_hi_widget" value="{{ say_hi }}", no_wrapper=True, export_to_template_context=True %}
    {% endblock %}

    {% block main %}
    {% endblock %}
  </body>
</html>
<!-- custom/page/layouts/landing_pages/test_lander.html -->
{% extends "custom/page/layouts/test.html" %}

{% block defaults %}
  {% set say_hi = False %}
{% endblock %}

{% block main %}
  {% if widget_data.say_hi_widget.value %}
    <h1 id="results">HI! {{ widget_data.say_hi_widget.value }}</h1>
  {% endif %}
{% endblock %}

The motivation for this setup is so that we can override the default value of widgets. This helps for development with the local HubL server.

And, the above code works. That is, when I open custom/page/layouts/landing_pages/test_lander.html on the local server, the h1 with id=“results” is not shown.

Further, when I remove the defaults block from custom/page/layouts/landing_pages/test_lander.html, the h1 with id=“results” is shown and has contents: “Hi! true”.

The weird behavior is when I remove the magic block around the widget definition. Here’s a full example:

<!-- custom/page/layouts/test.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
  </head>
  <body>
    {% block defaults %}
      {% set say_hi = True %}
    {% endblock %}

    <!-- No more "magic" block around this widget definition -->
    {% boolean "say_hi_widget" value="{{ say_hi }}", no_wrapper=True, export_to_template_context=True %}

    {% block main %}
    {% endblock %}
  </body>
</html>
<!-- custom/page/layouts/landing_pages/test_lander.html -->
{% extends "custom/page/layouts/test.html" %}

{% block defaults %}
  {% set say_hi = False %}
{% endblock %}

{% block main %}
  {% if widget_data.say_hi_widget.value %}
    <h1 id="results">Hi! {{ widget_data.say_hi_widget.value }}</h1>
  {% endif %}
{% endblock %}

I expect the h1 with id=“results” not to show, but it does! And, the contents are “Hi! false”. Weird, right? Feels like a bug for that magic block to impact things in this way.