Summary
Modernize @react-simplikit/mobile platform detection utilities (isIOS, isAndroid) to use the latest browser APIs, referencing Adobe React Spectrum's platform.ts as a proven implementation.
Motivation
navigator.platform is unreliable and not recommended — already replaced with UA string check in isIOS
navigator.userAgentData is the modern replacement (MDN) and provides more structured, reliable detection
- React Spectrum uses
userAgentData with fallback to legacy APIs — a pattern worth adopting
Proposed Changes
1. Use navigator.userAgentData as primary detection
// Current: regex on raw UA string
/Android/i.test(navigator.userAgent)
// Proposed: userAgentData first, UA string fallback
function testUserAgent(re: RegExp): boolean {
if (typeof window === 'undefined') return false;
const brands = navigator.userAgentData?.brands;
return brands
? brands.some(b => re.test(b.brand))
: re.test(navigator.userAgent);
}
2. Expand platform detection coverage (optional)
Consider adding utilities already proven useful in React Spectrum:
| Utility |
Purpose |
isMac() |
macOS detection |
isIPhone() |
iPhone-specific (vs iPad) |
isIPad() |
iPad-specific |
isAppleDevice() |
Any Apple device |
isWebKit() |
WebKit engine detection |
isChrome() |
Chrome detection |
isFirefox() |
Firefox detection |
Reference
Checklist
Summary
Modernize
@react-simplikit/mobileplatform detection utilities (isIOS,isAndroid) to use the latest browser APIs, referencing Adobe React Spectrum'splatform.tsas a proven implementation.Motivation
navigator.platformis unreliable and not recommended — already replaced with UA string check inisIOSnavigator.userAgentDatais the modern replacement (MDN) and provides more structured, reliable detectionuserAgentDatawith fallback to legacy APIs — a pattern worth adoptingProposed Changes
1. Use
navigator.userAgentDataas primary detection2. Expand platform detection coverage (optional)
Consider adding utilities already proven useful in React Spectrum:
isMac()isIPhone()isIPad()isAppleDevice()isWebKit()isChrome()isFirefox()Reference
platform.ts— full sourcetestUserAgent/testPlatform—userAgentDatawith legacy fallbackisIPad— iPadOS 13+ detection viaisMac() && maxTouchPoints > 1Checklist
testUserAgent/testPlatforminternal helpers withuserAgentDatasupportisIOSandisAndroidto use new helpers