Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

3-level inheritance not working #275

Open
marc-medley opened this issue Apr 4, 2019 · 7 comments
Open

3-level inheritance not working #275

marc-medley opened this issue Apr 4, 2019 · 7 comments

Comments

@marc-medley
Copy link

Issue

Grandchild blocks do not replace the Parent/Grandparent blocks. Appears that inheritance is not working as expected.

Given

base.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset=utf-8/>
    {% block baseHeadBlock %}{% endblock %}
    <!-- Custom styles overriding CSS -->
    <link rel="stylesheet" href="/styles/app.css"/>    
    <title>{% block baseTitleBlock %}{{ baseTitleKey|default:"Base Title" }}{% endblock %}</title>
</head>
<body>
    {% block baseBodyBlock %}
    <p><em>Stencil "base.html"</em></p>
    {% endblock %}
</body>
</html>

latexmath_base.html

{% extends "base.html" %}

{% block baseHeadBlock %}
    <!-- MathJax: https://www.mathjax.org/#gettingstarted -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-MML-AM_CHTML" async></script>
{% endblock %}

{% block baseTitleBlock %}-{{titleKey}}-{% endblock %}

{% block baseBodyBlock %}
{{bodyKey}}
<p><em>Stencil "latexmath_base.html"</em></p>
{% endblock %}

latexmath_inline.html

{% extends "latexmath_base.html" %}

{% block baseTitleBlock %}Stencil Math Inline{% endblock %}

{% block baseBodyBlock %}
<p>Two equations: \(A^T_S = B\) and \(\sqrt{ab}\).</p>
<p>\[A^T_S = B\]  </p>
<p>\[\sqrt{ab}\]  </p>

<p><em>Stencil "latexmath_inline.html"</em></p>
{% endblock %}

Expected

Expected the rendered page to contain Stencil "latexmath_inline.html"

Actual Result

The rendered page instead contained Stencil "latexmath_base.html"

Setup

The test harness that i'm working with is posted at VaporExamplesLab/eval-vapor-leaf-stencil

@dillan
Copy link

dillan commented Sep 5, 2019

I'm running into this as well. @kylef @ilyapuchka @djbe Is this expected behavior?

@kevinrenskers
Copy link

Same problem here, but this issue seems dead. Is this project still alive?

@kylef
Copy link
Collaborator

kylef commented Jan 29, 2021

Is this expected behaviour?

I don't think this is expected.


As far as I can tell from the test suite, this would appear to be working: https://github.com/stencilproject/Stencil/blob/22440c5/Tests/StencilTests/InheritanceSpec.swift#L21-L25 which expects Super_Header Child_Header Child_Child_Header\nChild_Body by rendering child-child.html which extends child.html which extends base.html:

https://github.com/stencilproject/Stencil/blob/22440c5/Tests/StencilTests/fixtures/base.html
https://github.com/stencilproject/Stencil/blob/22440c5/Tests/StencilTests/fixtures/child.html
https://github.com/stencilproject/Stencil/blob/22440c5/Tests/StencilTests/fixtures/child-child.html

@kevinrenskers If you compare what you have to this test, is there anything in particular that stands out as a difference use-case?

@kevinrenskers
Copy link

base.html:

<html>
  <head>
    <title>{% block title %}{% endblock %}</title>
    <link rel="stylesheet" href="/static/style.css" />
  </head>
  <body>
    {% block content %}{% endblock %}
  </body>
</html>

articles.html:

{% extends "base.html" %}

{% block title %}Articles{% endblock %}

{% block content %}
<h1>Articles</h1>
{% for page in pages %}
<a href="{{ page | url }}">{{ page.title }}</a><br/>
{{ page.summar }}
{% endfor %}
{% endblock %}

year.html:

{% extends "articles.html" %}

{% block title %}Articles in {{ year }}{% endblock %}

When I render the year.html template I would expect that the title would be "Articles in 2021" for example, but it's always just "Articles".

@marc-medley
Copy link
Author

marc-medley commented Jan 30, 2021

@kylef The outer contructs in base.html of both my and @kevinrenskers examples are not Stencil {% … %} patterns. The failing examples have HTML tags <!DOCTYPE html><html lang="en"><head> and <html><head> at the outermost starting point.

There may be other differentiating aspects. The above is just the first difference I
noticed in the base.html files.

@kevinrenskers
Copy link

It seems to me that the big difference is that our examples don't use super within a block. We want to completely replace the contents of the grandparent block.

@kevinrenskers
Copy link

I find a workaround but it's a bit annoying 😅

base.html:

<html>
  <head>
    <title>{% block title %}{% endblock %}</title>
    <link rel="stylesheet" href="/static/style.css" />
  </head>
  <body>
    {% block content %}{% endblock %}
  </body>
</html>

articles.html:

{% extends "base.html" %}
{% block title %}{% block childtitle %}Articles{% endblock %}{% endblock %}

year.html:

{% extends "articles.html" %}
{% block childtitle %}Articles in {{ year }}{% endblock %}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants