From 3e011e3b6130519cd0bf3e7b81d701b5e9d52a90 Mon Sep 17 00:00:00 2001 From: Kyle Durand Date: Wed, 13 Mar 2024 15:19:41 -0400 Subject: [PATCH] fix: iOS 16 font patch for web views (#11725) --- .changeset/lemon-ties-grow.md | 5 +++++ polaris-react/src/components/AppProvider/AppProvider.tsx | 8 +++++++- 2 files changed, 12 insertions(+), 1 deletion(-) create mode 100644 .changeset/lemon-ties-grow.md diff --git a/.changeset/lemon-ties-grow.md b/.changeset/lemon-ties-grow.md new file mode 100644 index 00000000000..2a9bd8b830f --- /dev/null +++ b/.changeset/lemon-ties-grow.md @@ -0,0 +1,5 @@ +--- +'@shopify/polaris': patch +--- + +Fixed a bug where iOS 16 font patch wasn't added for mobile app web views diff --git a/polaris-react/src/components/AppProvider/AppProvider.tsx b/polaris-react/src/components/AppProvider/AppProvider.tsx index 38a0d36af64..587bfb7b282 100644 --- a/polaris-react/src/components/AppProvider/AppProvider.tsx +++ b/polaris-react/src/components/AppProvider/AppProvider.tsx @@ -113,7 +113,13 @@ export class AppProvider extends Component { navigator.userAgent.includes('Version/16.2') || navigator.userAgent.includes('Version/16.3')); - if (isSafari16) { + const isMobileApp16 = + navigator.userAgent.includes('Shopify Mobile/iOS') && + (navigator.userAgent.includes('OS 16_1') || + navigator.userAgent.includes('OS 16_2') || + navigator.userAgent.includes('OS 16_3')); + + if (isSafari16 || isMobileApp16) { document.documentElement.classList.add( 'Polaris-Safari-16-Font-Optical-Sizing-Patch', );