From a13f5e44a676b2be3b0d338daf7df0d6938582e2 Mon Sep 17 00:00:00 2001 From: Andreas Reinhold / reini Date: Mon, 14 Sep 2026 06:14:40 +0200 Subject: [PATCH] Wait for the search view's ref before watching it Alpine registers x-ref as it walks the children, so $refs.view is not there yet when the component's init() runs. Plan step 13, finding IN-01. Co-Authored-By: Claude Fable 5.1 Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9 --- resources/js/search.js | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/resources/js/search.js b/resources/js/search.js index 97267e40..7342cb5a 100644 --- a/resources/js/search.js +++ b/resources/js/search.js @@ -43,8 +43,11 @@ document.addEventListener('alpine:init', () => { this.compact = query.matches query.addEventListener('change', (event) => (this.compact = event.matches)) - this.observer = new MutationObserver(() => this.countLater()) - this.observer.observe(this.$refs.view, { childList: true, subtree: true, characterData: true }) + // Alpine registers x-ref as it walks the children, which is after this runs. + this.$nextTick(() => { + this.observer = new MutationObserver(() => this.countLater()) + this.observer.observe(this.$refs.view, { childList: true, subtree: true, characterData: true }) + }) this.$watch('open', () => this.countLater()) }, @@ -60,7 +63,7 @@ document.addEventListener('alpine:init', () => { }, count() { - if (! this.open) { + if (! this.open || ! this.$refs.view) { this.announcement = '' return