mirror/crumbs-original
1
0
Fork 1
mirror of https://github.com/bretzel-app/crumbs.git synced 2026-10-12 12:06:57 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: defer contenteditable blur linkification to unblock mobile tap events

Browse Source 
When a contenteditable loses focus, the onblur handler immediately modified
innerHTML to linkify URLs. On mobile, this DOM mutation causes a layout reflow
between touchstart and click, making the browser cancel taps on the adjacent
delete button. Deferring via requestAnimationFrame ensures the click event
fires before the DOM is modified.

https://claude.ai/code/session_01VZceWPhHMHCA6SELBdCPfN
This commit is contained in:
Claude
2026-04-10 21:53:20 +02:00
committed by Fred Cabassut
parent 76b04549af
commit 86cfc8c5f6
1 changed files with 8 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/components/Checklist.svelte
+8 -1
View File
@@ -324,7 +324,14 @@
onkeydown={(e) => handleKeydown(e, item.id)}
onclick={handleLinkClick}
onpaste={handlePaste}
onblur={(e) => { (e.target as HTMLElement).innerHTML = linkifyText(item.text); }}
onblur={(e) => {
const el = e.target as HTMLElement;
requestAnimationFrame(() => {
if (el.isConnected && document.activeElement !== el) {
el.innerHTML = linkifyText(item.text);
}
});
}}
class="flex-1 min-w-0 bg-transparent text-sm outline-none break-words {item.checked ? 'text-[var(--text-muted)] line-through' : 'text-[var(--text)]'}"
data-placeholder="List item"
aria-placeholder="List item"