Next.js: 14.0.3

When you try to test a component or hook that uses some function from "next/navigation" module (like useRouter, useSearchParams, useSearchParams, etc.), you may come across the error:

● Test suite failed to run
 
  invariant expected app router to be mounted
 
    5 |
    6 | export default function useQueryState(key: string, defaultValue: string = '') {
  > 7 |   const router = useRouter()
      |                           ^
    8 |   const searchParams = useSearchParams()
    9 |   const pathname = usePathname()
   10 |

This happening because the "next/navigation" just works when app router was monted, to solve this, you need to mock the entire module. Put this before all your describes and it/tests:

jest.mock('next/navigation', () => ({
  useRouter: jest.fn(() => ({
    replace: jest.fn()
  })),
  useSearchParams: jest.fn(() => ({
    get: jest.fn()
  })),
  usePathname: jest.fn()
}))

references: https://github.com/vercel/next.js/discussions/48937