Fixed search initialization (7.3.2 regression)

material/base.html

@@ -225,7 +225,7 @@
       </script>
     {% endblock %}
     {% block scripts %}
-      <script src="{{ 'assets/javascripts/bundle.f89c2efe.min.js' | url }}"></script>
+      <script src="{{ 'assets/javascripts/bundle.1e84347e.min.js' | url }}"></script>
       {% for path in config["extra_javascript"] %}
         <script src="{{ path | url }}"></script>
       {% endfor %}

src/assets/javascripts/components/search/query/index.ts

@@ -34,6 +34,8 @@ import {
   filter,
   finalize,
   map,
+  shareReplay,
+  startWith,
   take,
   takeLast,
   takeUntil,
@@ -92,36 +94,43 @@ export function watchSearchQuery(
 ): Observable<SearchQuery> {
   const fn = __search?.transform || defaultTransform
 
+  /* Immediately show search dialog */
+  const { searchParams } = getLocation()
+  if (searchParams.has("q"))
+    setToggle("search", true)
+
+  /* Intercept query parameter (deep link) */
+  const param$ = rx$
+    .pipe(
+      filter(isSearchReadyMessage),
+      take(1),
+      map(() => searchParams.get("q") || "")
+    )
+
+  /* Set query from parameter */
+  param$.subscribe(value => { // TODO: not ideal - find a better way
+    if (value)
+      el.value = value
+  })
+
   /* Intercept focus and input events */
   const focus$ = watchElementFocus(el)
   const value$ = merge(
     fromEvent(el, "keyup"),
-    fromEvent(el, "focus").pipe(delay(1))
+    fromEvent(el, "focus").pipe(delay(1)),
+    param$
   )
     .pipe(
       map(() => fn(el.value)),
-      distinctUntilChanged()
+      startWith(""),
+      distinctUntilChanged(),
     )
 
-  /* Intercept deep links */
-  const location = getLocation()
-  if (location.searchParams.has("q")) {
-    setToggle("search", true)
-    rx$
-      .pipe(
-        filter(isSearchReadyMessage),
-        take(1)
-      )
-        .subscribe(() => {
-          el.value = location.searchParams.get("q")!
-          setElementFocus(el)
-        })
-  }
-
   /* Combine into single observable */
   return combineLatest([value$, focus$])
     .pipe(
-      map(([value, focus]) => ({ value, focus }))
+      map(([value, focus]) => ({ value, focus })),
+      shareReplay(1)
     )
 }
 

src/assets/javascripts/components/search/result/index.ts

@@ -102,7 +102,7 @@ export function mountSearchResult(
   const meta = getElementOrThrow(":scope > :first-child", el)
   const list = getElementOrThrow(":scope > :last-child", el)
 
-  /* Update search result metadata when ready */
+  /* Wait until search is ready */
   const ready$ = rx$
     .pipe(
       filter(isSearchReadyMessage),

src/assets/javascripts/components/search/suggest/index.ts

@@ -24,7 +24,8 @@ import {
   Observable,
   Subject,
   asyncScheduler,
-  fromEvent
+  fromEvent,
+  merge
 } from "rxjs"
 import {
   combineLatestWith,
@@ -88,7 +89,10 @@ export function mountSearchSuggest(
 
   /* Retrieve query component and track all changes */
   const query  = getComponentElement("search-query")
-  const query$ = fromEvent(query, "keydown")
+  const query$ = merge(
+    fromEvent(query, "keydown"),
+    fromEvent(query, "focus")
+  )
     .pipe(
       observeOn(asyncScheduler),
       map(() => query.value),