bug: chrome v69, intersection observer continues to fire with datetime

[zhuhuanzi]

Prerequisites

• I have read the Contributing Guidelines.
• I agree to follow the Code of Conduct.
• I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

• v4.x
• v5.x
• v6.x

Current Behavior

<ion-datetime hour-cycle="h12" locale="en-GB"></ion-datetime>

Expected Behavior

<ion-datetime hour-cycle="h12" locale="en-GB"></ion-datetime>

Steps to Reproduce

create new project and add this code

Code Reproduction URL

No response

Ionic Info

"dependencies": {
"@angular/common": "~13.2.2",
"@angular/core": "~13.2.2",
"@angular/forms": "~13.2.2",
"@angular/platform-browser": "~13.2.2",
"@angular/platform-browser-dynamic": "~13.2.2",
"@angular/router": "~13.2.2",
"@capacitor/android": "3.4.3",
"@capacitor/app": "1.1.1",
"@capacitor/core": "3.4.3",
"@capacitor/haptics": "1.1.4",
"@capacitor/keyboard": "1.2.2",
"@capacitor/status-bar": "1.0.8",
"@ionic/angular": "^6.0.12",
"rxjs": "~6.6.0",
"tslib": "^2.2.0",
"zone.js": "~0.11.4"
},

Additional Information

I have searched for existing issues,such as #24475,
It's good on Android 12(Android System WebView 96.0.4664.61),
but it doesn't work on Android 9（Android System WebView 69.0.3497.100）.

[zhuhuanzi]

f6d6c0a972d9a324d10455e8a4e17c43.mp4

[liamdebeasi]

Thanks for the issue. Are you able to update the system webview on the Android 9 device? Version 69 is quite old and likely to have some issues that have been resolved in newer versions.

[zhuhuanzi]

@liamdebeasi Thank you for your answer. but in china the network environment is not open,we can't use Google's features. update webView is very difficult.

[zhuhuanzi]

@liamdebeasi update webview is not feasible,more than one software may appear in the system,the system is still running at a lower version.

[liamdebeasi]

Thanks for the update. Let me check with the team on this. The issue is likely a bug in an older version of the Chrome/Android WebView. Unfortunately, I do not have access to that version of the webview, making it hard to develop a workaround at the moment.

[liamdebeasi]

My colleague was able to reproduce this on an older Android 9 simulator. I will assign the bug label.

[zhaoxiongxing]

I have the same problem

[zhaoxiongxing]

@zhuhuanzi 你的是怎么解决的，我发现在android10 已下都不行

[kyoz]

For more information, this issue happen on iOS 12.2 and below too.

When using ion-date time on iOS device which below or equal 12.2 version, there is some error relate to IntersectionObserver.

It's seem below that version, IntersectionObserver on iOS's safari didn't support really well.

I'v tried to add a intersection-observer polyfill and the error gone away, but then this issue happen.

I'm not planning to support iOS which below 12.4. But I hope these infos will help to investigate the issue.

[liamdebeasi]

Ionic 6 support iOS 13.0+: https://ionicframework.com/docs/reference/browser-support#mobile-browsers

We do not recommend using Ionic 6 on anything older than iOS 13.0 as you will likely run into unsupported features as noted in #24980 (comment).

[ShubhamKhatri2]

Please resolve this issue as soon as possible, because it's affecting our business

[liamdebeasi]

Can everyone try the following dev build and let me know if it resolves the issue?

6.1.14-dev.11657300607.18e0f2d1

You can install it using NPM. Example:

npm install @ionic/[email protected] @ionic/[email protected]

[liamdebeasi]

Thanks for the issue. This has been resolved via #25586, and a fix will be available in an upcoming release of Ionic Framework.

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.