test(react-query-devtools/ReactQueryDevtools): add tests for forwarding option changes after mount

packages/react-query-devtools/src/__tests__/ReactQueryDevtools.test.tsx

@@ -182,6 +182,83 @@ describe('ReactQueryDevtools', () => {
     )
   })
 
+  it('should forward a "buttonPosition" change to the devtools instance after mount', async () => {
+    const { ReactQueryDevtools } = await import('../ReactQueryDevtools')
+    const queryClient = new QueryClient()
+
+    const { rerender } = render(
+      <ReactQueryDevtools client={queryClient} buttonPosition="bottom-right" />,
+    )
+    setButtonPositionMock.mockClear()
+
+    rerender(
+      <ReactQueryDevtools client={queryClient} buttonPosition="top-left" />,
+    )
+
+    expect(setButtonPositionMock).toHaveBeenCalledWith('top-left')
+  })
+
+  it('should forward a "position" change to the devtools instance after mount', async () => {
+    const { ReactQueryDevtools } = await import('../ReactQueryDevtools')
+    const queryClient = new QueryClient()
+
+    const { rerender } = render(
+      <ReactQueryDevtools client={queryClient} position="bottom" />,
+    )
+    setPositionMock.mockClear()
+
+    rerender(<ReactQueryDevtools client={queryClient} position="top" />)
+
+    expect(setPositionMock).toHaveBeenCalledWith('top')
+  })
+
+  it('should forward an "initialIsOpen" change to the devtools instance after mount', async () => {
+    const { ReactQueryDevtools } = await import('../ReactQueryDevtools')
+    const queryClient = new QueryClient()
+
+    const { rerender } = render(
+      <ReactQueryDevtools client={queryClient} initialIsOpen={false} />,
+    )
+    setInitialIsOpenMock.mockClear()
+
+    rerender(<ReactQueryDevtools client={queryClient} initialIsOpen={true} />)
+
+    expect(setInitialIsOpenMock).toHaveBeenCalledWith(true)
+  })
+
+  it('should forward an "errorTypes" change to the devtools instance after mount', async () => {
+    const { ReactQueryDevtools } = await import('../ReactQueryDevtools')
+    const queryClient = new QueryClient()
+
+    const { rerender } = render(
+      <ReactQueryDevtools client={queryClient} errorTypes={[]} />,
+    )
+    setErrorTypesMock.mockClear()
+
+    const errorTypes = [
+      { name: 'Network', initializer: () => new Error('Network') },
+    ]
+    rerender(
+      <ReactQueryDevtools client={queryClient} errorTypes={errorTypes} />,
+    )
+
+    expect(setErrorTypesMock).toHaveBeenCalledWith(errorTypes)
+  })
+
+  it('should forward a "theme" change to the devtools instance after mount', async () => {
+    const { ReactQueryDevtools } = await import('../ReactQueryDevtools')
+    const queryClient = new QueryClient()
+
+    const { rerender } = render(
+      <ReactQueryDevtools client={queryClient} theme="light" />,
+    )
+    setThemeMock.mockClear()
+
+    rerender(<ReactQueryDevtools client={queryClient} theme="dark" />)
+
+    expect(setThemeMock).toHaveBeenCalledWith('dark')
+  })
+
   it('should call "unmount" on the devtools instance when the component unmounts', async () => {
     const { ReactQueryDevtools } = await import('../ReactQueryDevtools')
     const queryClient = new QueryClient()