2024-11-25 01:17:34 +08:00
|
|
|
import React from 'react';
|
|
|
|
import { MemoryRouter, useLocation } from 'react-router-dom';
|
|
|
|
import type { Location as ReactRouterLocation } from 'react-router-dom';
|
2024-04-08 14:04:08 +08:00
|
|
|
|
2024-11-25 01:17:34 +08:00
|
|
|
import { render } from '../../../tests/utils';
|
2018-05-25 20:18:23 +08:00
|
|
|
import Breadcrumb from '../index';
|
2018-05-25 15:33:22 +08:00
|
|
|
|
|
|
|
describe('react router', () => {
|
|
|
|
beforeAll(() => {
|
2023-06-07 21:59:21 +08:00
|
|
|
jest.useFakeTimers();
|
2018-05-25 15:33:22 +08:00
|
|
|
});
|
|
|
|
|
|
|
|
afterAll(() => {
|
2023-06-07 21:59:21 +08:00
|
|
|
jest.useRealTimers();
|
2018-05-25 15:33:22 +08:00
|
|
|
});
|
2019-11-05 00:19:02 +08:00
|
|
|
|
2024-11-25 01:17:34 +08:00
|
|
|
it('memoizes the current location', () => {
|
|
|
|
let location1: ReactRouterLocation | undefined;
|
|
|
|
const CaptureLocation1: React.FC = () => {
|
|
|
|
location1 = useLocation();
|
|
|
|
return null;
|
2021-11-11 21:34:07 +08:00
|
|
|
};
|
2024-11-25 01:17:34 +08:00
|
|
|
const { container: container1 } = render(
|
|
|
|
<MemoryRouter>
|
|
|
|
<CaptureLocation1 />
|
2018-12-07 16:17:45 +08:00
|
|
|
</MemoryRouter>,
|
2018-05-25 15:33:22 +08:00
|
|
|
);
|
2024-11-25 01:17:34 +08:00
|
|
|
expect(container1).toBeTruthy();
|
|
|
|
expect(location1).toBeDefined();
|
2022-06-28 18:47:21 +08:00
|
|
|
|
2024-11-25 01:17:34 +08:00
|
|
|
let location2: ReactRouterLocation | undefined;
|
|
|
|
const CaptureLocation2: React.FC = () => {
|
|
|
|
location2 = useLocation();
|
|
|
|
return null;
|
|
|
|
};
|
|
|
|
const { container: container2 } = render(
|
|
|
|
<MemoryRouter>
|
|
|
|
<CaptureLocation2 />
|
|
|
|
</MemoryRouter>,
|
2020-10-21 10:35:06 +08:00
|
|
|
);
|
2024-11-25 01:17:34 +08:00
|
|
|
expect(container2).toBeTruthy();
|
|
|
|
expect(location2).toBeDefined();
|
|
|
|
|
|
|
|
expect(location1).toEqual(location2);
|
2018-05-25 15:33:22 +08:00
|
|
|
});
|
2018-05-25 19:48:37 +08:00
|
|
|
|
2024-11-25 01:17:34 +08:00
|
|
|
it('react router legacy', () => {
|
2018-12-07 16:17:45 +08:00
|
|
|
const routes = [
|
|
|
|
{
|
|
|
|
name: 'home',
|
|
|
|
breadcrumbName: 'Home',
|
|
|
|
path: '/',
|
|
|
|
childRoutes: [
|
|
|
|
{
|
|
|
|
name: 'apps',
|
|
|
|
breadcrumbName: 'Application List',
|
|
|
|
path: 'apps',
|
|
|
|
childRoutes: [
|
|
|
|
{
|
|
|
|
name: 'app',
|
|
|
|
breadcrumbName: 'Application:id',
|
|
|
|
path: ':id',
|
|
|
|
childRoutes: [
|
|
|
|
{
|
|
|
|
name: 'detail',
|
|
|
|
breadcrumbName: 'Detail',
|
|
|
|
path: 'detail',
|
|
|
|
},
|
|
|
|
],
|
|
|
|
},
|
|
|
|
],
|
|
|
|
},
|
|
|
|
],
|
|
|
|
},
|
|
|
|
{
|
|
|
|
name: 'apps',
|
|
|
|
breadcrumbName: 'Application List',
|
|
|
|
path: 'apps',
|
|
|
|
childRoutes: [
|
|
|
|
{
|
|
|
|
name: 'app',
|
|
|
|
breadcrumbName: 'Application:id',
|
|
|
|
path: ':id',
|
|
|
|
childRoutes: [
|
|
|
|
{
|
|
|
|
name: 'detail',
|
|
|
|
breadcrumbName: 'Detail',
|
|
|
|
path: 'detail',
|
|
|
|
},
|
|
|
|
],
|
|
|
|
},
|
|
|
|
],
|
|
|
|
},
|
|
|
|
{
|
|
|
|
name: 'app',
|
|
|
|
breadcrumbName: 'Application:id',
|
|
|
|
path: ':id',
|
|
|
|
childRoutes: [
|
|
|
|
{
|
|
|
|
name: 'detail',
|
|
|
|
breadcrumbName: 'Detail',
|
|
|
|
path: 'detail',
|
|
|
|
},
|
|
|
|
],
|
|
|
|
},
|
|
|
|
{
|
|
|
|
name: 'detail',
|
|
|
|
breadcrumbName: 'Detail',
|
|
|
|
path: 'detail',
|
|
|
|
},
|
|
|
|
];
|
2022-06-28 18:47:21 +08:00
|
|
|
const { asFragment } = render(<Breadcrumb routes={routes} params={{ id: 1 }} />);
|
|
|
|
expect(asFragment().firstChild).toMatchSnapshot();
|
2018-05-25 19:48:37 +08:00
|
|
|
});
|
2018-05-25 15:33:22 +08:00
|
|
|
});
|