Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: Add isIpadOs device check #114

Merged
merged 3 commits into from
Feb 8, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .flowconfig
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
[ignore]
.*/node_modules/hermes-estree
.*/node_modules/babel-plugin-flow-runtime
.*/node_modules/flow-runtime
.*/node_modules/npm
Expand Down
11 changes: 11 additions & 0 deletions src/device.js
Original file line number Diff line number Diff line change
Expand Up @@ -252,6 +252,17 @@ export function isSafari(ua?: string = getUserAgent()): boolean {
return /Safari/.test(ua) && !isChrome(ua) && !/Silk|FxiOS|EdgiOS/.test(ua);
}

export function isIpadOs(ua?: string = getUserAgent()): boolean {
// Safari on iOS13+ on an iPad will return a useragent that is the same as Safari on MacOS
// Adding the maxTouchPoints will determine that it is a touch device
if (!/iPhone|iPod/.test(ua)) {
if (/iPad/.test(ua) || (isSafari(ua) && navigator.maxTouchPoints >= 1)) {
return true;
}
}
return false;
}

export function isApplePaySupported(): boolean {
try {
if (
Expand Down
77 changes: 77 additions & 0 deletions test/tests/device/isiPadOs.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,77 @@
/* @flow */

import { isIpadOs } from "../../../src/device";

describe("isIpadOs", () => {
beforeEach(() => {
window.navigator = {};
});

it("should return true when userAgent is Safari and has multiple maxTouchPoints", () => {
window.navigator.userAgent =
"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.2 Safari/605.1.15";
// eslint-disable-next-line compat/compat
window.navigator.maxTouchPoints = 5;
const bool = isIpadOs();
if (!bool) {
throw new Error(`Expected true, got ${JSON.stringify(bool)}`);
}
});

it("should return true when userAgent is Firefox and has multiple maxTouchPoints", () => {
window.navigator.userAgent =
"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";
// eslint-disable-next-line compat/compat
window.navigator.maxTouchPoints = 5;
const bool = isIpadOs();
if (!bool) {
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
if (!bool) {
if (bool !== true) {

I'd suggest explicitly equating to a boolean for these

throw new Error(`Expected true, got ${JSON.stringify(bool)}`);
}
});

it("should return true when userAgent is Chrome and has multiple maxTouchPoints", () => {
window.navigator.userAgent =
"Mozilla/5.0 (iPad; CPU OS 17_2 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) CriOS/120.0.6099.119 Mobile/15E148 Safari/604.1";
// eslint-disable-next-line compat/compat
window.navigator.maxTouchPoints = 5;
const bool = isIpadOs();
if (!bool) {
throw new Error(`Expected true, got ${JSON.stringify(bool)}`);
}
});

it("should return true when userAgent is iPad", () => {
window.navigator.userAgent = "iPad";
const bool = isIpadOs();
if (!bool) {
throw new Error(`Expected true, got ${JSON.stringify(bool)}`);
}
});

it("should return false when userAgent is Safari but has no touchpoints", () => {
window.navigator.userAgent =
"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.2 Safari/605.1.15";
// eslint-disable-next-line compat/compat
window.navigator.maxTouchPoints = 0;
const bool = isIpadOs();
if (!bool) {
throw new Error(`Expected false, got ${JSON.stringify(bool)}`);
}
});

it("should return false when userAgent contains iPhone", () => {
window.navigator.userAgent = "iPhone";
const bool = isIpadOs();
if (!bool) {
throw new Error(`Expected false, got ${JSON.stringify(bool)}`);
}
});

it("should return false when userAgent contains iPod", () => {
window.navigator.userAgent = "iPod";
const bool = isIpadOs();
if (!bool) {
throw new Error(`Expected false, got ${JSON.stringify(bool)}`);
}
});
});
Loading