From 02bb968396dbccdb6c5907514915b91107c0134c Mon Sep 17 00:00:00 2001
From: Ryan Gossiaux <ryan.gossiaux@gmail.com>
Date: Tue, 14 Dec 2021 13:19:58 -0800
Subject: [PATCH] Fix initial focus issues with Dialog

Fixes #15
---
 .../components/focus-trap/FocusTrap.svelte    | 19 ++++++++++++++++---
 1 file changed, 16 insertions(+), 3 deletions(-)

diff --git a/src/lib/components/focus-trap/FocusTrap.svelte b/src/lib/components/focus-trap/FocusTrap.svelte
index 79f0623..af9dab3 100644
--- a/src/lib/components/focus-trap/FocusTrap.svelte
+++ b/src/lib/components/focus-trap/FocusTrap.svelte
@@ -7,7 +7,7 @@
     FocusResult,
   } from "$lib/utils/focus-management";
   import { contains } from "$lib/internal/dom-containers";
-  import { afterUpdate, onMount, onDestroy } from "svelte";
+  import { afterUpdate, onMount, onDestroy, tick } from "svelte";
 
   export let containers: Set<HTMLElement>;
   export let enabled: boolean = true;
@@ -20,7 +20,12 @@
 
   let previousActiveElement: HTMLElement | null = null;
 
-  function handleFocus() {
+  let initial = true;
+  async function handleFocus() {
+    if (initial) {
+      await tick();
+      initial = false;
+    }
     if (!enabled) return;
     if (containers.size !== 1) return;
     let { initialFocus } = options;
@@ -71,7 +76,14 @@
 
   afterUpdate(() => (enabled ? handleFocus() : restore()));
 
-  onDestroy(restore);
+  // When this component is being destroyed, focusElement is called
+  // before handleWindowFocus is removed, so in the svelte port we add this
+  // to ignore the handler.
+  let destroying = false;
+  onDestroy(() => {
+    destroying = true;
+    restore();
+  });
 
   // Handle Tab & Shift+Tab keyboard events
   function handleWindowKeyDown(event: KeyboardEvent) {
@@ -99,6 +111,7 @@
   function handleWindowFocus(event: FocusEvent) {
     if (!enabled) return;
     if (containers.size !== 1) return;
+    if (destroying) return;
 
     let previous = previousActiveElement;
     if (!previous) return;