From bf1701ed39ee3895040ff741f45e215e2696143a Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Fri, 1 Mar 2024 12:21:36 -0500 Subject: [PATCH] fix(input-shims): disable input blurring util by default (#29104) Issue number: resolves #29072 --------- ## What is the current behavior? The input blurring utility is causing adverse side effects in developer applications by causing certain UI components to be blurred. This utility was [added back in 2017](https://github.com/ionic-team/ionic-v3/commit/c10f72b1e2614292e547c68f6f26515efb1cd691). That commit claims to fix a number of issues, but https://github.com/ionic-team/ionic-framework/issues/8933 and https://github.com/ionic-team/ionic-framework/issues/11484 seem most relevant here. While the purpose of this utility is not definitively known it appears that this was created to solve an issue on iOS where the searchbar was not being blurred when tapping outside of the input. The linked issues refer to cases where inputs are not blurred when they should be. This aligns with the input blurring utility behavior where it only blurs elements and never focuses them. Additionally, the two linked issues only happened on iOS which aligns with the default behavior of the input blurring utility which is to only be enabled on iOS. I tested the searchbar on iOS with this utility **disabled** and I was able to blur the searchbar by tapping outside the input. It seems that this utility was created to work around a WebKit issue that has since been resolved. https://github.com/ionic-team/ionic-framework/assets/2721089/7772688b-a0d4-476e-be72-931cc07cd93a ## What is the new behavior? - Given that I am not 100% sure that this utility does what I think it does, I'd like to propose we disable this feature by default starting in Ionic 8. This will resolve the linked issue but also give developers an escape hatch (by manually re-enabling it in their apps) if disabling the utility does cause issues. The team can evaluate remove the code altogether if disabling it does not have any known adverse side effects. ## Does this introduce a breaking change? - [ ] Yes - [x] No I don't consider this a breaking change because a) `inputBlurring` is a private API and b) there current thinking is that there should be no behavior change (other than the buggy behaviors going away) since this utility exists to solve a WebKit issue that no longer exists. ## Other information Dev build: `8.0.0-dev.11709245047.1565a499` --------- Co-authored-by: Amanda Johnston <90629384+amandaejohnston@users.noreply.github.com> --- core/src/utils/input-shims/input-shims.ts | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/core/src/utils/input-shims/input-shims.ts b/core/src/utils/input-shims/input-shims.ts index 5919a5fa1b..879fbfff87 100644 --- a/core/src/utils/input-shims/input-shims.ts +++ b/core/src/utils/input-shims/input-shims.ts @@ -33,7 +33,15 @@ export const startInputShims = async (config: Config, platform: 'ios' | 'android const keyboardHeight = config.getNumber('keyboardHeight', 290); const scrollAssist = config.getBoolean('scrollAssist', true); const hideCaret = config.getBoolean('hideCaretOnScroll', isIOS); - const inputBlurring = config.getBoolean('inputBlurring', isIOS); + + /** + * The team is evaluating if inputBlurring is still needed. As a result + * this feature is disabled by default as of Ionic 8.0. Developers are + * able to re-enable it temporarily. The team may remove this utility + * if it is determined that doing so would not bring any adverse side effects. + * TODO FW-6014 remove input blurring utility (including implementation) + */ + const inputBlurring = config.getBoolean('inputBlurring', false); const scrollPadding = config.getBoolean('scrollPadding', true); const inputs = Array.from(doc.querySelectorAll('ion-input, ion-textarea')) as HTMLElement[];