diff --git a/core/src/utils/input-shims/hacks/scroll-assist.ts b/core/src/utils/input-shims/hacks/scroll-assist.ts index 88aaf52a9c..63a1983a76 100644 --- a/core/src/utils/input-shims/hacks/scroll-assist.ts +++ b/core/src/utils/input-shims/hacks/scroll-assist.ts @@ -61,15 +61,32 @@ const jsSetFocus = ( relocateInput(componentEl, inputEl, true, scrollData.inputSafeY); inputEl.focus(); - // scroll the input into place - contentEl.scrollByPoint(0, scrollData.scrollAmount, scrollData.scrollDuration).then(() => { - // the scroll view is in the correct position now - // give the native text input focus - relocateInput(componentEl, inputEl, false, scrollData.inputSafeY); + /* tslint:disable-next-line */ + if (typeof window !== 'undefined') { + let scrollContentTimeout: any; + const scrollContent = async () => { + // clean up listeners and timeouts + if (scrollContentTimeout !== undefined) { + clearTimeout(scrollContentTimeout); + } + window.removeEventListener('resize', scrollContent); - // ensure this is the focused input - inputEl.focus(); - }); + // scroll the input into place + await contentEl.scrollByPoint(0, scrollData.scrollAmount, scrollData.scrollDuration); + + // the scroll view is in the correct position now + // give the native text input focus + relocateInput(componentEl, inputEl, false, scrollData.inputSafeY); + + // ensure this is the focused input + inputEl.focus(); + }; + + window.addEventListener('resize', scrollContent); + + // fallback in case resize never fires + scrollContentTimeout = setTimeout(scrollContent, 1000); + } }; const hasPointerMoved = (threshold: number, startCoord: PointerCoordinates | undefined, endCoord: PointerCoordinates | undefined) => { diff --git a/core/src/utils/input-shims/input-shims.ts b/core/src/utils/input-shims/input-shims.ts index 860356dc9a..e811215724 100644 --- a/core/src/utils/input-shims/input-shims.ts +++ b/core/src/utils/input-shims/input-shims.ts @@ -23,8 +23,12 @@ export const startInputShims = (config: Config) => { const hideCaretMap = new WeakMap void>(); const scrollAssistMap = new WeakMap void>(); - const registerInput = (componentEl: HTMLElement) => { - const inputEl = (componentEl.shadowRoot || componentEl).querySelector('input') || (componentEl.shadowRoot || componentEl).querySelector('textarea'); + const registerInput = async (componentEl: HTMLElement) => { + if ((componentEl as any).componentOnReady) { + await (componentEl as any).componentOnReady(); + } + const inputRoot = componentEl.shadowRoot || componentEl; + const inputEl = inputRoot.querySelector('input') || inputRoot.querySelector('textarea'); const scrollEl = componentEl.closest('ion-content'); if (!inputEl) {