diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index b0e72dd5..d015a7c3 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -54,7 +54,9 @@
       await initPwa()
     }
 
-    if (browser && $userPreferences.autoConnect && (await canAutoConnect())) await initSerial()
+    if (browser && $userPreferences.autoConnect && (await canAutoConnect())) {
+      await initSerial()
+    }
   })
 
   let webManifestLink = ""
diff --git a/src/routes/Navigation.svelte b/src/routes/Navigation.svelte
index daca0281..39986b19 100644
--- a/src/routes/Navigation.svelte
+++ b/src/routes/Navigation.svelte
@@ -5,17 +5,19 @@
   import {popup} from "$lib/popup"
   import BackupPopup from "./BackupPopup.svelte"
   import ConnectionPopup from "./ConnectionPopup.svelte"
-  import {canAutoConnect} from "$lib/serial/device"
   import {browser} from "$app/environment"
   import {userPreferences} from "$lib/preferences"
   import {action} from "$lib/title"
   import LL from "../i18n/i18n-svelte"
   import ConfigTabs from "./ConfigTabs.svelte"
   import EditActions from "./EditActions.svelte"
+  import {onMount} from "svelte"
 
-  $: if (browser && !canAutoConnect()) {
-    connectButton?.click()
-  }
+  onMount(async () => {
+    if (browser && !$userPreferences.autoConnect) {
+      connectButton.click()
+    }
+  })
 
   let connectButton: HTMLButtonElement
 </script>