fix(electrobun): replace $effect scroll with MutationObserver in onMount
The $effect reading messages.length + requestAnimationFrame was a secondary cause of effect_update_depth_exceeded. MutationObserver is non-reactive — observes DOM changes directly without Svelte dependency tracking.
This commit is contained in:
parent
02560e341d
commit
9d45caa8df
1 changed files with 7 additions and 4 deletions
|
|
@ -1,4 +1,5 @@
|
|||
<script lang="ts">
|
||||
import { onMount } from 'svelte';
|
||||
import ChatInput from "./ChatInput.svelte";
|
||||
import type { AgentMessage, AgentStatus } from "./agent-store.svelte.ts";
|
||||
import { t } from "./i18n.svelte.ts";
|
||||
|
|
@ -37,12 +38,14 @@
|
|||
let agentPaneEl: HTMLDivElement;
|
||||
let isDragging = $state(false);
|
||||
|
||||
$effect(() => {
|
||||
void messages.length;
|
||||
// Use requestAnimationFrame instead of tick() to avoid effect re-entry cycle
|
||||
requestAnimationFrame(() => {
|
||||
// Auto-scroll on message change — done via onMount observer, NOT $effect
|
||||
// ($effect + messages.length + DOM mutation = infinite loop in Svelte 5)
|
||||
onMount(() => {
|
||||
const observer = new MutationObserver(() => {
|
||||
if (scrollEl) scrollEl.scrollTop = scrollEl.scrollHeight;
|
||||
});
|
||||
if (scrollEl) observer.observe(scrollEl, { childList: true, subtree: true });
|
||||
return () => observer.disconnect();
|
||||
});
|
||||
|
||||
function handleSend() {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue