Properly msw server to return success response for unhandled requests temporary

Fix store issue in RediSearchIndexesList.spec.tsx

Author: ArtemHoruzhenko

redisinsight/ui/src/mocks/server.ts

@@ -1,5 +1,14 @@
 import { setupServer } from 'msw/node'
+import { http, HttpResponse } from 'msw'
 import { handlers } from './handlers'
 
 // Setup requests interception using the given handlers.
-export const mswServer = setupServer(...handlers)
+export const mswServer = setupServer(
+  ...handlers,
+  http.all(
+    '*',
+    jest
+      .fn()
+      .mockImplementation(async () => HttpResponse.json({}, { status: 200 })),
+  ),
+)

redisinsight/ui/src/pages/browser/components/redisearch-key-list/RediSearchIndexesList.spec.tsx

@@ -1,4 +1,4 @@
-import { cloneDeep } from 'lodash'
+import { merge } from 'lodash'
 import React from 'react'
 import { instance, mock } from 'ts-mockito'
 import { useSelector } from 'react-redux'
@@ -7,13 +7,16 @@ import {
   cleanup,
   clearStoreActions,
   fireEvent,
+  initialStateDefault,
   mockedStore,
+  mockStore,
   render,
   screen,
   userEvent,
 } from 'uiSrc/utils/test-utils'
 import {
   loadList,
+  loadListSuccess,
   redisearchListSelector,
   setSelectedIndex,
 } from 'uiSrc/slices/browser/redisearch'
@@ -25,11 +28,25 @@ import { connectedInstanceSelector } from 'uiSrc/slices/instances/instances'
 import { changeSearchMode, fetchKeys } from 'uiSrc/slices/browser/keys'
 import { BrowserStorageItem } from 'uiSrc/constants'
 import RediSearchIndexesList, { Props } from './RediSearchIndexesList'
+import { INSTANCE_ID_MOCK } from 'uiSrc/mocks/handlers/instances/instancesHandlers'
+import { setStoreRef } from 'uiSrc/utils/test-store'
+import { REDISEARCH_LIST_DATA_MOCK } from 'uiSrc/mocks/handlers/browser/redisearchHandlers'
 
 let store: typeof mockedStore
 beforeEach(() => {
   cleanup()
-  store = cloneDeep(mockedStore)
+  store = mockStore(
+    merge({}, initialStateDefault, {
+      connections: {
+        instances: {
+          connectedInstance: {
+            id: INSTANCE_ID_MOCK,
+          },
+        },
+      },
+    }),
+  )
+  setStoreRef(store)
   store.clearActions()
 })
 
@@ -74,6 +91,10 @@ jest.mock('uiSrc/services', () => ({
   },
 }))
 
+const renderRediSearchIndexesList = (props: Props) => {
+  return render(<RediSearchIndexesList {...props} />, { store })
+}
+
 describe('RediSearchIndexesList', () => {
   beforeEach(() => {
     const state: any = store.getState()
@@ -109,9 +130,7 @@ describe('RediSearchIndexesList', () => {
   })
 
   it('should render', () => {
-    expect(
-      render(<RediSearchIndexesList {...instance(mockedProps)} />),
-    ).toBeTruthy()
+    expect(renderRediSearchIndexesList(instance(mockedProps))).toBeTruthy()
     const searchInput = screen.getByTestId('select-search-mode')
     expect(searchInput).toBeInTheDocument()
   })
@@ -123,9 +142,7 @@ describe('RediSearchIndexesList', () => {
       modules: [],
     }))
 
-    expect(
-      render(<RediSearchIndexesList {...instance(mockedProps)} />),
-    ).toBeTruthy()
+    expect(renderRediSearchIndexesList(instance(mockedProps))).toBeTruthy()
 
     const expectedActions = [
       changeSearchMode(SearchMode.Pattern),
@@ -143,9 +160,7 @@ describe('RediSearchIndexesList', () => {
   })
 
   it('"loadList" should be called after render', () => {
-    const { rerender } = render(
-      <RediSearchIndexesList {...instance(mockedProps)} />,
-    )
+    const { rerender } = renderRediSearchIndexesList(instance(mockedProps))
 
     ;(connectedInstanceSelector as jest.Mock).mockImplementation(() => ({
       host: '123.23.1.1',
@@ -162,12 +177,10 @@ describe('RediSearchIndexesList', () => {
 
   it('"onCreateIndex" should be called after click Create Index', async () => {
     const onCreateIndexMock = jest.fn()
-    const { findByText } = render(
-      <RediSearchIndexesList
-        {...instance(mockedProps)}
-        onCreateIndex={onCreateIndexMock}
-      />,
-    )
+    const { findByText } = renderRediSearchIndexesList({
+      ...instance(mockedProps),
+      onCreateIndex: onCreateIndexMock,
+    })
 
     await userEvent.click(screen.getByTestId('select-search-mode'))
     await userEvent.click((await findByText('Create Index')) || document)
@@ -187,9 +200,7 @@ describe('RediSearchIndexesList', () => {
       selectedIndex: null,
     })
 
-    const { queryByText } = render(
-      <RediSearchIndexesList {...instance(mockedProps)} />,
-    )
+    const { queryByText } = renderRediSearchIndexesList(instance(mockedProps))
 
     ;(connectedInstanceSelector as jest.Mock).mockImplementation(() => ({
       host: '123.123.1.1',
@@ -199,7 +210,11 @@ describe('RediSearchIndexesList', () => {
     await userEvent.click(screen.getByTestId('select-search-mode'))
     await userEvent.click(queryByText(bufferToString(index)) || document)
 
-    const expectedActions = [setSelectedIndex(index), loadList()]
+    const expectedActions = [
+      setSelectedIndex(index),
+      loadList(),
+      loadListSuccess(REDISEARCH_LIST_DATA_MOCK.indexes),
+    ]
 
     expect(clearStoreActions(store.getActions())).toEqual(
       clearStoreActions(expectedActions),
@@ -214,7 +229,7 @@ describe('RediSearchIndexesList', () => {
       modules: [{ name: RedisDefaultModules.Search }],
     }))
 
-    render(<RediSearchIndexesList {...instance(mockedProps)} />)
+    renderRediSearchIndexesList(instance(mockedProps))
 
     const afterRenderActions = [...store.getActions()]
 

redisinsight/ui/src/setup-tests.ts

@@ -41,24 +41,8 @@ Object.defineProperty(window, 'File', {
 })
 
 beforeAll(() => {
-  // mswServer.listen()
   mswServer.listen({
-    onUnhandledRequest: ((req: any, res: any, ctx: any) => {
-      const url = req.url.href
-      const method = req.method
-      const testName = expect.getState()?.currentTestName ?? 'unknown test'
-
-      // Log it nicely
-      console.warn(`[MSW][${testName}] Unhandled request: ${method} ${url}`)
-
-      // throw to fail the test???
-      // tmp: just return empty object to fix libuv error.
-      // todo: need to find all unhandled requests and probably throw right from here and close socket
-      return res(
-        ctx.status(200),
-        ctx.json({})
-      )
-    }) as any,
+    onUnhandledRequest: 'bypass'
   })
 })