Add new guide: detecting iPad

Author: faisalman

docs/.vitepress/config.js

@@ -216,6 +216,7 @@ export default defineConfig({
                 text: 'Guides',
                 collapsed: false,
                 items: [
+                    { text: 'How to Detect iPad', link: '/guides/how-to-detect-ipad-using-javascript' },
                     { text: 'How to Detect iOS ≥ 26', link: '/guides/how-to-detect-ios-26-using-javascript' },
                     { text: 'How to Detect macOS > 10.15.7', link: '/guides/how-to-detect-macos-10157-using-javascript' },
                     { text: 'How to Detect Windows 11', link: '/guides/how-to-detect-windows-11-using-javascript' },

docs/api/submodules/helpers/is-frozen-ua.md

@@ -12,7 +12,7 @@ Chrome/[majorVersion].0.0.0 [deviceCompat] Safari/537.36
 | Token | Possible values |
 | ------ | ---------------- |
 | `[unifiedPlatform]` | <p>Desktop:</p><ul><li>`Windows NT 10.0; Win64; x64`</li><li>`Macintosh; Intel Mac OS X 10_15_7`</li><li>`X11; Linux x86_64`</li><li>`X11; CrOS x86_64 14541.0.0`</li><li>`Fuchsia`</li></ul><p>Mobile:</p><ul><li>`Linux; Android 10; K`</li></ul> |
-| `[deviceCompat]` | <ul><li>(empty) — for tablets/desktops</li><li>`Mobile` — for mobile devices</li></ul> |
+| `[deviceCompat]` | <p>Desktop/Tablet:</p><ul><li>'' (empty)</li></ul><p>Mobile:</p><ul><li>`Mobile`</li></ul> |
 
 ::: tip
 Learn how to identify the real device behind a reduced user-agent [here](/guides/how-to-identify-android-k-device)

docs/guides/how-to-detect-ios-26-using-javascript.md

@@ -2,7 +2,7 @@
 
 Starting with Safari on iOS 26, you can no longer rely on the User-Agent string to determine iOS version. This issue is because WebKit (the underlying engine developed by Apple that powers all browsers on iOS) now freezes the reported iOS version at `18.6`:
 
-- [Safari on iOS/iPadOS/visionOS 26: "user agent string no longer lists the current version of the operating system"�](https://webkit.org/blog/17333/webkit-features-in-safari-26-0/#update-to-ua-string) *—Webkit Blog*
+- [Safari on iOS/iPadOS/visionOS 26: "user agent string no longer lists the current version of the operating system"🡥](https://webkit.org/blog/17333/webkit-features-in-safari-26-0/#update-to-ua-string) *—Webkit Blog*
 
 ::: info
 An example of User-Agent string on iOS 18.6:

docs/guides/how-to-detect-ipad-using-javascript.md

@@ -0,0 +1,44 @@
+# How to Detect iPad using JavaScript
+
+iPads used to have a very clear user-agent string that included the keyword `iPad`, for example:
+
+`Mozilla/5.0 (iPad; CPU iPhone OS 8_3 like Mac OS X) AppleWebKit/600.1.4 (KHTML, like Gecko) FxiOS/1.0 Mobile/12F69 Safari/600.1.4`
+
+However, starting from iPadOS 13, Apple forces Safari to use desktop mode by default. This makes Safari on iPad started identifying itself as a desktop device (`Macintosh`) instead of `iPad`, like:
+
+`Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.0 Safari/605.1.15`
+
+This makes user-agent detection not reliable when detecting iPad. As a workaround, you can use [`withFeatureCheck()`](/api/main/idata/with-feature-check) method to also detect for some iPad-specific browser features in addition to the usual user-agent detection.
+
+## Code Example
+
+### User-Agent Detection Only
+
+```js [user-agent-detect.js]
+import { UAParser } from 'ua-parser-js';
+
+const parser = new UAParser();
+const device = parser.getDevice();
+
+if (device.is('iPad')) {
+    console.log("Hi, looks like you're using an iPad!");
+}
+```
+
+### User-Agent Detection + Feature Detection
+
+```js [with-feature-detect.js]
+import { UAParser } from 'ua-parser-js';
+
+const parser = new UAParser();
+const device = await parser.getDevice().withFeatureCheck();
+
+if (device.is('iPad')) {
+    console.log("Hi, looks like you're using an iPad");
+}
+```
+
+## References
+
+* [iPadOS brings breaking changes for developers🡥](https://docs.getupdraft.com/ios/ipados) *—Updraft Blog*
+* [`withFeatureCheck()`](/api/main/idata/with-feature-check)