diff --git a/packages/mui-base/src/Menu/Menu.test.tsx b/packages/mui-base/src/Menu/Menu.test.tsx
index 325e1b601062c3..214fff4420c2b9 100644
--- a/packages/mui-base/src/Menu/Menu.test.tsx
+++ b/packages/mui-base/src/Menu/Menu.test.tsx
@@ -618,7 +618,12 @@ describe('<Menu />', () => {
     });
   });
 
-  it('perf: does not rerender menu items unnecessarily', async () => {
+  it('perf: does not rerender menu items unnecessarily', async function test() {
+    if (/jsdom/.test(window.navigator.userAgent)) {
+      // JSDOM doesn't support :focus-visible
+      this.skip();
+    }
+
     const renderItem1Spy = spy();
     const renderItem2Spy = spy();
     const renderItem3Spy = spy();
diff --git a/packages/mui-base/src/Select/Select.test.tsx b/packages/mui-base/src/Select/Select.test.tsx
index d3ec34e600d7c0..d401b28bf1616a 100644
--- a/packages/mui-base/src/Select/Select.test.tsx
+++ b/packages/mui-base/src/Select/Select.test.tsx
@@ -1265,7 +1265,12 @@ describe('<Select />', () => {
     expect(selectButton).to.have.text('1, 2');
   });
 
-  it('perf: does not rerender options unnecessarily', async () => {
+  it('perf: does not rerender options unnecessarily', async function test() {
+    if (/jsdom/.test(window.navigator.userAgent)) {
+      // JSDOM doesn't support :focus-visible
+      this.skip();
+    }
+
     const renderOption1Spy = spy();
     const renderOption2Spy = spy();
     const renderOption3Spy = spy();
diff --git a/packages/mui-base/src/Slider/Slider.test.tsx b/packages/mui-base/src/Slider/Slider.test.tsx
index 0c426a2544f2b1..fabd03e2c765ab 100644
--- a/packages/mui-base/src/Slider/Slider.test.tsx
+++ b/packages/mui-base/src/Slider/Slider.test.tsx
@@ -368,7 +368,12 @@ describe('<Slider />', () => {
       expect(screen.getByTestId('value-label')).to.have.text('20');
     });
 
-    it('should provide focused state to the slotProps.thumb', () => {
+    it('should provide focused state to the slotProps.thumb', function test() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+
       const { getByTestId } = render(
         <Slider
           defaultValue={[20, 40]}
diff --git a/packages/mui-base/src/useButton/useButton.test.tsx b/packages/mui-base/src/useButton/useButton.test.tsx
index 17951927d19c08..5f862aa0d764cf 100644
--- a/packages/mui-base/src/useButton/useButton.test.tsx
+++ b/packages/mui-base/src/useButton/useButton.test.tsx
@@ -170,7 +170,12 @@ describe('useButton', () => {
         expect(handleClickExternal.callCount).to.equal(0);
       });
 
-      it('handles onFocusVisible and does not include it in the root props', () => {
+      it('handles onFocusVisible and does not include it in the root props', function test() {
+        if (/jsdom/.test(window.navigator.userAgent)) {
+          // JSDOM doesn't support :focus-visible
+          this.skip();
+        }
+
         interface WithFocusVisibleHandler {
           onFocusVisible: React.FocusEventHandler;
         }
diff --git a/packages/mui-base/src/useButton/useButton.ts b/packages/mui-base/src/useButton/useButton.ts
index f8520a751abdb8..d87c184f4755cb 100644
--- a/packages/mui-base/src/useButton/useButton.ts
+++ b/packages/mui-base/src/useButton/useButton.ts
@@ -2,7 +2,7 @@
 import * as React from 'react';
 import {
   unstable_useForkRef as useForkRef,
-  unstable_useIsFocusVisible as useIsFocusVisible,
+  unstable_isFocusVisible as isFocusVisible,
 } from '@mui/utils';
 import {
   UseButtonParameters,
@@ -38,22 +38,11 @@ export function useButton(parameters: UseButtonParameters = {}): UseButtonReturn
 
   const [active, setActive] = React.useState<boolean>(false);
 
-  const {
-    isFocusVisibleRef,
-    onFocus: handleFocusVisible,
-    onBlur: handleBlurVisible,
-    ref: focusVisibleRef,
-  } = useIsFocusVisible();
-
   const [focusVisible, setFocusVisible] = React.useState(false);
   if (disabled && !focusableWhenDisabled && focusVisible) {
     setFocusVisible(false);
   }
 
-  React.useEffect(() => {
-    isFocusVisibleRef.current = focusVisible;
-  }, [focusVisible, isFocusVisibleRef]);
-
   const [rootElementName, updateRootElementName] = useRootElementName({
     rootElementName: rootElementNameProp ?? (href || to ? 'a' : undefined),
     componentName: 'Button',
@@ -68,9 +57,7 @@ export function useButton(parameters: UseButtonParameters = {}): UseButtonReturn
   };
 
   const createHandleBlur = (otherHandlers: EventHandlers) => (event: React.FocusEvent) => {
-    handleBlurVisible(event);
-
-    if (isFocusVisibleRef.current === false) {
+    if (!isFocusVisible(event.target)) {
       setFocusVisible(false);
     }
 
@@ -84,8 +71,7 @@ export function useButton(parameters: UseButtonParameters = {}): UseButtonReturn
         buttonRef.current = event.currentTarget;
       }
 
-      handleFocusVisible(event);
-      if (isFocusVisibleRef.current === true) {
+      if (isFocusVisible(event.target)) {
         setFocusVisible(true);
         otherHandlers.onFocusVisible?.(event);
       }
@@ -176,7 +162,7 @@ export function useButton(parameters: UseButtonParameters = {}): UseButtonReturn
       }
     };
 
-  const handleRef = useForkRef(updateRootElementName, externalRef, focusVisibleRef, buttonRef);
+  const handleRef = useForkRef(updateRootElementName, externalRef, buttonRef);
 
   interface AdditionalButtonProps {
     type?: React.ButtonHTMLAttributes<HTMLButtonElement>['type'];
diff --git a/packages/mui-base/src/useSlider/useSlider.ts b/packages/mui-base/src/useSlider/useSlider.ts
index 94869cc604debb..37dbea1d3fbec0 100644
--- a/packages/mui-base/src/useSlider/useSlider.ts
+++ b/packages/mui-base/src/useSlider/useSlider.ts
@@ -6,7 +6,7 @@ import {
   unstable_useEnhancedEffect as useEnhancedEffect,
   unstable_useEventCallback as useEventCallback,
   unstable_useForkRef as useForkRef,
-  unstable_useIsFocusVisible as useIsFocusVisible,
+  unstable_isFocusVisible as isFocusVisible,
   visuallyHidden,
   clamp,
 } from '@mui/utils';
@@ -265,23 +265,15 @@ export function useSlider(parameters: UseSliderParameters): UseSliderReturnValue
 
   const marksValues = (marks as Mark[]).map((mark: Mark) => mark.value);
 
-  const {
-    isFocusVisibleRef,
-    onBlur: handleBlurVisible,
-    onFocus: handleFocusVisible,
-    ref: focusVisibleRef,
-  } = useIsFocusVisible();
   const [focusedThumbIndex, setFocusedThumbIndex] = React.useState(-1);
 
   const sliderRef = React.useRef<HTMLSpanElement>();
-  const handleFocusRef = useForkRef(focusVisibleRef, sliderRef);
-  const handleRef = useForkRef(ref, handleFocusRef);
+  const handleRef = useForkRef(ref, sliderRef);
 
   const createHandleHiddenInputFocus =
     (otherHandlers: EventHandlers) => (event: React.FocusEvent) => {
       const index = Number(event.currentTarget.getAttribute('data-index'));
-      handleFocusVisible(event);
-      if (isFocusVisibleRef.current === true) {
+      if (isFocusVisible(event.target)) {
         setFocusedThumbIndex(index);
       }
       setOpen(index);
@@ -289,8 +281,7 @@ export function useSlider(parameters: UseSliderParameters): UseSliderReturnValue
     };
   const createHandleHiddenInputBlur =
     (otherHandlers: EventHandlers) => (event: React.FocusEvent) => {
-      handleBlurVisible(event);
-      if (isFocusVisibleRef.current === false) {
+      if (!isFocusVisible(event.target)) {
         setFocusedThumbIndex(-1);
       }
       setOpen(-1);
diff --git a/packages/mui-base/src/useSwitch/useSwitch.test.tsx b/packages/mui-base/src/useSwitch/useSwitch.test.tsx
index 1a9bb0853af021..8496dfa321293a 100644
--- a/packages/mui-base/src/useSwitch/useSwitch.test.tsx
+++ b/packages/mui-base/src/useSwitch/useSwitch.test.tsx
@@ -71,7 +71,12 @@ describe('useSwitch', () => {
       expect(handleChange.callCount).to.equal(1);
     });
 
-    it('should call focus event handlers if focus events are fired', () => {
+    it('should call focus event handlers if focus events are fired', function test() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+
       const handleBlur = spy();
       const handleFocus = spy();
       const handleFocusVisible = spy();
diff --git a/packages/mui-base/src/useSwitch/useSwitch.ts b/packages/mui-base/src/useSwitch/useSwitch.ts
index ed30f150321346..b63ca86d7cfb27 100644
--- a/packages/mui-base/src/useSwitch/useSwitch.ts
+++ b/packages/mui-base/src/useSwitch/useSwitch.ts
@@ -3,7 +3,7 @@ import * as React from 'react';
 import {
   unstable_useControlled as useControlled,
   unstable_useForkRef as useForkRef,
-  unstable_useIsFocusVisible as useIsFocusVisible,
+  unstable_isFocusVisible as isFocusVisible,
 } from '@mui/utils';
 import { UseSwitchParameters, UseSwitchReturnValue } from './useSwitch.types';
 
@@ -51,22 +51,11 @@ export function useSwitch(props: UseSwitchParameters): UseSwitchReturnValue {
       otherProps.onChange?.(event);
     };
 
-  const {
-    isFocusVisibleRef,
-    onBlur: handleBlurVisible,
-    onFocus: handleFocusVisible,
-    ref: focusVisibleRef,
-  } = useIsFocusVisible();
-
   const [focusVisible, setFocusVisible] = React.useState(false);
   if (disabled && focusVisible) {
     setFocusVisible(false);
   }
 
-  React.useEffect(() => {
-    isFocusVisibleRef.current = focusVisible;
-  }, [focusVisible, isFocusVisibleRef]);
-
   const inputRef = React.useRef<HTMLInputElement | null>(null);
 
   const createHandleFocus =
@@ -77,8 +66,7 @@ export function useSwitch(props: UseSwitchParameters): UseSwitchReturnValue {
         inputRef.current = event.currentTarget;
       }
 
-      handleFocusVisible(event);
-      if (isFocusVisibleRef.current === true) {
+      if (isFocusVisible(event.target)) {
         setFocusVisible(true);
         onFocusVisible?.(event);
       }
@@ -90,9 +78,7 @@ export function useSwitch(props: UseSwitchParameters): UseSwitchReturnValue {
   const createHandleBlur =
     (otherProps: React.InputHTMLAttributes<HTMLInputElement>) =>
     (event: React.FocusEvent<HTMLInputElement>) => {
-      handleBlurVisible(event);
-
-      if (isFocusVisibleRef.current === false) {
+      if (!isFocusVisible(event.target)) {
         setFocusVisible(false);
       }
 
@@ -100,7 +86,7 @@ export function useSwitch(props: UseSwitchParameters): UseSwitchReturnValue {
       otherProps.onBlur?.(event);
     };
 
-  const handleInputRef = useForkRef(focusVisibleRef, inputRef);
+  const handleInputRef = useForkRef(inputRef);
 
   const getInputProps: UseSwitchReturnValue['getInputProps'] = (otherProps = {}) => ({
     checked: checkedProp,
diff --git a/packages/mui-joy/src/Link/Link.test.tsx b/packages/mui-joy/src/Link/Link.test.tsx
index 68da3bea32c381..133522e41b49b6 100644
--- a/packages/mui-joy/src/Link/Link.test.tsx
+++ b/packages/mui-joy/src/Link/Link.test.tsx
@@ -75,7 +75,12 @@ describe('<Link />', () => {
   });
 
   describe('keyboard focus', () => {
-    it('should add the focusVisible class when focused', () => {
+    it('should add the focusVisible class when focused', function test() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+
       const { container } = render(<Link href="/">Home</Link>);
       const anchor = container.querySelector('a');
 
diff --git a/packages/mui-joy/src/Link/Link.tsx b/packages/mui-joy/src/Link/Link.tsx
index bac2fbe4f315bc..afe985b6128d6c 100644
--- a/packages/mui-joy/src/Link/Link.tsx
+++ b/packages/mui-joy/src/Link/Link.tsx
@@ -5,8 +5,7 @@ import { unstable_composeClasses as composeClasses } from '@mui/base';
 import { OverridableComponent } from '@mui/types';
 import {
   unstable_capitalize as capitalize,
-  unstable_useForkRef as useForkRef,
-  unstable_useIsFocusVisible as useIsFocusVisible,
+  unstable_isFocusVisible as isFocusVisible,
   unstable_isMuiElement as isMuiElement,
 } from '@mui/utils';
 import { unstable_extendSxProp as extendSxProp } from '@mui/system';
@@ -216,17 +215,9 @@ const Link = React.forwardRef(function Link(inProps, ref) {
 
   const level = nesting || inheriting ? inProps.level || 'inherit' : levelProp;
 
-  const {
-    isFocusVisibleRef,
-    onBlur: handleBlurVisible,
-    onFocus: handleFocusVisible,
-    ref: focusVisibleRef,
-  } = useIsFocusVisible();
   const [focusVisible, setFocusVisible] = React.useState<boolean>(false);
-  const handleRef = useForkRef(ref, focusVisibleRef) as React.Ref<HTMLAnchorElement>;
   const handleBlur = (event: React.FocusEvent<HTMLAnchorElement>) => {
-    handleBlurVisible(event);
-    if (isFocusVisibleRef.current === false) {
+    if (!isFocusVisible(event.target)) {
       setFocusVisible(false);
     }
     if (onBlur) {
@@ -234,8 +225,7 @@ const Link = React.forwardRef(function Link(inProps, ref) {
     }
   };
   const handleFocus = (event: React.FocusEvent<HTMLAnchorElement>) => {
-    handleFocusVisible(event);
-    if (isFocusVisibleRef.current === true) {
+    if (isFocusVisible(event.target)) {
       setFocusVisible(true);
     }
     if (onFocus) {
@@ -263,7 +253,7 @@ const Link = React.forwardRef(function Link(inProps, ref) {
       onBlur: handleBlur,
       onFocus: handleFocus,
     },
-    ref: handleRef,
+    ref,
     className: classes.root,
     elementType: LinkRoot,
     externalForwardedProps,
diff --git a/packages/mui-joy/src/ListItemButton/ListItemButton.test.tsx b/packages/mui-joy/src/ListItemButton/ListItemButton.test.tsx
index 0c40f7ad93923c..08f3eb26a2c20d 100644
--- a/packages/mui-joy/src/ListItemButton/ListItemButton.test.tsx
+++ b/packages/mui-joy/src/ListItemButton/ListItemButton.test.tsx
@@ -56,7 +56,12 @@ describe('Joy <ListItemButton />', () => {
   });
 
   describe('prop: focusVisibleClassName', () => {
-    it('should have focusVisible classes', () => {
+    it('should have focusVisible classes', function test() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+
       const { getByRole } = render(<ListItemButton />);
       const button = getByRole('button');
 
diff --git a/packages/mui-joy/src/Tooltip/Tooltip.tsx b/packages/mui-joy/src/Tooltip/Tooltip.tsx
index b3c6e14d88324a..c6875348d03460 100644
--- a/packages/mui-joy/src/Tooltip/Tooltip.tsx
+++ b/packages/mui-joy/src/Tooltip/Tooltip.tsx
@@ -7,7 +7,7 @@ import {
   unstable_useControlled as useControlled,
   unstable_useEventCallback as useEventCallback,
   unstable_useForkRef as useForkRef,
-  unstable_useIsFocusVisible as useIsFocusVisible,
+  unstable_isFocusVisible as isFocusVisible,
   unstable_useId as useId,
   unstable_useTimeout as useTimeout,
   unstable_Timeout as Timeout,
@@ -274,7 +274,7 @@ const Tooltip = React.forwardRef(function Tooltip(inProps, ref) {
 
   React.useEffect(() => stopTouchInteraction, [stopTouchInteraction]);
 
-  const handleOpen = (event: React.MouseEvent<HTMLElement>) => {
+  const handleOpen = (event: React.SyntheticEvent<HTMLElement>) => {
     hystersisTimer.clear();
     hystersisOpen = true;
 
@@ -303,7 +303,7 @@ const Tooltip = React.forwardRef(function Tooltip(inProps, ref) {
     });
   });
 
-  const handleMouseOver = (event: React.MouseEvent<HTMLElement>) => {
+  const handleMouseOver = (event: React.SyntheticEvent<HTMLElement>) => {
     if (ignoreNonTouchEvents.current && event.type !== 'touchstart') {
       return;
     }
@@ -326,31 +326,24 @@ const Tooltip = React.forwardRef(function Tooltip(inProps, ref) {
     }
   };
 
-  const handleMouseLeave = (event: React.MouseEvent<HTMLElement>) => {
+  const handleMouseLeave = (event: React.SyntheticEvent<HTMLElement>) => {
     enterTimer.clear();
     leaveTimer.start(leaveDelay, () => {
       handleClose(event);
     });
   };
 
-  const {
-    isFocusVisibleRef,
-    onBlur: handleBlurVisible,
-    onFocus: handleFocusVisible,
-    ref: focusVisibleRef,
-  } = useIsFocusVisible();
   // We don't necessarily care about the focusVisible state (which is safe to access via ref anyway).
   // We just need to re-render the Tooltip if the focus-visible state changes.
   const [, setChildIsFocusVisible] = React.useState(false);
-  const handleBlur = (event: React.FocusEvent<HTMLElement> | React.MouseEvent<HTMLElement>) => {
-    handleBlurVisible(event as React.FocusEvent<HTMLElement>);
-    if (isFocusVisibleRef.current === false) {
+  const handleBlur = (event: React.FocusEvent<HTMLElement>) => {
+    if (!isFocusVisible(event.target)) {
       setChildIsFocusVisible(false);
-      handleMouseLeave(event as React.MouseEvent<HTMLElement>);
+      handleMouseLeave(event);
     }
   };
 
-  const handleFocus = (event: React.FocusEvent<HTMLElement> | React.MouseEvent<HTMLElement>) => {
+  const handleFocus = (event: React.FocusEvent<HTMLElement>) => {
     // Workaround for https://github.com/facebook/react/issues/7769
     // The autoFocus of React might trigger the event before the componentDidMount.
     // We need to account for this eventuality.
@@ -358,10 +351,9 @@ const Tooltip = React.forwardRef(function Tooltip(inProps, ref) {
       setChildNode(event.currentTarget);
     }
 
-    handleFocusVisible(event as React.FocusEvent<HTMLElement>);
-    if (isFocusVisibleRef.current === true) {
+    if (isFocusVisible(event.target)) {
       setChildIsFocusVisible(true);
-      handleMouseOver(event as React.MouseEvent<HTMLElement>);
+      handleMouseOver(event);
     }
   };
 
@@ -423,10 +415,9 @@ const Tooltip = React.forwardRef(function Tooltip(inProps, ref) {
   }, [handleClose, open]);
 
   const handleUseRef = useForkRef(setChildNode, ref);
-  const handleFocusRef = useForkRef<Element>(focusVisibleRef, handleUseRef);
   const handleRef = useForkRef(
     (children as unknown as { ref: React.Ref<HTMLElement> }).ref,
-    handleFocusRef,
+    handleUseRef,
   );
 
   // There is no point in displaying an empty tooltip.
diff --git a/packages/mui-material/src/AccordionSummary/AccordionSummary.test.js b/packages/mui-material/src/AccordionSummary/AccordionSummary.test.js
index ae4d845e9ad07d..a8d1cf1aaa510d 100644
--- a/packages/mui-material/src/AccordionSummary/AccordionSummary.test.js
+++ b/packages/mui-material/src/AccordionSummary/AccordionSummary.test.js
@@ -98,7 +98,12 @@ describe('<AccordionSummary />', () => {
     expect(handleChange.callCount).to.equal(1);
   });
 
-  it('calls onFocusVisible if focused visibly', () => {
+  it('calls onFocusVisible if focused visibly', function test() {
+    if (/jsdom/.test(window.navigator.userAgent)) {
+      // JSDOM doesn't support :focus-visible
+      this.skip();
+    }
+
     const handleFocusVisible = spy();
     const { getByRole } = render(<AccordionSummary onFocusVisible={handleFocusVisible} />);
     // simulate pointer device
diff --git a/packages/mui-material/src/Button/Button.test.js b/packages/mui-material/src/Button/Button.test.js
index 0b887e085482df..47fa7b0607c42e 100644
--- a/packages/mui-material/src/Button/Button.test.js
+++ b/packages/mui-material/src/Button/Button.test.js
@@ -582,7 +582,12 @@ describe('<Button />', () => {
     expect(button).to.have.class(classes.disableElevation);
   });
 
-  it('should have a focusRipple by default', () => {
+  it('should have a focusRipple by default', function test() {
+    if (/jsdom/.test(window.navigator.userAgent)) {
+      // JSDOM doesn't support :focus-visible
+      this.skip();
+    }
+
     const { getByRole } = render(
       <Button TouchRippleProps={{ classes: { ripplePulsate: 'pulsate-focus-visible' } }}>
         Hello World
@@ -598,7 +603,12 @@ describe('<Button />', () => {
     expect(button.querySelector('.pulsate-focus-visible')).not.to.equal(null);
   });
 
-  it('can disable the focusRipple', () => {
+  it('can disable the focusRipple', function test() {
+    if (/jsdom/.test(window.navigator.userAgent)) {
+      // JSDOM doesn't support :focus-visible
+      this.skip();
+    }
+
     const { getByRole } = render(
       <Button
         disableFocusRipple
diff --git a/packages/mui-material/src/ButtonBase/ButtonBase.js b/packages/mui-material/src/ButtonBase/ButtonBase.js
index e2dc37b66a9821..2c0b5b804cbd53 100644
--- a/packages/mui-material/src/ButtonBase/ButtonBase.js
+++ b/packages/mui-material/src/ButtonBase/ButtonBase.js
@@ -5,11 +5,11 @@ import clsx from 'clsx';
 import refType from '@mui/utils/refType';
 import elementTypeAcceptingRef from '@mui/utils/elementTypeAcceptingRef';
 import composeClasses from '@mui/utils/composeClasses';
+import isFocusVisible from '@mui/utils/isFocusVisible';
 import { styled } from '../zero-styled';
 import { useDefaultProps } from '../DefaultPropsProvider';
 import useForkRef from '../utils/useForkRef';
 import useEventCallback from '../utils/useEventCallback';
-import useIsFocusVisible from '../utils/useIsFocusVisible';
 import TouchRipple from './TouchRipple';
 import buttonBaseClasses, { getButtonBaseUtilityClass } from './buttonBaseClasses';
 
@@ -112,12 +112,6 @@ const ButtonBase = React.forwardRef(function ButtonBase(inProps, ref) {
   const rippleRef = React.useRef(null);
   const handleRippleRef = useForkRef(rippleRef, touchRippleRef);
 
-  const {
-    isFocusVisibleRef,
-    onFocus: handleFocusVisible,
-    onBlur: handleBlurVisible,
-    ref: focusVisibleRef,
-  } = useIsFocusVisible();
   const [focusVisible, setFocusVisible] = React.useState(false);
   if (disabled && focusVisible) {
     setFocusVisible(false);
@@ -182,8 +176,7 @@ const ButtonBase = React.forwardRef(function ButtonBase(inProps, ref) {
   const handleBlur = useRippleHandler(
     'stop',
     (event) => {
-      handleBlurVisible(event);
-      if (isFocusVisibleRef.current === false) {
+      if (!isFocusVisible(event.target)) {
         setFocusVisible(false);
       }
       if (onBlur) {
@@ -199,8 +192,7 @@ const ButtonBase = React.forwardRef(function ButtonBase(inProps, ref) {
       buttonRef.current = event.currentTarget;
     }
 
-    handleFocusVisible(event);
-    if (isFocusVisibleRef.current === true) {
+    if (isFocusVisible(event.target)) {
       setFocusVisible(true);
 
       if (onFocusVisible) {
@@ -297,7 +289,7 @@ const ButtonBase = React.forwardRef(function ButtonBase(inProps, ref) {
     }
   }
 
-  const handleRef = useForkRef(ref, focusVisibleRef, buttonRef);
+  const handleRef = useForkRef(ref, buttonRef);
 
   if (process.env.NODE_ENV !== 'production') {
     // eslint-disable-next-line react-hooks/rules-of-hooks
diff --git a/packages/mui-material/src/ButtonBase/ButtonBase.test.js b/packages/mui-material/src/ButtonBase/ButtonBase.test.js
index 47604bbcc51020..e8f05fe8eab2dc 100644
--- a/packages/mui-material/src/ButtonBase/ButtonBase.test.js
+++ b/packages/mui-material/src/ButtonBase/ButtonBase.test.js
@@ -247,6 +247,13 @@ describe('<ButtonBase />', () => {
   });
 
   describe('ripple', () => {
+    before(function beforeCallback() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+    });
+
     describe('interactions', () => {
       it('should not have a focus ripple by default', () => {
         const { getByRole } = render(
@@ -599,6 +606,13 @@ describe('<ButtonBase />', () => {
   });
 
   describe('focusRipple', () => {
+    before(function beforeCallback() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+    });
+
     it('should pulsate the ripple when focusVisible', () => {
       const { getByRole } = render(
         <ButtonBase
@@ -725,7 +739,12 @@ describe('<ButtonBase />', () => {
       expect(getByText('Hello')).to.have.property('disabled', true);
     });
 
-    it('should reset the focused state', () => {
+    it('should reset the focused state', function test() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+
       const { getByText, setProps } = render(<ButtonBase>Hello</ButtonBase>);
       const button = getByText('Hello');
       simulatePointerDevice();
@@ -793,7 +812,12 @@ describe('<ButtonBase />', () => {
       expect(onFocusSpy.callCount).to.equal(1);
     });
 
-    it('has a focus-visible polyfill', () => {
+    it('has a focus-visible polyfill', function test() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+
       const { getByText } = render(<ButtonBase>Hello</ButtonBase>);
       const button = getByText('Hello');
       simulatePointerDevice();
@@ -815,7 +839,12 @@ describe('<ButtonBase />', () => {
       expect(button).to.have.class(classes.focusVisible);
     });
 
-    it('removes focus-visible if focus is re-targetted', () => {
+    it('removes focus-visible if focus is re-targetted', function test() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+
       /**
        * @type {string[]}
        */
@@ -860,7 +889,12 @@ describe('<ButtonBase />', () => {
       expect(buttonBase).not.to.have.class(classes.focusVisible);
     });
 
-    it('onFocusVisibleHandler() should propagate call to onFocusVisible prop', () => {
+    it('onFocusVisibleHandler() should propagate call to onFocusVisible prop', function test() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+
       const onFocusVisibleSpy = spy();
       const { getByRole } = render(
         <ButtonBase component="span" onFocusVisible={onFocusVisibleSpy}>
@@ -885,6 +919,13 @@ describe('<ButtonBase />', () => {
   });
 
   describe('event: keydown', () => {
+    before(function beforeCallback() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+    });
+
     it('ripples on repeated keydowns', () => {
       const { container, getByText } = render(
         <ButtonBase focusRipple TouchRippleProps={{ classes: { rippleVisible: 'ripple-visible' } }}>
@@ -1123,6 +1164,13 @@ describe('<ButtonBase />', () => {
   });
 
   describe('prop: action', () => {
+    before(function beforeCallback() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+    });
+
     it('should be able to focus visible the button', () => {
       /**
        * @type {React.RefObject<import('./ButtonBase').ButtonBaseActions>}
diff --git a/packages/mui-material/src/Chip/Chip.test.js b/packages/mui-material/src/Chip/Chip.test.js
index b340ac2310ff2d..b853a45baa925b 100644
--- a/packages/mui-material/src/Chip/Chip.test.js
+++ b/packages/mui-material/src/Chip/Chip.test.js
@@ -665,6 +665,13 @@ describe('<Chip />', () => {
   });
 
   describe('event: focus', () => {
+    before(function beforeCallback() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+    });
+
     it('has a focus-visible polyfill', () => {
       const { container } = render(<Chip label="Test Chip" onClick={() => {}} />);
       const chip = container.querySelector(`.${classes.root}`);
diff --git a/packages/mui-material/src/Fab/Fab.test.js b/packages/mui-material/src/Fab/Fab.test.js
index 4cc81fbc832e71..fd9cc8c98ae696 100644
--- a/packages/mui-material/src/Fab/Fab.test.js
+++ b/packages/mui-material/src/Fab/Fab.test.js
@@ -102,7 +102,12 @@ describe('<Fab />', () => {
     expect(container.querySelector(`.${touchRippleClasses.root}`)).to.equal(null);
   });
 
-  it('should have a focusRipple by default', async () => {
+  it('should have a focusRipple by default', async function test() {
+    if (/jsdom/.test(window.navigator.userAgent)) {
+      // JSDOM doesn't support :focus-visible
+      this.skip();
+    }
+
     const { getByRole } = render(
       <Fab
         TouchRippleProps={{
diff --git a/packages/mui-material/src/Link/Link.js b/packages/mui-material/src/Link/Link.js
index 7ee5ec75e5940f..895fb42716d157 100644
--- a/packages/mui-material/src/Link/Link.js
+++ b/packages/mui-material/src/Link/Link.js
@@ -5,11 +5,10 @@ import clsx from 'clsx';
 import { alpha } from '@mui/system/colorManipulator';
 import elementTypeAcceptingRef from '@mui/utils/elementTypeAcceptingRef';
 import composeClasses from '@mui/utils/composeClasses';
+import isFocusVisible from '@mui/utils/isFocusVisible';
 import capitalize from '../utils/capitalize';
 import { styled, useTheme } from '../zero-styled';
 import { useDefaultProps } from '../DefaultPropsProvider';
-import useIsFocusVisible from '../utils/useIsFocusVisible';
-import useForkRef from '../utils/useForkRef';
 import Typography from '../Typography';
 import linkClasses, { getLinkUtilityClass } from './linkClasses';
 import getTextDecoration, { colorTransformations } from './getTextDecoration';
@@ -142,17 +141,9 @@ const Link = React.forwardRef(function Link(inProps, ref) {
     ...other
   } = props;
 
-  const {
-    isFocusVisibleRef,
-    onBlur: handleBlurVisible,
-    onFocus: handleFocusVisible,
-    ref: focusVisibleRef,
-  } = useIsFocusVisible();
   const [focusVisible, setFocusVisible] = React.useState(false);
-  const handlerRef = useForkRef(ref, focusVisibleRef);
   const handleBlur = (event) => {
-    handleBlurVisible(event);
-    if (isFocusVisibleRef.current === false) {
+    if (!isFocusVisible(event.target)) {
       setFocusVisible(false);
     }
     if (onBlur) {
@@ -160,8 +151,7 @@ const Link = React.forwardRef(function Link(inProps, ref) {
     }
   };
   const handleFocus = (event) => {
-    handleFocusVisible(event);
-    if (isFocusVisibleRef.current === true) {
+    if (isFocusVisible(event.target)) {
       setFocusVisible(true);
     }
     if (onFocus) {
@@ -188,7 +178,7 @@ const Link = React.forwardRef(function Link(inProps, ref) {
       component={component}
       onBlur={handleBlur}
       onFocus={handleFocus}
-      ref={handlerRef}
+      ref={ref}
       ownerState={ownerState}
       variant={variant}
       {...other}
diff --git a/packages/mui-material/src/Link/Link.test.js b/packages/mui-material/src/Link/Link.test.js
index 1fb1e0f14d8407..a10a71adf79463 100644
--- a/packages/mui-material/src/Link/Link.test.js
+++ b/packages/mui-material/src/Link/Link.test.js
@@ -79,7 +79,12 @@ describe('<Link />', () => {
   });
 
   describe('keyboard focus', () => {
-    it('should add the focusVisible class when focused', () => {
+    it('should add the focusVisible class when focused', function test() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+
       const { container } = render(<Link href="/">Home</Link>);
       const anchor = container.querySelector('a');
 
diff --git a/packages/mui-material/src/ListItem/ListItem.test.js b/packages/mui-material/src/ListItem/ListItem.test.js
index 306c601a9631bc..9fde560ae2b03b 100644
--- a/packages/mui-material/src/ListItem/ListItem.test.js
+++ b/packages/mui-material/src/ListItem/ListItem.test.js
@@ -200,7 +200,12 @@ describe('<ListItem />', () => {
 
   // TODO remove in v6 in favor of ListItemButton
   describe('prop: focusVisibleClassName', () => {
-    it('should merge the class names', () => {
+    it('should merge the class names', function test() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+
       const { getByRole } = render(
         <ListItem button focusVisibleClassName="focusVisibleClassName" />,
       );
diff --git a/packages/mui-material/src/ListItemButton/ListItemButton.test.js b/packages/mui-material/src/ListItemButton/ListItemButton.test.js
index 00a1eb34dba8b8..1a58df4cfc118c 100644
--- a/packages/mui-material/src/ListItemButton/ListItemButton.test.js
+++ b/packages/mui-material/src/ListItemButton/ListItemButton.test.js
@@ -55,6 +55,13 @@ describe('<ListItemButton />', () => {
   });
 
   describe('prop: focusVisibleClassName', () => {
+    before(function beforeCallback() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+    });
+
     it('should merge the class names', () => {
       const { getByRole } = render(
         <ListItemButton focusVisibleClassName="focusVisibleClassName" />,
diff --git a/packages/mui-material/src/Rating/Rating.js b/packages/mui-material/src/Rating/Rating.js
index 3648cfb33d344d..1282e132165e18 100644
--- a/packages/mui-material/src/Rating/Rating.js
+++ b/packages/mui-material/src/Rating/Rating.js
@@ -7,13 +7,8 @@ import visuallyHidden from '@mui/utils/visuallyHidden';
 import chainPropTypes from '@mui/utils/chainPropTypes';
 import composeClasses from '@mui/utils/composeClasses';
 import { useRtl } from '@mui/system/RtlProvider';
-import {
-  capitalize,
-  useForkRef,
-  useIsFocusVisible,
-  useControlled,
-  unstable_useId as useId,
-} from '../utils';
+import isFocusVisible from '@mui/utils/isFocusVisible';
+import { capitalize, useForkRef, useControlled, unstable_useId as useId } from '../utils';
 import Star from '../internal/svg-icons/Star';
 import StarBorder from '../internal/svg-icons/StarBorder';
 import { styled } from '../zero-styled';
@@ -377,16 +372,10 @@ const Rating = React.forwardRef(function Rating(inProps, ref) {
     value = focus;
   }
 
-  const {
-    isFocusVisibleRef,
-    onBlur: handleBlurVisible,
-    onFocus: handleFocusVisible,
-    ref: focusVisibleRef,
-  } = useIsFocusVisible();
   const [focusVisible, setFocusVisible] = React.useState(false);
 
   const rootRef = React.useRef();
-  const handleRef = useForkRef(focusVisibleRef, rootRef, ref);
+  const handleRef = useForkRef(rootRef, ref);
 
   const handleMouseMove = (event) => {
     if (onMouseMove) {
@@ -475,8 +464,7 @@ const Rating = React.forwardRef(function Rating(inProps, ref) {
   };
 
   const handleFocus = (event) => {
-    handleFocusVisible(event);
-    if (isFocusVisibleRef.current === true) {
+    if (isFocusVisible(event.target)) {
       setFocusVisible(true);
     }
 
@@ -492,8 +480,7 @@ const Rating = React.forwardRef(function Rating(inProps, ref) {
       return;
     }
 
-    handleBlurVisible(event);
-    if (isFocusVisibleRef.current === false) {
+    if (!isFocusVisible(event.target)) {
       setFocusVisible(false);
     }
 
diff --git a/packages/mui-material/src/SpeedDial/SpeedDial.test.js b/packages/mui-material/src/SpeedDial/SpeedDial.test.js
index c6a9bd916c0e11..07f11a4429791f 100644
--- a/packages/mui-material/src/SpeedDial/SpeedDial.test.js
+++ b/packages/mui-material/src/SpeedDial/SpeedDial.test.js
@@ -196,7 +196,12 @@ describe('<SpeedDial />', () => {
       expect(fab).to.have.attribute('aria-expanded', 'true');
     });
 
-    it('should reset the state of the tooltip when the speed dial is closed while it is open', () => {
+    it('should reset the state of the tooltip when the speed dial is closed while it is open', function test() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+
       const handleOpen = spy();
       const { queryByRole, getByRole, getAllByRole } = render(
         <SpeedDial ariaLabel="mySpeedDial" onOpen={handleOpen}>
diff --git a/packages/mui-material/src/Tab/Tab.test.js b/packages/mui-material/src/Tab/Tab.test.js
index d050d49b07637e..45ecdfb89d5322 100644
--- a/packages/mui-material/src/Tab/Tab.test.js
+++ b/packages/mui-material/src/Tab/Tab.test.js
@@ -34,7 +34,12 @@ describe('<Tab />', () => {
     expect(container.querySelector('.touch-ripple')).to.equal(null);
   });
 
-  it('should have a focusRipple by default', () => {
+  it('should have a focusRipple by default', function test() {
+    if (/jsdom/.test(window.navigator.userAgent)) {
+      // JSDOM doesn't support :focus-visible
+      this.skip();
+    }
+
     const { container, getByRole } = render(
       <Tab TouchRippleProps={{ classes: { ripplePulsate: 'focus-ripple' } }} />,
     );
diff --git a/packages/mui-material/src/Tooltip/Tooltip.js b/packages/mui-material/src/Tooltip/Tooltip.js
index f9425f6f6a3430..a179afe021eaa4 100644
--- a/packages/mui-material/src/Tooltip/Tooltip.js
+++ b/packages/mui-material/src/Tooltip/Tooltip.js
@@ -8,6 +8,7 @@ import { appendOwnerState } from '@mui/base/utils';
 import composeClasses from '@mui/utils/composeClasses';
 import { alpha } from '@mui/system/colorManipulator';
 import { useRtl } from '@mui/system/RtlProvider';
+import isFocusVisible from '@mui/utils/isFocusVisible';
 import { styled, useTheme } from '../zero-styled';
 import { useDefaultProps } from '../DefaultPropsProvider';
 import capitalize from '../utils/capitalize';
@@ -16,7 +17,6 @@ import Popper from '../Popper';
 import useEventCallback from '../utils/useEventCallback';
 import useForkRef from '../utils/useForkRef';
 import useId from '../utils/useId';
-import useIsFocusVisible from '../utils/useIsFocusVisible';
 import useControlled from '../utils/useControlled';
 import tooltipClasses, { getTooltipUtilityClass } from './tooltipClasses';
 
@@ -466,18 +466,9 @@ const Tooltip = React.forwardRef(function Tooltip(inProps, ref) {
     });
   };
 
-  const {
-    isFocusVisibleRef,
-    onBlur: handleBlurVisible,
-    onFocus: handleFocusVisible,
-    ref: focusVisibleRef,
-  } = useIsFocusVisible();
-  // We don't necessarily care about the focusVisible state (which is safe to access via ref anyway).
-  // We just need to re-render the Tooltip if the focus-visible state changes.
   const [, setChildIsFocusVisible] = React.useState(false);
   const handleBlur = (event) => {
-    handleBlurVisible(event);
-    if (isFocusVisibleRef.current === false) {
+    if (!isFocusVisible(event.target)) {
       setChildIsFocusVisible(false);
       handleMouseLeave(event);
     }
@@ -491,8 +482,7 @@ const Tooltip = React.forwardRef(function Tooltip(inProps, ref) {
       setChildNode(event.currentTarget);
     }
 
-    handleFocusVisible(event);
-    if (isFocusVisibleRef.current === true) {
+    if (isFocusVisible(event.target)) {
       setChildIsFocusVisible(true);
       handleMouseOver(event);
     }
@@ -555,7 +545,7 @@ const Tooltip = React.forwardRef(function Tooltip(inProps, ref) {
     };
   }, [handleClose, open]);
 
-  const handleRef = useForkRef(children.ref, focusVisibleRef, setChildNode, ref);
+  const handleRef = useForkRef(children.ref, setChildNode, ref);
 
   // There is no point in displaying an empty tooltip.
   // So we exclude all falsy values, except 0, which is valid.
diff --git a/packages/mui-material/src/Tooltip/Tooltip.test.js b/packages/mui-material/src/Tooltip/Tooltip.test.js
index 597a2785999ac4..02406c5314fc98 100644
--- a/packages/mui-material/src/Tooltip/Tooltip.test.js
+++ b/packages/mui-material/src/Tooltip/Tooltip.test.js
@@ -473,7 +473,12 @@ describe('<Tooltip />', () => {
       );
     });
 
-    it('should handle autoFocus + onFocus forwarding', () => {
+    it('should handle autoFocus + onFocus forwarding', function test() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+
       const handleFocus = spy();
       function AutoFocus(props) {
         return (
@@ -502,6 +507,13 @@ describe('<Tooltip />', () => {
   });
 
   describe('prop: delay', () => {
+    before(function beforeCallback() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+    });
+
     it('should take the enterDelay into account', async () => {
       const { queryByRole } = render(
         <Tooltip title="Hello World" enterDelay={111}>
@@ -622,7 +634,12 @@ describe('<Tooltip />', () => {
       });
     });
 
-    it(`should be transparent for the focus and blur event`, () => {
+    it(`should be transparent for the focus and blur event`, function test() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+
       const handleBlur = spy();
       const handleFocus = spy();
       render(
@@ -868,6 +885,13 @@ describe('<Tooltip />', () => {
   });
 
   describe('focus', () => {
+    before(function beforeCallback() {
+      if (/jsdom/.test(window.navigator.userAgent)) {
+        // JSDOM doesn't support :focus-visible
+        this.skip();
+      }
+    });
+
     it('ignores base focus', () => {
       render(
         <Tooltip enterDelay={0} title="Some information">
diff --git a/packages/mui-material/src/utils/index.d.ts b/packages/mui-material/src/utils/index.d.ts
index 4f675ba362d039..749cce071ace56 100644
--- a/packages/mui-material/src/utils/index.d.ts
+++ b/packages/mui-material/src/utils/index.d.ts
@@ -14,5 +14,4 @@ export { default as unsupportedProp } from './unsupportedProp';
 export { default as useControlled } from './useControlled';
 export { default as useEventCallback } from './useEventCallback';
 export { default as useForkRef } from './useForkRef';
-export { default as useIsFocusVisible } from './useIsFocusVisible';
 export { unstable_ClassNameGenerator } from '@mui/base/ClassNameGenerator';
diff --git a/packages/mui-material/src/utils/index.js b/packages/mui-material/src/utils/index.js
index 415505ff745dee..3a9a621f494112 100644
--- a/packages/mui-material/src/utils/index.js
+++ b/packages/mui-material/src/utils/index.js
@@ -17,7 +17,6 @@ export { default as unsupportedProp } from './unsupportedProp';
 export { default as useControlled } from './useControlled';
 export { default as useEventCallback } from './useEventCallback';
 export { default as useForkRef } from './useForkRef';
-export { default as useIsFocusVisible } from './useIsFocusVisible';
 // TODO: remove this export once ClassNameGenerator is stable
 // eslint-disable-next-line @typescript-eslint/naming-convention
 export const unstable_ClassNameGenerator = {
diff --git a/packages/mui-material/src/utils/useIsFocusVisible.d.ts b/packages/mui-material/src/utils/useIsFocusVisible.d.ts
deleted file mode 100644
index b1d9d514e158b6..00000000000000
--- a/packages/mui-material/src/utils/useIsFocusVisible.d.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-import useIsFocusVisible from '@mui/utils/useIsFocusVisible';
-
-export default useIsFocusVisible;
diff --git a/packages/mui-material/src/utils/useIsFocusVisible.js b/packages/mui-material/src/utils/useIsFocusVisible.js
deleted file mode 100644
index 9cfe9a7a1cb64c..00000000000000
--- a/packages/mui-material/src/utils/useIsFocusVisible.js
+++ /dev/null
@@ -1,4 +0,0 @@
-'use client';
-import useIsFocusVisible from '@mui/utils/useIsFocusVisible';
-
-export default useIsFocusVisible;
diff --git a/packages/mui-utils/src/index.ts b/packages/mui-utils/src/index.ts
index 44d58f355cd99d..449af6c59a44eb 100644
--- a/packages/mui-utils/src/index.ts
+++ b/packages/mui-utils/src/index.ts
@@ -27,7 +27,7 @@ export { default as unstable_useForkRef } from './useForkRef';
 export { default as unstable_useLazyRef } from './useLazyRef';
 export { default as unstable_useTimeout, Timeout as unstable_Timeout } from './useTimeout';
 export { default as unstable_useOnMount } from './useOnMount';
-export { default as unstable_useIsFocusVisible } from './useIsFocusVisible';
+export { default as unstable_isFocusVisible } from './isFocusVisible';
 export { default as unstable_getScrollbarSize } from './getScrollbarSize';
 export {
   detectScrollType as unstable_detectScrollType,
diff --git a/packages/mui-utils/src/isFocusVisible/index.ts b/packages/mui-utils/src/isFocusVisible/index.ts
new file mode 100644
index 00000000000000..197b1d490a2d67
--- /dev/null
+++ b/packages/mui-utils/src/isFocusVisible/index.ts
@@ -0,0 +1 @@
+export { default } from './isFocusVisible';
diff --git a/packages/mui-utils/src/isFocusVisible/isFocusVisible.ts b/packages/mui-utils/src/isFocusVisible/isFocusVisible.ts
new file mode 100644
index 00000000000000..e45c3660340d93
--- /dev/null
+++ b/packages/mui-utils/src/isFocusVisible/isFocusVisible.ts
@@ -0,0 +1,21 @@
+/**
+ * Returns a boolean indicating if the event's target has :focus-visible
+ */
+export default function isFocusVisible(element: Element): boolean {
+  try {
+    return element.matches(':focus-visible');
+  } catch (error) {
+    // Do not warn on jsdom tests, otherwise all tests that rely on focus have to be skipped
+    // Tests that rely on `:focus-visible` will still have to be skipped in jsdom
+    if (process.env.NODE_ENV !== 'production' && !/jsdom/.test(window.navigator.userAgent)) {
+      console.warn(
+        [
+          'MUI: The `:focus-visible` pseudo class is not supported in this browser.',
+          'Some components rely on this feature to work properly.',
+        ].join('\n'),
+      );
+    }
+  }
+
+  return false;
+}
diff --git a/packages/mui-utils/src/useIsFocusVisible/index.ts b/packages/mui-utils/src/useIsFocusVisible/index.ts
deleted file mode 100644
index 9f7a0b9ab5e7ad..00000000000000
--- a/packages/mui-utils/src/useIsFocusVisible/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export { default } from './useIsFocusVisible';
-export * from './useIsFocusVisible';
diff --git a/packages/mui-utils/src/useIsFocusVisible/useIsFocusVisible.test.js b/packages/mui-utils/src/useIsFocusVisible/useIsFocusVisible.test.js
deleted file mode 100644
index d0c9350a1e0ad8..00000000000000
--- a/packages/mui-utils/src/useIsFocusVisible/useIsFocusVisible.test.js
+++ /dev/null
@@ -1,126 +0,0 @@
-import { expect } from 'chai';
-import * as React from 'react';
-import * as ReactDOMClient from 'react-dom/client';
-import {
-  act,
-  createRenderer,
-  focusVisible,
-  simulatePointerDevice,
-  programmaticFocusTriggersFocusVisible,
-} from '@mui/internal-test-utils';
-import useIsFocusVisible, { teardown as teardownFocusVisible } from './useIsFocusVisible';
-import useForkRef from '../useForkRef';
-
-const SimpleButton = React.forwardRef(function SimpleButton(props, ref) {
-  const {
-    isFocusVisibleRef,
-    onBlur: handleBlurVisible,
-    onFocus: handleFocusVisible,
-    ref: focusVisibleRef,
-  } = useIsFocusVisible();
-
-  const handleRef = useForkRef(focusVisibleRef, ref);
-
-  const [isFocusVisible, setIsFocusVisible] = React.useState(false);
-
-  const handleBlur = (event) => {
-    handleBlurVisible(event);
-    if (isFocusVisibleRef.current === false) {
-      setIsFocusVisible(false);
-    }
-  };
-
-  const handleFocus = (event) => {
-    handleFocusVisible(event);
-    if (isFocusVisibleRef.current === true) {
-      setIsFocusVisible(true);
-    }
-  };
-
-  return (
-    <button
-      type="button"
-      {...props}
-      ref={handleRef}
-      className={isFocusVisible ? 'focus-visible' : null}
-      onBlur={handleBlur}
-      onFocus={handleFocus}
-    />
-  );
-});
-
-describe('useIsFocusVisible', () => {
-  const { render } = createRenderer();
-
-  before(() => {
-    // isolate test from previous component test that use the polyfill in the document scope
-    teardownFocusVisible(document);
-  });
-
-  describe('focus inside shadowRoot', () => {
-    before(function beforeHook() {
-      // Only run on HeadlessChrome which has native shadowRoot support.
-      // And jsdom which has limited support for shadowRoot (^12.0.0).
-      if (!/HeadlessChrome|jsdom/.test(window.navigator.userAgent)) {
-        this.skip();
-      }
-    });
-
-    let rootElement;
-    let reactRoot;
-
-    beforeEach(() => {
-      rootElement = document.createElement('div');
-      document.body.appendChild(rootElement);
-      rootElement.attachShadow({ mode: 'open' });
-      reactRoot = ReactDOMClient.createRoot(rootElement.shadowRoot);
-    });
-
-    afterEach(() => {
-      act(() => {
-        reactRoot.unmount();
-      });
-
-      teardownFocusVisible(rootElement.shadowRoot);
-      document.body.removeChild(rootElement);
-    });
-
-    it('should set focus state for shadowRoot children', () => {
-      const buttonRef = React.createRef();
-      render(
-        <SimpleButton id="test-button" ref={buttonRef}>
-          Hello
-        </SimpleButton>,
-        {},
-        {
-          container: rootElement.shadowRoot,
-        },
-      );
-      simulatePointerDevice();
-
-      const { current: button } = buttonRef;
-      if (button.nodeName !== 'BUTTON') {
-        throw new Error('missing button');
-      }
-
-      expect(button.classList.contains('focus-visible')).to.equal(false);
-
-      act(() => {
-        button.focus();
-      });
-
-      if (programmaticFocusTriggersFocusVisible()) {
-        expect(button).to.have.class('focus-visible');
-      } else {
-        expect(button).not.to.have.class('focus-visible');
-      }
-
-      act(() => {
-        button.blur();
-      });
-      focusVisible(button);
-
-      expect(button.classList.contains('focus-visible')).to.equal(true);
-    });
-  });
-});
diff --git a/packages/mui-utils/src/useIsFocusVisible/useIsFocusVisible.ts b/packages/mui-utils/src/useIsFocusVisible/useIsFocusVisible.ts
deleted file mode 100644
index 74d444019e6522..00000000000000
--- a/packages/mui-utils/src/useIsFocusVisible/useIsFocusVisible.ts
+++ /dev/null
@@ -1,175 +0,0 @@
-'use client';
-// based on https://github.com/WICG/focus-visible/blob/v4.1.5/src/focus-visible.js
-import * as React from 'react';
-import { Timeout } from '../useTimeout/useTimeout';
-
-let hadKeyboardEvent = true;
-let hadFocusVisibleRecently = false;
-const hadFocusVisibleRecentlyTimeout = new Timeout();
-
-const inputTypesWhitelist: Record<string, boolean> = {
-  text: true,
-  search: true,
-  url: true,
-  tel: true,
-  email: true,
-  password: true,
-  number: true,
-  date: true,
-  month: true,
-  week: true,
-  time: true,
-  datetime: true,
-  'datetime-local': true,
-};
-
-/**
- * Computes whether the given element should automatically trigger the
- * `focus-visible` class being added, i.e. whether it should always match
- * `:focus-visible` when focused.
- * @param {Element} node
- * @returns {boolean}
- */
-function focusTriggersKeyboardModality(node: Element) {
-  const { type, tagName } = node as HTMLInputElement;
-
-  if (tagName === 'INPUT' && inputTypesWhitelist[type] && !(node as HTMLInputElement).readOnly) {
-    return true;
-  }
-
-  if (tagName === 'TEXTAREA' && !(node as HTMLInputElement).readOnly) {
-    return true;
-  }
-
-  if ((node as HTMLElement).isContentEditable) {
-    return true;
-  }
-
-  return false;
-}
-
-/**
- * Keep track of our keyboard modality state with `hadKeyboardEvent`.
- * If the most recent user interaction was via the keyboard;
- * and the key press did not include a meta, alt/option, or control key;
- * then the modality is keyboard. Otherwise, the modality is not keyboard.
- * @param {KeyboardEvent} event
- */
-function handleKeyDown(event: KeyboardEvent) {
-  if (event.metaKey || event.altKey || event.ctrlKey) {
-    return;
-  }
-  hadKeyboardEvent = true;
-}
-
-/**
- * If at any point a user clicks with a pointing device, ensure that we change
- * the modality away from keyboard.
- * This avoids the situation where a user presses a key on an already focused
- * element, and then clicks on a different element, focusing it with a
- * pointing device, while we still think we're in keyboard modality.
- */
-function handlePointerDown() {
-  hadKeyboardEvent = false;
-}
-
-function handleVisibilityChange(this: Document) {
-  if (this.visibilityState === 'hidden') {
-    // If the tab becomes active again, the browser will handle calling focus
-    // on the element (Safari actually calls it twice).
-    // If this tab change caused a blur on an element with focus-visible,
-    // re-apply the class when the user switches back to the tab.
-    if (hadFocusVisibleRecently) {
-      hadKeyboardEvent = true;
-    }
-  }
-}
-
-function prepare(doc: Document): void {
-  doc.addEventListener('keydown', handleKeyDown, true);
-  doc.addEventListener('mousedown', handlePointerDown, true);
-  doc.addEventListener('pointerdown', handlePointerDown, true);
-  doc.addEventListener('touchstart', handlePointerDown, true);
-  doc.addEventListener('visibilitychange', handleVisibilityChange, true);
-}
-
-export function teardown(doc: Document): void {
-  doc.removeEventListener('keydown', handleKeyDown, true);
-  doc.removeEventListener('mousedown', handlePointerDown, true);
-  doc.removeEventListener('pointerdown', handlePointerDown, true);
-  doc.removeEventListener('touchstart', handlePointerDown, true);
-  doc.removeEventListener('visibilitychange', handleVisibilityChange, true);
-}
-
-function isFocusVisible(event: React.FocusEvent): boolean {
-  const { target } = event;
-  try {
-    return target.matches(':focus-visible');
-  } catch (error) {
-    // Browsers not implementing :focus-visible will throw a SyntaxError.
-    // We use our own heuristic for those browsers.
-    // Rethrow might be better if it's not the expected error but do we really
-    // want to crash if focus-visible malfunctioned?
-  }
-
-  // No need for validFocusTarget check. The user does that by attaching it to
-  // focusable events only.
-  return hadKeyboardEvent || focusTriggersKeyboardModality(target);
-}
-
-export interface UseIsFocusVisibleResult {
-  isFocusVisibleRef: React.MutableRefObject<boolean>;
-  onBlur: (event: React.FocusEvent<any>) => void;
-  onFocus: (event: React.FocusEvent<any>) => void;
-  ref: React.RefCallback<Element>;
-}
-
-export default function useIsFocusVisible(): UseIsFocusVisibleResult {
-  const ref = React.useCallback((node: HTMLElement) => {
-    if (node != null) {
-      prepare(node.ownerDocument);
-    }
-  }, []);
-
-  const isFocusVisibleRef = React.useRef(false);
-
-  /**
-   * Should be called if a blur event is fired
-   */
-  function handleBlurVisible() {
-    // checking against potential state variable does not suffice if we focus and blur synchronously.
-    // React wouldn't have time to trigger a re-render so `focusVisible` would be stale.
-    // Ideally we would adjust `isFocusVisible(event)` to look at `relatedTarget` for blur events.
-    // This doesn't work in IE11 due to https://github.com/facebook/react/issues/3751
-    // TODO: check again if React releases their internal changes to focus event handling (https://github.com/facebook/react/pull/19186).
-    if (isFocusVisibleRef.current) {
-      // To detect a tab/window switch, we look for a blur event followed
-      // rapidly by a visibility change.
-      // If we don't see a visibility change within 100ms, it's probably a
-      // regular focus change.
-      hadFocusVisibleRecently = true;
-      hadFocusVisibleRecentlyTimeout.start(100, () => {
-        hadFocusVisibleRecently = false;
-      });
-
-      isFocusVisibleRef.current = false;
-
-      return true;
-    }
-
-    return false;
-  }
-
-  /**
-   * Should be called if a blur event is fired
-   */
-  function handleFocusVisible(event: React.FocusEvent) {
-    if (isFocusVisible(event)) {
-      isFocusVisibleRef.current = true;
-      return true;
-    }
-    return false;
-  }
-
-  return { isFocusVisibleRef, onFocus: handleFocusVisible, onBlur: handleBlurVisible, ref };
-}