how to test Router.push options with Jest / React

Viewed 886

I'm new to testing with routing and was wondering how I would go about testing this

const handleFilter = (items: ParsedUrlQueryInput) => {
    push({ pathname: '/games', query: items }, undefined, { scroll: false });
    return;
  };

<S.ShowMoreButton role="button" onClick={handleShowMore}

I made some mocks and the following test worked without the options, but when I add options, it's impossible to test

mock

  const useRouter = jest.spyOn(require('next/router'), 'useRouter');
    const push = jest.fn();
    
    useRouter.mockImplementation(() => ({
      push,
      query: '',
      asPath: '',
      route: '/',
    }));

test

expect(push).toHaveBeenCalledWith({
      pathname: '/games',
      query: { platforms: ['windows', 'linux'], sort_by: 'low-to-high' },
    });

error in test

  Expected: {"pathname": "/games", "query": {"platforms": ["windows", "linux"], "sort_by": "low-to-high"}}
    Received
           1
              Object {
                "pathname": "/games",
            -   "query": Object {
            -     "platforms": Array [
            -       "windows",
            -       "linux",
            -     ],
            -     "sort_by": "low-to-high",
            -   },
            +   "query": Object {},
              },
            + undefined,
            + {"scroll": false}
0 Answers
Related