lint and test case

Author: Liang yung huang

packages/app/src/__tests__/utils.test.ts

@@ -7,8 +7,8 @@ import {
   formatDate,
   formatNumber,
   getMetricTableName,
+  useQueryHistory
 } from '../utils';
-import * as utils from '../utils';
 
 describe('utils', () => {
   it('12h utc', () => {
@@ -272,39 +272,54 @@ describe('formatNumber', () => {
 });
 
 describe('useQueryHistory', () => {
-  const mockSet = jest.fn();
-  const initialHistory = ['service = test'];
+  const mockGetItem = jest.fn();
+  const mockSetItem = jest.fn();
+  const mockRemoveItem = jest.fn();
 
   beforeEach(() => {
-    jest
-      .spyOn(utils, 'useLocalStorage')
-      .mockReturnValue([initialHistory, mockSet]);
+    mockGetItem.mockClear();
+    mockSetItem.mockClear();
+    mockRemoveItem.mockClear();
+    mockGetItem.mockReturnValue('["service = test3","service = test1"]');
+    Object.defineProperty(window, "localStorage", {
+      value: {
+        getItem: (...args: string[]) => mockGetItem(...args),
+        setItem: (...args: string[]) => mockSetItem(...args),
+        removeItem: (...args: string[]) => mockRemoveItem(...args),
+      },
+    });
   });
 
   afterEach(() => {
     jest.restoreAllMocks();
   });
 
   it('adds new query', () => {
-    const { result } = renderHook(() => utils.useQueryHistory('searchSQL'));
-
+    const { result } = renderHook(() => useQueryHistory('searchSQL'));
+    const setQueryHistory = result.current[1];
     act(() => {
-      const [, setQueryHistory] = result.current;
       setQueryHistory('service = test2');
     });
 
-    expect(mockSet).toHaveBeenCalledWith(['service = test2', 'service = test']);
+    expect(mockSetItem).toHaveBeenCalledWith('QuerySearchHistory.searchSQL', '["service = test2","service = test3","service = test1"]');
   });
 
-  it('does not add empty or duplicate queries', () => {
-    const { result } = renderHook(() => utils.useQueryHistory('searchSQL'));
+  it('does not add duplicate query, but change the order to front', () => {
+    const { result } = renderHook(() => useQueryHistory('searchSQL'));
+    const setQueryHistory = result.current[1];
+    act(() => {
+      setQueryHistory('service = test1');
+    });
+
+    expect(mockSetItem).toHaveBeenCalledWith('QuerySearchHistory.searchSQL', '["service = test1","service = test3"]');
+  });
 
+  it('does not add empty query', () => {
+    const { result } = renderHook(() => useQueryHistory('searchSQL'));
+    const setQueryHistory = result.current[1];
     act(() => {
-      const [, setQueryHistory] = result.current;
       setQueryHistory('   '); // empty after trim
-      setQueryHistory('service = test'); // duplicate
     });
-
-    expect(mockSet).toHaveBeenCalledWith(['service = test']);
+    expect(mockSetItem).not.toBeCalled();
   });
 });

packages/app/src/utils.ts

@@ -249,6 +249,7 @@ export function useQueryHistory<T>(type: string | undefined) {
       }
       _setQueryHistory(newHistory.slice(0, QUERY_LOCAL_STORAGE.LIMIT));
     } catch (e) {
+      // eslint-disable-next-line no-console
       console.log(`Failed to cache query history, error ${e.message}`);
     }
   };