[refactor] Add tests to use-os hook (#6442)

Add `useOs` unit tests
mantinedev · Jun 27, 2024 · 09a25b6 · 09a25b6
1 parent 0e544d7
commit 09a25b6
Show file tree

Hide file tree

Showing 2 changed files with 68 additions and 8 deletions.
diff --git a/packages/@mantine/hooks/src/use-os/use-os.test.ts b/packages/@mantine/hooks/src/use-os/use-os.test.ts
@@ -0,0 +1,33 @@
+import { renderHook } from '@testing-library/react';
+import { useOs } from './use-os';
+
+const platforms = {
+  windows: ['Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:47.0) Gecko/20100101 Firefox/47.0'],
+  macos: ['Mozilla/5.0 (Macintosh; Intel Mac OS X x.y; rv:42.0) Gecko/20100101 Firefox/42.0'],
+  linux: [
+    'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/51.0.2704.103 Safari/537.36',
+  ],
+  ios: [
+    'Mozilla/5.0 (iPhone; CPU iPhone OS 13_5_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.1.1 Mobile/15E148 Safari/604.1',
+  ],
+  android: [
+    'Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/114.0.0.0 Mobile Safari/537.36',
+  ],
+  undetermined: ['UNKNOWN'],
+} as const;
+
+describe('@mantine/hooks/use-os', () => {
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  Object.entries(platforms).forEach(([os, userAgents]) => {
+    it.each(userAgents)(`should detect %s platform on ${os}`, (userAgent) => {
+      jest.spyOn(window.navigator, 'userAgent', 'get').mockReturnValueOnce(userAgent);
+
+      const { result } = renderHook(() => useOs());
+
+      expect(result.current).toBe(os);
+    });
+  });
+});
diff --git a/packages/@mantine/hooks/src/use-os/use-os.ts b/packages/@mantine/hooks/src/use-os/use-os.ts
@@ -3,29 +3,56 @@ import { useIsomorphicEffect } from '../use-isomorphic-effect/use-isomorphic-eff
 
 export type OS = 'undetermined' | 'macos' | 'ios' | 'windows' | 'android' | 'linux';
 
+function isMacOS(userAgent: string): boolean {
+  const macosPattern = /(Macintosh)|(MacIntel)|(MacPPC)|(Mac68K)/i;
+
+  return macosPattern.test(userAgent);
+}
+
+function isIOS(userAgent: string): boolean {
+  const iosPattern = /(iPhone)|(iPad)|(iPod)/i;
+
+  return iosPattern.test(userAgent);
+}
+
+function isWindows(userAgent: string): boolean {
+  const windowsPattern = /(Win32)|(Win64)|(Windows)|(WinCE)/i;
+
+  return windowsPattern.test(userAgent);
+}
+
+function isAndroid(userAgent: string): boolean {
+  const androidPattern = /Android/i;
+
+  return androidPattern.test(userAgent);
+}
+
+function isLinux(userAgent: string): boolean {
+  const linuxPattern = /Linux/i;
+
+  return linuxPattern.test(userAgent);
+}
+
 function getOS(): OS {
   if (typeof window === 'undefined') {
     return 'undetermined';
   }
 
   const { userAgent } = window.navigator;
-  const macosPlatforms = /(Macintosh)|(MacIntel)|(MacPPC)|(Mac68K)/i;
-  const windowsPlatforms = /(Win32)|(Win64)|(Windows)|(WinCE)/i;
-  const iosPlatforms = /(iPhone)|(iPad)|(iPod)/i;
 
-  if (macosPlatforms.test(userAgent)) {
+  if (isMacOS(userAgent)) {
     return 'macos';
   }
-  if (iosPlatforms.test(userAgent)) {
+  if (isIOS(userAgent)) {
     return 'ios';
   }
-  if (windowsPlatforms.test(userAgent)) {
+  if (isWindows(userAgent)) {
     return 'windows';
   }
-  if (/Android/i.test(userAgent)) {
+  if (isAndroid(userAgent)) {
     return 'android';
   }
-  if (/Linux/i.test(userAgent)) {
+  if (isLinux(userAgent)) {
     return 'linux';
   }