feat: add useLocalStorage test

qiaoyuwen · qiaoyuwen · commit a3acae6be6c1 · 2021-07-06T09:29:37.000+08:00
diff --git a/packages/react-hooks/src/local-storage/__tests__/index.test.ts b/packages/react-hooks/src/local-storage/__tests__/index.test.ts
@@ -46,4 +46,68 @@ describe('useLocalStorage', () => {
     });
     expect(result.current[0]).toBe('newTestValue');
   });
+
+  test('listen on change value parse error', () => {
+    const { result } = renderHook(() => useLocalStorage('testKey', 'testValue'));
+    const event = new window.StorageEvent('storage', {
+      key: 'testKey',
+      oldValue: '"testValue"',
+      newValue: 'invalid json',
+      storageArea: window.localStorage,
+    });
+    act(() => {
+      window.dispatchEvent(event);
+    });
+    expect(result.current[0]).toBe('testValue');
+  });
+
+  test('listen on change value null', () => {
+    const { result } = renderHook(() => useLocalStorage('testKey', 'testValue'));
+    const event = new window.StorageEvent('storage', {
+      key: 'testKey',
+      oldValue: '"testValue"',
+      newValue: null,
+      storageArea: window.localStorage,
+    });
+    act(() => {
+      window.dispatchEvent(event);
+    });
+    expect(result.current[0]).toBe('testValue');
+  });
+
+  test('ignore unexpected change key', () => {
+    const { result } = renderHook(() => useLocalStorage('testKey', 'testValue'));
+    const event = new window.StorageEvent('storage', {
+      key: 'otherKey',
+      oldValue: '"value"',
+      newValue: '"newValue"',
+      storageArea: window.localStorage,
+    });
+    act(() => {
+      window.dispatchEvent(event);
+    });
+    expect(result.current[0]).toBe('testValue');
+  });
+
+  test('ignore session storage change', () => {
+    const { result } = renderHook(() => useLocalStorage('testKey', 'testValue'));
+    const event = new window.StorageEvent('storage', {
+      key: 'testKey',
+      oldValue: '"testValue"',
+      newValue: '"newTestValue"',
+      storageArea: window.sessionStorage,
+    });
+    act(() => {
+      window.dispatchEvent(event);
+    });
+    expect(result.current[0]).toBe('testValue');
+  });
+
+  test('set local storage value', () => {
+    const { result } = renderHook(() => useLocalStorage('testKey', 'testValue'));
+    act(() => {
+      result.current[1]('newTestValue');
+    });
+    expect(result.current[0]).toBe('newTestValue');
+  });
 });
diff --git a/packages/react-hooks/src/local-storage/index.ts b/packages/react-hooks/src/local-storage/index.ts
@@ -15,6 +15,7 @@ export function useLocalStorage<T>(key: string, initialValue: T) {
   const setLocalStorageValue = useCallback(
     (newValue: T) => {
       window.localStorage.setItem(key, JSON.stringify(newValue));
+      setValue(newValue);
     },
     [key],
   );
