fix(notification): render body content, in every theme and both engines (#65)

[fsecada01]

Closes #65.

Notification was the only container-shaped component in the set that ignored body content. Every theme, both engines, rendered the scalar message prop and nothing else — so <c-cf.notification type="danger">{{ error }}</c-cf.notification> produced a correctly styled, correctly coloured, empty box. In cotton this failed silently; in JinjaX it raised MissingRequiredArgument, because message was a required {#def} parameter with nowhere for a body to land.

What changed

Ten templates — five themes × two engines — plus the cotton wrapper.

Cotton partials now render the body when one is present and fall back to message when it is not, each wrapped in that theme's own element (bulma bare, bootstrap/daisy <span>, fomantic <div class="content">, foundation <p>). The whole conditional stays on one physical line: the Django template language has no whitespace-control syntax, and djLint's reformat pass must not be given a chance to introduce whitespace that changes rendered bytes.

The cotton wrapper gains message="" in its <c-vars>. Without a default, django-cotton resolved a body-form call's message to the empty string — which is precisely how this rendered an empty box instead of erroring.

Jinja templates declare content="" and demote message to optional, so a body-only call is now valid. The signature only loosens; no existing call form changes.

A body that renders to nothing is not a body

django-cotton hands the partial nodelist.render(context) verbatim, so a paired tag whose body renders empty still supplies "\n " — truthy. A naive {% if slot %} would therefore suppress message for any caller writing a conditional body, which is this same bug with a new trigger. Both engines treat a whitespace-only body as absent (slot.strip / content|trim).

Foundation's <p> wraps the message, not the body

Broadening the content channel made an existing wrapper wrong. Foundation put the scalar in <p>{{ message }}</p>, which was correct while only a string could land there. A body is arbitrary markup, and the HTML parser closes an open paragraph on block content — verified in Chromium, not assumed: <div class="callout"><p><ul>…</ul></p></div> parses to <div class="callout"><p></p><ul>…</ul><p></p></div>, reparenting the body onto .callout and leaving two empty paragraphs for Foundation's own .callout > :first-child / > :last-child margin rules to match.

The <p> now wraps message alone, so the scalar form renders byte-identically to before. The same probe cleared the other four: fomantic's <div class="content"> and bootstrap/daisy's <span> keep a <ul> nested where written, and bulma has no wrapper. Only <p> restructures.

Escaping

The two operands of {{ content if content else message }} want opposite treatment and get it. JinjaX wraps slot content in Markup, so a body passes through the template's {% autoescape true %} block untouched; message is caller-supplied text and is still escaped. Both halves are asserted per theme rather than left to autoescape semantics.

Tests

tests/unit/test_notification_body.py — 67 tests covering the issue's four suggested cases across every theme and both engines, plus a drift guard asserting every shipped notification template references its body channel.

tests/e2e/test_bulma_cotton.py — three call forms through the real compiler. This tier exists in the PR deliberately: the bug survived three months because no tier that runs the django-cotton compiler looked at this component's content channel. The unit tier injects slot as raw context, and the integration tier never installs django_cotton at all, so its <c-cf.*> tags reach the response as literal text and its assertions pass on Django variable interpolation alone. A fix for #65 should not be validated only by the tiers that missed #65.

Both halves were mutation-checked: reverting the bulma partial to bare {{ message }} reddens only the body test; weakening slot.strip to slot reddens only the whitespace-fallback test. Neither mutation disturbed the other assertions.

Gates

2383 passed, 20 skipped (unit + integration) · 236 passed, 33 skipped (E2E, chromium) · ruff check/ruff format --check src tests clean · prek run --all-files clean, both djLint trees included.

Note on scope

Docs (docs/components.md) gained the content prop row and the escaping note. No consumer migration is required — this is purely additive to the prop contract.

🤖 Generated with Claude Code

https://claude.ai/code/session_01NhqNRBg83czKfr8L6FF5xf

[fsecada01]

Adversarial review — PR #66

Scope: the full PR diff (14 files, 5 themes × 2 engines + tests + docs + changelog).

One finding, confirmed and fixed in 8cb0994

Foundation's <p> could not hold the thing this PR just made it able to receive. Foundation wrapped the scalar in <p>{{ message }}</p>, and the first version of this fix widened that same <p> to hold the slot. A body is arbitrary markup, and the HTML parser closes an open paragraph on encountering block content. Verified in Chromium rather than asserted:

<div class="callout"><p><ul><li>Item</li></ul></p></div>
  parses to
<div class="callout"><p></p><ul><li>Item</li></ul><p></p></div>

The body is reparented onto .callout and two empty paragraphs are left behind — which Foundation's own .callout > :first-child / > :last-child margin rules then match instead of the content. No attribute or stylesheet prevents it; it is a parsing rule.

This is a defect the PR introduces, not a pre-existing one: while <p> could only ever hold a string, it was correct. Broadening the channel is what makes the wrapper wrong, which is exactly the class of thing worth catching before merge rather than in a consumer.

The same probe cleared the other four themes: fomantic's <div class="content"> and bootstrap/daisy's <span> both keep a <ul> nested where it was written, and bulma has no wrapper at all. Only <p> restructures.

Fixed by wrapping message alone — the scalar form renders byte-identically to before, and a body is emitted where the caller wrote it. Covered by test_{jinja,cotton}_body_is_not_wrapped_in_a_paragraph, plus a third test that derives the wrapper list from the shipped templates so a sixth theme choosing <p> cannot silently disable the first two. Restoring the <p> around the body reddens exactly those two tests and nothing else.

Checked and clear

The whitespace guard is load-bearing and correct. {% if slot.strip %} / {{ content if content|trim else message }}. django-cotton sets "slot": self.nodelist.render(context) verbatim, so a paired tag whose body renders to nothing still hands over "\n " — truthy. A naive {% if slot %} would drop message on the false branch of a conditional body, which is #65 again with a new trigger. Mutation-confirmed: weakening slot.strip to slot reddens only the whitespace-fallback tests.

The escaping asymmetry is right in both directions. {{ content if content|trim else message }} gives its two operands opposite treatment inside one {% autoescape true %} block — correct, because they are not alike: JinjaX wraps slot content in Markup so it passes through untouched, while message is caller-supplied text. Both halves asserted per theme, including that a message containing <script> still comes out escaped. Widening the body channel did not widen the text channel.

Backward compatibility holds on both engines. The JinjaX signature only loosens (message required → optional); the cotton wrapper only gains a default. No existing call form changes shape. The message=-form regression tests cover all five themes on all three render paths.

Django template-lexer constraints respected. The conditional stays on one physical line in every cotton partial — the DTL has no whitespace-control syntax, and djLint's reformat pass must not get a chance to insert whitespace that changes rendered bytes. Rationale comments use {% comment %}, not {# #}, which is single-line only. prek run --all-files is clean with both djLint trees included.

The content row in docs/components.md names a JinjaX prop, not a cotton one — in cotton the channel is the body, and content="x" would be silently discarded as an undeclared attribute. That is not a defect here: it matches the existing Cf:Modal row verbatim, it is the package-wide table convention for the slot channel, and the row's own text ("Body — the slot in template position") is the disambiguation. Noted rather than filed.

On the E2E tier in this PR

The three cotton call forms are asserted in E2E deliberately, and only for bulma. That is not thin coverage — the thing E2E adds here is whether django-cotton builds slot the way the fix assumes, which is theme-independent (the wrapper dispatches to a partial; the compiler does not know which). Per-theme typos in the conditional are what the 85 unit tests catch, on all five.

Worth stating plainly, because it is the actual lesson of #65: the bug survived three months in a real consumer because no tier that ran the compiler ever looked at this component's content channel. The unit tier injects slot as raw context, and the integration tier does not install django_cotton at all — its <c-cf.*> tags reach the response as literal text, and its existing assertions pass on Django variable interpolation alone. A fix for #65 should not be validated only by the tiers that missed #65.

Gates

2386 passed, 20 skipped (unit + integration) · 236 passed, 33 skipped (E2E, chromium, both js modes) · ruff check / ruff format --check src tests clean · prek run --all-files clean.

One note on the local toolchain, not on this diff: the ruff on PATH here is 0.6.4 and disagrees with the repo about formatting 10 files. The authoritative ones are prek's pinned v0.16.0 and .venv/Scripts/ruff.exe (0.16.1), which agree with each other and with CI. Same shape as the drift recorded in .pre-commit-config.yaml's comment, one layer out.