Reusable Templates Example renders invalid html
silkentrance opened this issue · comments
Source can be found in the official documentation under
https://ultraq.github.io/thymeleaf-layout-dialect/Examples.html#reusable-templates
%TEMPLATE_MODE HTML
%INPUT
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">
<div layout:replace="Modal2 :: modal(modalId='message', modalHeader='Message')">
<p layout:fragment="modal-content">Message goes here!</p>
</div>
</html>
%INPUT[Modal2]
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">
<body>
<div layout:fragment="modal(modalId, modalHeader)" th:id="${modalId} + '-container'" class="modal-container">
<section th:id="${modalId}" class="modal">
<header>
<h1 th:text="${modalHeader}">My Modal</h1>
<div th:id="'close-' + ${modalId}" class="modal-close">
<a href="#close">Close</a>
</div>
</header>
<div th:id="${modalId} + '-content'" class="modal-content">
<div layout:fragment="modal-content">
<p>My modal content</p>
</div>
</div>
</section>
</div>
</body>
</html>
%OUTPUT
<!DOCTYPE html>
<html>
<div id="message-container" class="modal-container">
<section id="message" class="modal">
<header>
<h1>Message</h1>
<div id="close-message" class="modal-close">
<a href="#close">Close</a>
</div>
</header>
<div id="message-content" class="modal-content">
<p>Message goes here!</p>
</div>
</section>
</div>
</html>
in order to overcome this, one needs to add the body element to the input template, e.g.
<html xmlns:th="http://www.thymeleaf.org"
xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">
<body>
<div layout:replace="Modal2 :: modal(modalId='message', modalHeader='Message')">
<p layout:fragment="modal-content">Message goes here!</p>
</div>
</body>
</html>
Thanks for pointing this out! I swear someone else found something similar a while ago (example in docs not working exactly as advertized) - I should find some time to double-check that the examples are still as in the test files.