fix: preserve shopping list scroll position #1

Merged

exler merged 1 commit from fix/shopping-list-scroll-position into main

2026-08-31 19:49:10 +02:00

camila commented

2026-08-31 18:32:38 +02:00

Collaborator

Summary

Fix the shopping list scrolling to the bottom when checking/unchecking or removing an item on some Android/Chrome phones (reproduced on Samsung + Chrome; Pixel + Firefox was unaffected).
Blur the toggle, remove, and "Clear checked items" buttons on click, before their HTMX response OOB-swaps the board.

Root cause

Checking an item re-renders the whole shopping board through an out-of-band HTMX swap. On Chrome, when the currently-focused element is removed by that swap and other focusable controls remain on the page — every row's hidden edit form has a <select name="category"> — the browser's focus-fixup logic hunts for a new place to focus/scroll and lands at the bottom of the page. Firefox doesn't do this, which is why it only reproduced on Chrome. This matches a known Chromium bug reported upstream against htmx: https://github.com/bigskysoftware/htmx/issues/3340.

Fix

Blur the button in its onclick, before the request fires, so there's no focused element left for Chrome to re-anchor to when the swap lands. No JS, no stable IDs, no scroll-anchor bookkeeping needed.

Verification

djlint on the three changed templates
Manual QA

## Summary - Fix the shopping list scrolling to the bottom when checking/unchecking or removing an item on some Android/Chrome phones (reproduced on Samsung + Chrome; Pixel + Firefox was unaffected). - Blur the toggle, remove, and "Clear checked items" buttons on click, before their HTMX response OOB-swaps the board. ## Root cause Checking an item re-renders the whole shopping board through an out-of-band HTMX swap. On Chrome, when the currently-focused element is removed by that swap and other focusable controls remain on the page — every row's hidden edit form has a `<select name="category">` — the browser's focus-fixup logic hunts for a new place to focus/scroll and lands at the bottom of the page. Firefox doesn't do this, which is why it only reproduced on Chrome. This matches a known Chromium bug reported upstream against htmx: https://github.com/bigskysoftware/htmx/issues/3340. ## Fix Blur the button in its `onclick`, before the request fires, so there's no focused element left for Chrome to re-anchor to when the swap lands. No JS, no stable IDs, no scroll-anchor bookkeeping needed. ## Verification - djlint on the three changed templates - Manual QA

camila added 1 commit

2026-08-31 18:32:38 +02:00