From 6d002b4d1a3d0355107e36f160273669327f0e59 Mon Sep 17 00:00:00 2001
From: IRHM <37304121+IRHM@users.noreply.github.com>
Date: Fri, 27 Oct 2023 20:10:08 +0100
Subject: [PATCH 1/4] nav: add ? operator to classList usage

when chrome doesnt focus input and you press space, it will scroll down, for some reason that will fail too.
---
 src/routes/(app)/+layout.svelte | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/routes/(app)/+layout.svelte b/src/routes/(app)/+layout.svelte
index f6236b40..ed16a602 100644
--- a/src/routes/(app)/+layout.svelte
+++ b/src/routes/(app)/+layout.svelte
@@ -171,9 +171,9 @@
       let scroll = window.scrollY;
       window.document.addEventListener("scroll", (ev: Event) => {
         if (scroll > window.scrollY) {
-          navEl.classList.remove("scrolled-down");
+          navEl?.classList.remove("scrolled-down");
         } else {
-          navEl.classList.add("scrolled-down");
+          navEl?.classList.add("scrolled-down");
           subMenuShown = false;
           filterMenuShown = false;
           sortMenuShown = false;

From 5dce12c73b5f59db8c1853e4772669aa9aa63a73 Mon Sep 17 00:00:00 2001
From: IRHM <37304121+IRHM@users.noreply.github.com>
Date: Fri, 27 Oct 2023 21:11:51 +0100
Subject: [PATCH 2/4] nav: fix searchbar un-focusing on chrome

autofocus fixes this for us now, we won't use it anywhere else.
---
 src/routes/(app)/+layout.svelte | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/routes/(app)/+layout.svelte b/src/routes/(app)/+layout.svelte
index ed16a602..94390819 100644
--- a/src/routes/(app)/+layout.svelte
+++ b/src/routes/(app)/+layout.svelte
@@ -191,7 +191,16 @@
     <span class="large">Watcharr</span>
     <span class="small">W</span>
   </a>
-  <input type="text" placeholder="Search" bind:value={$searchQuery} on:keydown={handleSearch} />
+  <!-- autofocus fixes the searchbar un-focusing after search loads bug on chromium #169 -->
+  <!-- svelte-ignore a11y-autofocus -->
+  <input
+    id="nav-searchbar"
+    type="text"
+    placeholder="Search"
+    bind:value={$searchQuery}
+    on:keydown={handleSearch}
+    autofocus
+  />
   <div class="btns">
     <!-- Only show on watched list -->
     {#if $page.url?.pathname === "/"}

From 866432d22e5278359816667869b38ecf0865ee10 Mon Sep 17 00:00:00 2001
From: IRHM <37304121+IRHM@users.noreply.github.com>
Date: Fri, 27 Oct 2023 21:13:51 +0100
Subject: [PATCH 3/4] Revert "nav: fix searchbar un-focusing on chrome"

This reverts commit 5dce12c73b5f59db8c1853e4772669aa9aa63a73.
---
 src/routes/(app)/+layout.svelte | 11 +----------
 1 file changed, 1 insertion(+), 10 deletions(-)

diff --git a/src/routes/(app)/+layout.svelte b/src/routes/(app)/+layout.svelte
index 94390819..ed16a602 100644
--- a/src/routes/(app)/+layout.svelte
+++ b/src/routes/(app)/+layout.svelte
@@ -191,16 +191,7 @@
     <span class="large">Watcharr</span>
     <span class="small">W</span>
   </a>
-  <!-- autofocus fixes the searchbar un-focusing after search loads bug on chromium #169 -->
-  <!-- svelte-ignore a11y-autofocus -->
-  <input
-    id="nav-searchbar"
-    type="text"
-    placeholder="Search"
-    bind:value={$searchQuery}
-    on:keydown={handleSearch}
-    autofocus
-  />
+  <input type="text" placeholder="Search" bind:value={$searchQuery} on:keydown={handleSearch} />
   <div class="btns">
     <!-- Only show on watched list -->
     {#if $page.url?.pathname === "/"}

From d0a964775e900b355b43d9fd9e8bd74ec00f6e60 Mon Sep 17 00:00:00 2001
From: IRHM <37304121+IRHM@users.noreply.github.com>
Date: Fri, 27 Oct 2023 21:30:19 +0100
Subject: [PATCH 4/4] nav: fix search unfocusing on chromium

---
 src/routes/(app)/+layout.svelte | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/src/routes/(app)/+layout.svelte b/src/routes/(app)/+layout.svelte
index ed16a602..af7b4392 100644
--- a/src/routes/(app)/+layout.svelte
+++ b/src/routes/(app)/+layout.svelte
@@ -59,8 +59,14 @@
         const query = target?.value.trim();
         if (!query) return;
         if (query) {
+          // Enable autofocus before running `goto` because on chromium
+          // the .focus() call won't work, even after a timeout.
+          // Using autofocus seems to work. Disables after goto runs.
+          // https://github.com/sbondCo/Watcharr/issues/169
+          target.autofocus = true;
           goto(`/search/${query}`).then(() => {
             target?.focus();
+            target.autofocus = false;
           });
         }
       },