Yevhen Klymentiev
dark
light
console
darkness
y.klymentiev@gmail.com
Reusable Snippets|Practical utility code for everyday use — custom-built and ready to share

isIOS

Checks if the current platform is iOS.

TypeScript
Copied!
1/**
2 * Checks if the current platform is iOS.
3 *
4 * @returns True if running on iOS, false otherwise.
5 */
6export function isIOS(): boolean {
7  if (typeof navigator === 'undefined' || typeof window === 'undefined') {
8    return false;
9  }
10
11  return /iPad|iPhone|iPod/.test(navigator.userAgent) ||
12         (navigator.userAgent.includes('Mac') && 'ontouchend' in document);
13}
  • Accurate iOS Detection

    Combines multiple heuristics to reliably detect iOS, including touch-enabled Macs which report as "Mac" but behave like iPads.

  • Cross-Browser Compatibility

    Avoids reliance on deprecated properties and instead uses resilient checks across modern Safari/WebKit environments.

  • Safe Environment Check

    Guards against server-side rendering or non-browser environments by verifying navigator and window.

  • Touchscreen Support Awareness

    Recognizes iPadOS 13+ devices that identify as "Mac" but are touchscreen-enabled.

Tests | Examples

TypeScript
Copied!
1const originalUserAgent = navigator.userAgent;
2const originalTouchSupport = 'ontouchend' in document;
3
4afterEach(() => {
5  Object.defineProperty(navigator, 'userAgent', {
6    value: originalUserAgent,
7    configurable: true,
8  });
9});
10
11test('returns true for iPhone user agent', () => {
12  Object.defineProperty(navigator, 'userAgent', {
13    value: 'Mozilla/5.0 (iPhone; CPU iPhone OS 14_0 like Mac OS X)',
14    configurable: true,
15  });
16  expect(isIOS()).toBe(true);
17});
18
19test('returns true for iPad user agent', () => {
20  Object.defineProperty(navigator, 'userAgent', {
21    value: 'Mozilla/5.0 (iPad; CPU OS 14_0 like Mac OS X)',
22    configurable: true,
23  });
24  expect(isIOS()).toBe(true);
25});
26
27test('returns false for Android user agent', () => {
28  Object.defineProperty(navigator, 'userAgent', {
29    value: 'Mozilla/5.0 (Linux; Android 10; SM-G970F)',
30    configurable: true,
31  });
32  expect(isIOS()).toBe(false);
33});
34
35test('returns false when navigator or window is undefined', () => {
36  const tempWindow = globalThis.window;
37  const tempNavigator = globalThis.navigator;
38
39  // Simulate non-browser environment
40  delete (globalThis as any).window;
41  delete (globalThis as any).navigator;
42
43  expect(isIOS()).toBe(false);
44
45  // Restore environment
46  (globalThis as any).window = tempWindow;
47  (globalThis as any).navigator = tempNavigator;
48});

Common Use Cases

  • iOS-Specific Workarounds

    Apply platform-specific CSS or JS fixes for known Safari/iOS limitations (e.g., viewport issues, keyboard behavior).

  • Conditional Feature Enablement

    Enable or disable features like file uploads, clipboard access, or motion APIs depending on iOS support.

  • Custom UI Tweaks

    Adjust spacing, gestures, or interface behaviors specifically for iPhones or iPads.

  • Analytics and Telemetry

    Log user platform for usage metrics or platform-specific debugging.

Codebase: Utilities -> Platforms -> isIOS | Yevhen Klymentiev