Claude
ff587d9e1b
Root cause: Wagtail's w-messages Stimulus controller only auto-clears messages added dynamically via JavaScript (the add() method). Server- rendered messages — the <li> elements produced by Django's messages framework after a redirect — have no connect() lifecycle handler and sit in the DOM indefinitely. PR #64 added data-w-messages-auto-clear-value="8000" which correctly handles dynamic messages, but server-rendered ones were unaffected. PR #64 also added {% ifchanged %} for de-duplication, which doesn't address persistence. Fix: mark server-rendered <li> elements with data-server-rendered and add an inline script that removes them after 8 seconds (matching the auto-clear timeout for dynamic messages). Also remove the ineffective {% ifchanged %} de-duplication. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
68 lines
3.7 KiB
HTML
68 lines
3.7 KiB
HTML
{% extends "wagtailadmin/admin_base.html" %}
|
|
{% load wagtailadmin_tags wagtailcore_tags i18n %}
|
|
|
|
{% block furniture %}
|
|
<template data-wagtail-sidebar-branding-logo>{% block branding_logo %}{% endblock %}</template>
|
|
{% sidebar_props %}
|
|
<aside id="wagtail-sidebar" class="sidebar-loading" data-wagtail-sidebar aria-label="{% trans 'Sidebar' %}"></aside>
|
|
{% keyboard_shortcuts_dialog %}
|
|
<main class="content-wrapper w-overflow-x-hidden" id="main">
|
|
<div class="content">
|
|
{# Always show messages div so it can be appended to by JS #}
|
|
<div class="messages" role="status" data-controller="w-messages" data-action="w-messages:add@document->w-messages#add" data-w-messages-added-class="new" data-w-messages-show-class="appear" data-w-messages-show-delay-value="100" data-w-messages-auto-clear-value="8000">
|
|
<ul data-w-messages-target="container">
|
|
{% if messages %}
|
|
{% for message in messages %}
|
|
{% message_level_tag message as level_tag %}
|
|
<li class="{% message_tags message %}" data-server-rendered>
|
|
{% if level_tag == "error" %}
|
|
{% icon name="warning" classname="messages-icon" %}
|
|
{% elif message.extra_tags == "lock" %}
|
|
{% icon name="lock" classname="messages-icon" %}
|
|
{% elif message.extra_tags == "unlock" %}
|
|
{% icon name="lock-open" classname="messages-icon" %}
|
|
{% else %}
|
|
{% icon name=level_tag classname="messages-icon" %}
|
|
{% endif %}
|
|
{{ message }}
|
|
</li>
|
|
{% endfor %}
|
|
{% endif %}
|
|
</ul>
|
|
<template data-w-messages-target="template" data-type="success">
|
|
<li class="success">{% icon name="success" classname="messages-icon" %}<span></span></li>
|
|
</template>
|
|
<template data-w-messages-target="template" data-type="error">
|
|
<li class="error">{% icon name="warning" classname="messages-icon" %}<span></span></li>
|
|
</template>
|
|
<template data-w-messages-target="template" data-type="warning">
|
|
<li class="warning">{% icon name="warning" classname="messages-icon" %}<span></span></li>
|
|
</template>
|
|
</div>
|
|
|
|
{% comment %}
|
|
Wagtail's w-messages Stimulus controller only auto-clears messages
|
|
added dynamically via JavaScript (the add() method). Server-rendered
|
|
messages — the <li> elements above — have no connect() handler and
|
|
sit in the DOM forever. This script schedules their removal so they
|
|
auto-dismiss after the same timeout used for dynamic messages.
|
|
{% endcomment %}
|
|
<script>
|
|
(function () {
|
|
var items = document.querySelectorAll('[data-server-rendered]');
|
|
if (!items.length) return;
|
|
setTimeout(function () {
|
|
items.forEach(function (el) { el.remove(); });
|
|
var ul = document.querySelector('[data-w-messages-target="container"]');
|
|
if (ul && !ul.children.length) {
|
|
document.body.classList.remove('has-messages');
|
|
}
|
|
}, 8000);
|
|
})();
|
|
</script>
|
|
|
|
{% block content %}{% endblock %}
|
|
</div>
|
|
</main>
|
|
{% endblock %}
|