From d2e7b1cb99422f8e08a392ca43ec4089164e0741 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Fri, 23 Jul 2021 18:54:56 +0000 Subject: [PATCH 1/2] fix race condition with deepReady --- core/src/utils/transition/index.ts | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/core/src/utils/transition/index.ts b/core/src/utils/transition/index.ts index 203d07d1608..21be7787872 100644 --- a/core/src/utils/transition/index.ts +++ b/core/src/utils/transition/index.ts @@ -2,7 +2,7 @@ import { Build, writeTask } from '@stencil/core'; import { LIFECYCLE_DID_ENTER, LIFECYCLE_DID_LEAVE, LIFECYCLE_WILL_ENTER, LIFECYCLE_WILL_LEAVE } from '../../components/nav/constants'; import { Animation, AnimationBuilder, NavDirection, NavOptions } from '../../interface'; -import { componentOnReady } from '../helpers'; +import { componentOnReady, raf } from '../helpers'; const iosTransitionAnimation = () => import('./ios.transition'); const mdTransitionAnimation = () => import('./md.transition'); @@ -205,6 +205,13 @@ export const deepReady = async (el: any | undefined): Promise => { if (stencilEl != null) { return; } + } else { + /** + * Non-lazy loaded custom elements need to wait + * one frame for component to be loaded. + */ + const waitForCustomElement = new Promise(resolve => raf(resolve)); + await waitForCustomElement; } await Promise.all(Array.from(element.children).map(deepReady)); } From 0c9be135906b6762427e75b35d4dfb50bb06fa68 Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Fri, 23 Jul 2021 15:14:57 -0400 Subject: [PATCH 2/2] perf improvement --- core/src/utils/transition/index.ts | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/core/src/utils/transition/index.ts b/core/src/utils/transition/index.ts index 21be7787872..5c7ca4fb7af 100644 --- a/core/src/utils/transition/index.ts +++ b/core/src/utils/transition/index.ts @@ -205,13 +205,19 @@ export const deepReady = async (el: any | undefined): Promise => { if (stencilEl != null) { return; } - } else { + + /** + * Custom elements in Stencil will have __registerHost. + */ + } else if (element.__registerHost != null) { /** * Non-lazy loaded custom elements need to wait * one frame for component to be loaded. */ const waitForCustomElement = new Promise(resolve => raf(resolve)); await waitForCustomElement; + + return; } await Promise.all(Array.from(element.children).map(deepReady)); }