apache / cordova-ios

Apache Cordova iOS
https://cordova.apache.org/
Apache License 2.0
2.15k stars 987 forks source link

Modal gets stuck in in-app browser - iOS 16.4 #1298

Closed pathik3098 closed 1 year ago

pathik3098 commented 1 year ago

Bug Report

Problem

we are using Cordova-ios 6.2.0 to create our iOS app. The issue is with the in-app browser feature in our mobile app in the iOS 16.4. This issue is not present in the previous stable iOS version, and our team has not made any recent changes to the code that would affect this feature.

What is expected to happen?

The modal should be present at top always while scrolling and editing text fields.

What does actually happen?

The problem is that modal is misplaced in the in-app browser.

To provide more detail, when a user clicks on a link within the in-app browser that should open a modal, the modal does appear but upon scrolling (intermittent) and inputting into text field (always) the modal is floating in the middle of the browser instead of attaching the top which it should be.

Also on one of the page, the page is rendered correctly but upon scrolling the bottom buttons becomes invisible but remains interactive. However, the button should always show at the bottom.

The app is working perfectly using safari browser on all iOS.

Information

Command or Code

Environment, Platform, Device

iOS 16.4

Version information

Checklist

Screenshot 2023-03-17 at 4 15 10 PM

TomasNesciokas commented 1 year ago

Hello, I'm wondering if this issue still persists despite the release of version 16.4 on March 27th?

pathik3098 commented 1 year ago

@TomasNesciokas Yes, it's still there

Gabriele-Baltrunaite commented 1 year ago

Similar issue appears on our cordova-ios app when running on iOS 16.4 through iOS 16.5 (beta release). The bottom menu 'disappears' if scrolled down, but seems to be still responsive - the buttons work on it. We are still using cordova-ios v4.5.5 but the issue only appeared from iOS16.4 upgrade.

appzer commented 1 year ago

i run in the same problem. Since iOS 16.4 also 16.5 beta > CSS position:fixed not work correctly. Is this a WebView issue?

Kevin

https://user-images.githubusercontent.com/3443312/229374748-0647e54e-4417-4ed6-bb24-2cd8108148b1.mov

dpogue commented 1 year ago

This sounds like a WebKit issue, and you should file it at https://bugs.webkit.org/ with a reproducible test case (and please share the link to the WebKit bug report here)

appzer commented 1 year ago

Done https://bugs.webkit.org/show_bug.cgi?id=254926

dpogue commented 1 year ago

@appzer Great! If you have the standalone page from your video available, attaching that to the WebKit ticket will let them investigate it more quickly.

pathik3098 commented 1 year ago

I have also created one. https://bugs.webkit.org/show_bug.cgi?id=254936.

Also, for me the issue is happening on in-app browser only. on safari it is working fine.

karlcow commented 1 year ago

It would be great if anyone of you could create a web page online reproducing the issue. That would help running a regression testing to pinpoint when the regression happened.

vita-it commented 1 year ago

We have a related issue in our app A can send you (personally) link with web App that works OK in iOs Safari, but after Cordova/XCode app build it is generally broken - and it is only in iOs 16.4 ( the same app version in previous iOs versions is working well)

UPD I have sent you the email (to addres from your profile)

appzer commented 1 year ago

It only affects the WebView that Cordova uses. Everything works fine in Safari!

dpogue commented 1 year ago

@appzer Can you share the HTML file from your video with the fixed position header?

appzer commented 1 year ago

@appzer Can you share the HTML file from your video with the fixed position header?

Attached you find a shortened version of the index.html

index.txt

It also makes no difference which HTML tag you use (div, span, table, p ...) always the same problem.

dpogue commented 1 year ago

I tried pulling that example into a simple WKWebView test case (without Cordova) here: https://github.com/dpogue/ios16.4-position-fixed

but I don't see the bug happening, on both iPhone 14 Pro (iOS 16.4) or iPhone SE 3rd gen (iOS 16.4) 😞

mnewc14 commented 1 year ago

I tried pulling that example into a simple WKWebView test case (without Cordova) here: https://github.com/dpogue/ios16.4-position-fixed

but I don't see the bug happening, on both iPhone 14 Pro (iOS 16.4) or iPhone SE 3rd gen (iOS 16.4) 😞

Can you try with UIWebView? Based on the testing i've done today, this seems to be specific to UIWebView

dpogue commented 1 year ago

Can you try with UIWebView? Based on the testing i've done today, this seems to be specific to UIWebView which is what Cordova uses out of the box

Cordova hasn't used UIWebView by default since 2019 when Apple updated requirements to use WKWebView.

mnewc14 commented 1 year ago

Just wanted to confirm the issue is specific to UIWebView. Can anyone else confirm what flavor of webview they are using?

pathik3098 commented 1 year ago

Just wanted to confirm the issue is specific to UIWebView. Can anyone else confirm what flavor of webview they are using?

I am using WKWebView.

vita-it commented 1 year ago

Can you try with UIWebView? Based on the testing i've done today, this seems to be specific to UIWebView which is what Cordova uses out of the box

Cordova hasn't used UIWebView by default since 2019 when Apple updated requirements to use WKWebView.

As I can see in Cordova source code (CDVUserAgentUtil.m, CDVUserAgentUtil.h) there are both WKWebView and UIWebView in if/else clause

(sorry, code formatting doesn't work for this code for some reason)

`if ((gOriginalUserAgent == nil) || cachedValueIsOld) {

if WK_WEB_VIEW_ONLY

        WKWebView* sampleWebView = [[WKWebView alloc] initWithFrame:CGRectZero];

else

        UIWebView* sampleWebView = [[UIWebView alloc] initWithFrame:CGRectZero];

endif

        gOriginalUserAgent = [sampleWebView stringByEvaluatingJavaScriptFromString:@"navigator.userAgent"];
        [userDefaults setObject:gOriginalUserAgent forKey:kCdvUserAgentKey];
        [userDefaults setObject:systemAndLocale forKey:kCdvUserAgentVersionKey];
        [userDefaults synchronize];
    }

`

vita-it commented 1 year ago

Hi everyone, problem partially solved for us.

1) What we had: The app worked well at iOs <16.4, and in 16.4 we faced a lot of elements positioning problems in the same app version.

WebApp based on Framework7 Cordova 11.0 iOs platform 5.1.1 - USES UIWebView by default - see https://cordova.apache.org/howto/2020/03/18/wkwebviewonly.html

So the app has been using old UIWebView instead of WKWebView

2) What we have done: Update iOs platform to latest version

cordova platform rm ios
cordova platform add ios

3) Result: the app started using WKWebView (confirmed by XCode logs)

The problem with Framework7 appeared in WKWebView - the blank screen instead application at the screen Solved with adding lines to config.xml

<preference name="scheme" value="app" />
<preference name="hostname" value="localhost" />

( solution from https://forum.framework7.io/t/cannot-open-page-on-ios/11793/3 )

4) Finally: we are still facing some css problems (as I can see - regarding z-index or position - ant this bug remails in iOs Safari too) but the most part of css problems disappeared (were caused by using deprecated UIWebView).

pathik3098 commented 1 year ago

Hi everyone,

Here is an update on the issue. we were using a custom plugin for in-app browser and we found that we were using deprecated UIWebView in the XIB file. we changed that to WKWebView and updated the plugin and it solved the problem.

Hope that helps.