diff --git a/packages/hooks/__tests__/use-attrs.vitest.tsx b/packages/hooks/__tests__/use-attrs.vitest.tsx
index 72d7a706fe..bcad5831cd 100644
--- a/packages/hooks/__tests__/use-attrs.vitest.tsx
+++ b/packages/hooks/__tests__/use-attrs.vitest.tsx
@@ -1,6 +1,6 @@
 import { defineComponent } from 'vue'
 import { mount } from '@vue/test-utils'
-import { afterEach, describe, expect, fn, it, vi } from 'vitest'
+import { afterEach, describe, expect, it, vi } from 'vitest'
 import { useAttrs } from '../use-attrs'
 
 const CLASS = 'a'
@@ -9,7 +9,7 @@ const TEST_KEY = 'test'
 const TEST_VALUE = 'fake'
 const ANOTHER_TEST_VALUE = 'fake1'
 
-const handleClick = fn()
+const handleClick = vi.fn()
 
 const genComp = (
   inheritAttrs = true,
diff --git a/packages/hooks/__tests__/use-deprecated.vitest.ts b/packages/hooks/__tests__/use-deprecated.vitest.ts
index 5bc46de09f..8e4465914b 100644
--- a/packages/hooks/__tests__/use-deprecated.vitest.ts
+++ b/packages/hooks/__tests__/use-deprecated.vitest.ts
@@ -1,6 +1,6 @@
 import { computed, defineComponent, nextTick } from 'vue'
 import { mount } from '@vue/test-utils'
-import { afterEach, describe, expect, fn, it, vi } from 'vitest'
+import { afterEach, describe, expect, it, vi } from 'vitest'
 import { debugWarn } from '@element-plus/utils'
 import { useDeprecated } from '../use-deprecated'
 
@@ -9,7 +9,7 @@ const AXIOM = 'Rem is the best girl'
 vi.mock('@element-plus/utils/error', async () => {
   return {
     ...(await vi.importActual<any>('@element-plus/utils/error')),
-    debugWarn: fn(),
+    debugWarn: vi.fn(),
   }
 })
 
diff --git a/packages/hooks/__tests__/use-modal.vitest.ts b/packages/hooks/__tests__/use-modal.vitest.ts
index 6ba716bd26..f3bb5244a6 100644
--- a/packages/hooks/__tests__/use-modal.vitest.ts
+++ b/packages/hooks/__tests__/use-modal.vitest.ts
@@ -1,12 +1,12 @@
 import { nextTick, ref } from 'vue'
-import { describe, expect, fn, it } from 'vitest'
+import { describe, expect, it, vi } from 'vitest'
 import { EVENT_CODE } from '@element-plus/constants'
 import { useModal } from '../use-modal'
 
 describe('useModal', () => {
   it('should work when ref value changed', async () => {
     const visible = ref(false)
-    const handleClose = fn()
+    const handleClose = vi.fn()
 
     useModal(
       {
diff --git a/packages/hooks/__tests__/use-model-toggle.vitest.tsx b/packages/hooks/__tests__/use-model-toggle.vitest.tsx
index 2796e4f95b..d41e4aa415 100644
--- a/packages/hooks/__tests__/use-model-toggle.vitest.tsx
+++ b/packages/hooks/__tests__/use-model-toggle.vitest.tsx
@@ -1,14 +1,14 @@
 import { defineComponent, nextTick, reactive, ref } from 'vue'
 import { mount } from '@vue/test-utils'
-import { afterEach, beforeEach, describe, expect, fn, it } from 'vitest'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
 
 import { useModelToggle, useModelToggleProps } from '../use-model-toggle'
 import type { VueWrapper } from '@vue/test-utils'
 
 const AXIOM = 'Rem is the best girl'
 
-const onShow = fn()
-const onHide = fn()
+const onShow = vi.fn()
+const onHide = vi.fn()
 let flag = true
 const shouldProceed = () => flag
 
diff --git a/packages/hooks/__tests__/use-prevent-global.vitest.ts b/packages/hooks/__tests__/use-prevent-global.vitest.ts
index 1829ea0100..0ef10b5e15 100644
--- a/packages/hooks/__tests__/use-prevent-global.vitest.ts
+++ b/packages/hooks/__tests__/use-prevent-global.vitest.ts
@@ -5,15 +5,15 @@ import {
   beforeEach,
   describe,
   expect,
-  fn,
   it,
+  vi,
 } from 'vitest'
 import triggerEvent from '@element-plus/test-utils/trigger-event'
 import { usePreventGlobal } from '../use-prevent-global'
 
 describe('usePreventGlobal', () => {
   const evtName = 'keydown'
-  const evtHandler = fn()
+  const evtHandler = vi.fn()
   beforeAll(() => {
     document.body.addEventListener(evtName, evtHandler)
   })
@@ -28,7 +28,7 @@ describe('usePreventGlobal', () => {
 
   it('should prevent global event from happening', () => {
     const visible = ref(true)
-    const evt2Trigger = fn().mockReturnValue(true)
+    const evt2Trigger = vi.fn().mockReturnValue(true)
     usePreventGlobal(visible, evtName, evt2Trigger)
 
     triggerEvent(document.body, evtName)
@@ -40,7 +40,7 @@ describe('usePreventGlobal', () => {
 
   it('should not prevent global event from happening', () => {
     const visible = ref(true)
-    const evt2Trigger = fn().mockReturnValue(false)
+    const evt2Trigger = vi.fn().mockReturnValue(false)
     usePreventGlobal(visible, evtName, evt2Trigger)
 
     triggerEvent(document.body, evtName)
diff --git a/packages/utils/__tests__/dom/aria.vitest.ts b/packages/utils/__tests__/dom/aria.vitest.ts
index a7eed37ae6..a93e62046f 100644
--- a/packages/utils/__tests__/dom/aria.vitest.ts
+++ b/packages/utils/__tests__/dom/aria.vitest.ts
@@ -1,4 +1,4 @@
-import { describe, expect, it, spyOn } from 'vitest'
+import { describe, expect, it, vi } from 'vitest'
 import { isFocusable, triggerEvent } from '../..'
 
 const CE = (tag: string) => document.createElement(tag)
@@ -7,7 +7,7 @@ describe('Aria Utils', () => {
   describe('Trigger Event', () => {
     it('Util trigger event to trigger event correctly', () => {
       const div = document.createElement('div')
-      spyOn(div, 'dispatchEvent')
+      vi.spyOn(div, 'dispatchEvent')
       const eventName = 'click'
       triggerEvent(div, eventName)
       expect(div.dispatchEvent).toHaveBeenCalled()