billboard applets: single-root wrapper for HTMX swap; full context on toggle — TDD
- _applets.html wraps menu + container in one #id_billboard_applets_wrapper div; form's hx-target is now the wrapper, so OK no longer leaves a stale duplicate menu in the DOM (which previously caused the next OK to revert prior toggles) - toggle_billboard_applets passes full context (recent_room, recent_events, viewer, my_rooms) via factored _billboard_context helper, so Most Recent + My Scrolls keep their content after a toggle instead of falling through to the empty fallback - applets.js: register id_billboard_applets_wrapper as an applet container so post-swap menu cleanup runs - BillboardAppletsTest: portrait viewport in setUp; FT covers content preservation, no-revert on second toggle, & post-refresh state - 4 new ITs: Most Recent renders Coin-on-a-String after toggle; My Scrolls renders room name; response has single menu div; second toggle preserves prior hidden state Code architected by Disco DeDisco <discodedisco@outlook.com> Git commit message Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -1,27 +1,29 @@
|
||||
<div id="id_billboard_applet_menu" style="display:none;">
|
||||
<form
|
||||
hx-post="{% url "billboard:toggle_applets" %}"
|
||||
hx-target="#id_billboard_applets_container"
|
||||
hx-swap="outerHTML"
|
||||
>
|
||||
{% csrf_token %}
|
||||
{% for entry in applets %}
|
||||
<label>
|
||||
<input
|
||||
type="checkbox"
|
||||
name="applets"
|
||||
value="{{ entry.applet.slug }}"
|
||||
{% if entry.visible %}checked{% endif %}
|
||||
>
|
||||
{{ entry.applet.name }}
|
||||
</label>
|
||||
{% endfor %}
|
||||
<div class="menu-btns">
|
||||
<button type="submit" class="btn btn-confirm">OK</button>
|
||||
<button type="button" class="btn btn-cancel applet-menu-cancel">NVM</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div id="id_billboard_applets_container">
|
||||
{% include "apps/applets/_partials/_applets.html" %}
|
||||
<div id="id_billboard_applets_wrapper">
|
||||
<div id="id_billboard_applet_menu" style="display:none;">
|
||||
<form
|
||||
hx-post="{% url "billboard:toggle_applets" %}"
|
||||
hx-target="#id_billboard_applets_wrapper"
|
||||
hx-swap="outerHTML"
|
||||
>
|
||||
{% csrf_token %}
|
||||
{% for entry in applets %}
|
||||
<label>
|
||||
<input
|
||||
type="checkbox"
|
||||
name="applets"
|
||||
value="{{ entry.applet.slug }}"
|
||||
{% if entry.visible %}checked{% endif %}
|
||||
>
|
||||
{{ entry.applet.name }}
|
||||
</label>
|
||||
{% endfor %}
|
||||
<div class="menu-btns">
|
||||
<button type="submit" class="btn btn-confirm">OK</button>
|
||||
<button type="button" class="btn btn-cancel applet-menu-cancel">NVM</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div id="id_billboard_applets_container">
|
||||
{% include "apps/applets/_partials/_applets.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user