Replace deprecated navigator.platform with modern platform detection

Co-authored-by: weareoutman <2338946+weareoutman@users.noreply.github.com>

Author: Copilot

docusaurus-search-local/src/client/theme/SearchBar/SearchBar.tsx

@@ -36,6 +36,7 @@ import LoadingRing from "../LoadingRing/LoadingRing";
 import { normalizeContextByPath } from "../../utils/normalizeContextByPath";
 import { searchResultLimits } from "../../utils/proxiedGeneratedConstants";
 import { parseKeymap, matchesKeymap, getKeymapHints } from "../../utils/keymap";
+import { isMacPlatform } from "../../utils/platform";
 
 import styles from "./SearchBar.module.css";
 
@@ -389,11 +390,7 @@ export default function SearchBar({
   );
 
   // Implement hint icons for the search shortcuts on mac and the rest operating systems.
-  const isMac = isBrowser
-    ? /mac/i.test(
-        (navigator as any).userAgentData?.platform ?? navigator.platform
-      )
-    : false;
+  const isMac = isBrowser ? isMacPlatform() : false;
 
   // Sync the input value and focus state for SSR
   useEffect(

docusaurus-search-local/src/client/utils/keymap.spec.ts

@@ -1,6 +1,15 @@
 import { parseKeymap, matchesKeymap, getKeymapHints } from './keymap';
+import * as platformModule from './platform';
+
+// Mock the platform module
+jest.mock('./platform');
 
 describe('keymap utility functions', () => {
+  const mockIsMacPlatform = jest.mocked(platformModule.isMacPlatform);
+
+  beforeEach(() => {
+    mockIsMacPlatform.mockClear();
+  });
   describe('parseKeymap', () => {
     test('should parse single key', () => {
       const result = parseKeymap('s');
@@ -36,12 +45,7 @@ describe('keymap utility functions', () => {
     });
 
     test('should parse mod+k on Mac-like platform', () => {
-      // Mock navigator.platform to simulate Mac
-      const originalNavigator = global.navigator;
-      Object.defineProperty(global, 'navigator', {
-        value: { platform: 'MacIntel' },
-        configurable: true
-      });
+      mockIsMacPlatform.mockReturnValue(true);
 
       const result = parseKeymap('mod+k');
       expect(result).toEqual({
@@ -51,21 +55,10 @@ describe('keymap utility functions', () => {
         shift: false,
         meta: true,
       });
-
-      // Restore original navigator
-      Object.defineProperty(global, 'navigator', {
-        value: originalNavigator,
-        configurable: true
-      });
     });
 
     test('should parse mod+k on non-Mac platform', () => {
-      // Mock navigator.platform to simulate non-Mac
-      const originalNavigator = global.navigator;
-      Object.defineProperty(global, 'navigator', {
-        value: { platform: 'Win32' },
-        configurable: true
-      });
+      mockIsMacPlatform.mockReturnValue(false);
 
       const result = parseKeymap('mod+k');
       expect(result).toEqual({
@@ -75,12 +68,6 @@ describe('keymap utility functions', () => {
         shift: false,
         meta: false,
       });
-
-      // Restore original navigator
-      Object.defineProperty(global, 'navigator', {
-        value: originalNavigator,
-        configurable: true
-      });
     });
 
     test('should parse complex combination', () => {

docusaurus-search-local/src/client/utils/keymap.ts

@@ -1,3 +1,5 @@
+import { isMacPlatform } from './platform';
+
 export interface ParsedKeymap {
   key: string;
   ctrl: boolean;
@@ -17,7 +19,7 @@ export function parseKeymap(keymap: string): ParsedKeymap {
   };
 
   // Detect if we're on Mac to handle 'mod' appropriately
-  const isMac = typeof navigator !== 'undefined' && navigator.platform.toLowerCase().includes('mac');
+  const isMac = isMacPlatform();
 
   for (const part of parts) {
     const trimmed = part.trim();

docusaurus-search-local/src/client/utils/platform.spec.ts

@@ -0,0 +1,117 @@
+import { isMacPlatform } from './platform';
+
+describe('platform utility functions', () => {
+  // Store original navigator to restore after tests
+  const originalNavigator = global.navigator;
+  
+  afterEach(() => {
+    // Restore original navigator after each test
+    Object.defineProperty(global, 'navigator', {
+      value: originalNavigator,
+      configurable: true
+    });
+  });
+
+  describe('isMacPlatform', () => {
+    test('should return false when navigator is undefined', () => {
+      Object.defineProperty(global, 'navigator', {
+        value: undefined,
+        configurable: true
+      });
+      
+      expect(isMacPlatform()).toBe(false);
+    });
+
+    test('should detect Mac using userAgentData.platform', () => {
+      Object.defineProperty(global, 'navigator', {
+        value: {
+          userAgentData: { platform: 'macOS' },
+          userAgent: 'Mozilla/5.0 (Windows NT 10.0; Win64; x64)',
+          platform: 'Win32'
+        },
+        configurable: true
+      });
+
+      expect(isMacPlatform()).toBe(true);
+    });
+
+    test('should detect non-Mac using userAgentData.platform', () => {
+      Object.defineProperty(global, 'navigator', {
+        value: {
+          userAgentData: { platform: 'Windows' },
+          userAgent: 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7)',
+          platform: 'MacIntel'
+        },
+        configurable: true
+      });
+
+      expect(isMacPlatform()).toBe(false);
+    });
+
+    test('should fallback to userAgent when userAgentData is not available', () => {
+      Object.defineProperty(global, 'navigator', {
+        value: {
+          userAgent: 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36',
+          platform: 'Win32'
+        },
+        configurable: true
+      });
+
+      expect(isMacPlatform()).toBe(true);
+    });
+
+    test('should detect non-Mac using userAgent fallback', () => {
+      Object.defineProperty(global, 'navigator', {
+        value: {
+          userAgent: 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36',
+          platform: 'MacIntel'
+        },
+        configurable: true
+      });
+
+      expect(isMacPlatform()).toBe(false);
+    });
+
+    test('should fallback to platform when userAgent is not available', () => {
+      Object.defineProperty(global, 'navigator', {
+        value: {
+          platform: 'MacIntel'
+        },
+        configurable: true
+      });
+
+      expect(isMacPlatform()).toBe(true);
+    });
+
+    test('should detect non-Mac using platform fallback', () => {
+      Object.defineProperty(global, 'navigator', {
+        value: {
+          platform: 'Win32'
+        },
+        configurable: true
+      });
+
+      expect(isMacPlatform()).toBe(false);
+    });
+
+    test('should return false when no platform detection methods are available', () => {
+      Object.defineProperty(global, 'navigator', {
+        value: {},
+        configurable: true
+      });
+
+      expect(isMacPlatform()).toBe(false);
+    });
+
+    test('should handle case insensitive platform detection', () => {
+      Object.defineProperty(global, 'navigator', {
+        value: {
+          userAgentData: { platform: 'MACOS' },
+        },
+        configurable: true
+      });
+
+      expect(isMacPlatform()).toBe(true);
+    });
+  });
+});

docusaurus-search-local/src/client/utils/platform.ts

@@ -0,0 +1,28 @@
+/**
+ * Detects if the current platform is macOS using modern, non-deprecated APIs.
+ * Falls back gracefully for older browsers or server-side rendering.
+ */
+export function isMacPlatform(): boolean {
+  // Handle server-side rendering or missing navigator
+  if (typeof navigator === 'undefined') {
+    return false;
+  }
+
+  // Try modern User-Agent Client Hints API first (if available)
+  if ('userAgentData' in navigator && (navigator as any).userAgentData?.platform) {
+    const platform = (navigator as any).userAgentData.platform.toLowerCase();
+    return platform.includes('mac');
+  }
+
+  // Fall back to user agent string parsing (more reliable than navigator.platform)
+  if (navigator.userAgent) {
+    return /mac/i.test(navigator.userAgent);
+  }
+
+  // Final fallback to deprecated navigator.platform for very old browsers
+  if (navigator.platform) {
+    return navigator.platform.toLowerCase().includes('mac');
+  }
+
+  return false;
+}