perf(overlay): prevent layout thrashing

ionic-team · Aug 19, 2018 · ed5c8eb · ed5c8eb
1 parent ea1c3d4
commit ed5c8eb
Showing 1 changed file with 8 additions and 6 deletions.
diff --git a/core/src/utils/overlays.ts b/core/src/utils/overlays.ts
@@ -100,12 +100,6 @@ async function overlayAnimation(
   baseEl: HTMLElement,
   opts: any
 ): Promise<void> {
-  if (overlay.keyboardClose) {
-    const activeElement = baseEl.ownerDocument.activeElement as HTMLElement;
-    if (activeElement) {
-      activeElement.blur();
-    }
-  }
   if (overlay.animation) {
     overlay.animation.destroy();
     overlay.animation = undefined;
@@ -117,6 +111,14 @@ async function overlayAnimation(
   if (!overlay.willAnimate) {
     animation.duration(0);
   }
+  if (overlay.keyboardClose) {
+    animation.beforeAddWrite(() => {
+      const activeElement = baseEl.ownerDocument.activeElement as HTMLElement;
+      if (activeElement && activeElement.matches('input, ion-input, ion-textarea')) {
+        activeElement.blur();
+      }
+    });
+  }
   await animation.playAsync();
 
   animation.destroy();