fix(datetime): showing calendar grid no longer causes month to switch on ios 15

[liamdebeasi]

Pull request checklist

Please check if your PR fulfills the following requirements:

• Tests for the changes have been added (for bug fixes / features)
• Docs have been reviewed and added / updated if needed (for bug fixes / features)
• Build (npm run build) was run locally and any changes were pushed
• Lint (npm run lint) has passed locally and any fixes were made for failures

Pull request type

Please check the type of change your PR introduces:

• Bugfix
• Feature
• Code style update (formatting, renaming)
• Refactoring (no functional changes, no api changes)
• Build related changes
• Documentation content changes
• Other (please describe):

What is the current behavior?

Issue Number: resolves #24405

This fix is a monkey patch and should be removed when iOS 14 support is dropped in the future. There was a bug in iOS 14 where the month would move back by 1 month when switching from the month/year picker to the calendar grid. A fix was created in #24142. This fix inadvertently introduced the same issue, but only on iOS 15 and with the month moving forward by 1.

I investigated other ways to fix the iOS 14 issue, but nothing was sufficient so I opted for this hacky (and temporary!) approach. The code will apply the iOS 14 fix if it detects a WebKit browser that does not support aspect-ratio. aspect-ratio was added in Safari 15: https://webkit.org/blog/11989/new-webkit-features-in-safari-15/

The code will apply the normal display: none behavior if it detects either a non-WebKit browser or a WebKit browser that supports aspect-ratio (I.e. Safari 15+).

What is the new behavior?

• The patch that fixes a bug in iOS 14 is now only applied to iOS 14, not all browsers.

Does this introduce a breaking change?

• Yes
• No

Other information

Dev build: 6.0.2-dev.1641931632.6a7e2d1

[sean-perkins]

Looks good on Safari 15, nice find with the aspect-ratio check.