fix(useTimeout): clear setTimeout when component is unMounted

lmhcoding · Sep 20, 2020 · 6a00858 · 6a00858
1 parent 079a6c8
commit 6a00858
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 1 deletion.
diff --git a/src/useTimeout.ts b/src/useTimeout.ts
@@ -1,4 +1,4 @@
-import { ref } from 'vue'
+import { getCurrentInstance, onUnmounted, ref } from 'vue'
 
 export function useTimeout(delay = 1000, immediate = true) {
   const ready = ref(false)
@@ -18,6 +18,8 @@ export function useTimeout(delay = 1000, immediate = true) {
   }
   immediate && initTimeout()
 
+  getCurrentInstance() && onUnmounted(stop)
+
   return {
     ready,
     start: () => initTimeout(),

diff --git a/tests/useTimeout.test.ts b/tests/useTimeout.test.ts
@@ -1,4 +1,5 @@
 import { useTimeout } from '../src/useTimeout'
+import invokeHook from './util/invokeHook'
 
 beforeEach(() => {
   jest.useFakeTimers()
@@ -39,3 +40,11 @@ test('setTimeout should be clear after calling stop', () => {
   stop()
   expect(clearTimeout).toHaveBeenCalledTimes(1)
 })
+
+test('timeout should be clear when component is unmount', () => {
+  const wrapper = invokeHook(() => {
+    useTimeout(1000, true)
+  })
+  wrapper.unmount()
+  expect(clearTimeout).toHaveBeenCalledTimes(1)
+})