Problems in unit tests: "useLocation" in UMI

[aspirantzhang]

A very simple component

import { useLocation } from 'umi';

const Index = () => {
  const location = useLocation();

  return <div>{location.pathname}</div>;
};

export default Index;

and the test. Ref: React Router - Testing libaray

/**
 * @jest-environment jsdom
 */
import React from 'react';
import { render } from '@testing-library/react';
import { createBrowserHistory, Router } from 'umi';
import '@testing-library/jest-dom/extend-expect';

import Index from './index';

test('index', () => {
  const history = createBrowserHistory();
  history.push('/test/ok');

  const renderer = render(
    <Router history={history}>
      <Index />
    </Router>,
  );

  expect(renderer).toMatchSnapshot();
});

But it says "Invalid hook call".

What's the right way. Can you give me some advice or example? Thanks.

[aspirantzhang]

React 17 + React Testing Library + Umi

After a period of trying, I found two ways to solve.

1. Downgrade to React 16.x, then all will be fine.
2. Keep using React 17.x, and
   • Still have to write import React from 'react'
   • Install react-router-dom separately

I think it may be a problem with react-router, but due to my limited understanding, I don't have a better solution yet.