mirror of
https://github.com/elastic/kibana.git
synced 2025-06-28 11:05:39 -04:00
a1d02824f1
## Summary Why? To simplify the process of migration to react-router@6. https://github.com/remix-run/react-router/discussions/8753 What problems exactly it solves? - In my previous PR I added `CompatRouter` https://github.com/elastic/kibana/pull/159173, which caused changes in ~50 files and pinged 15 Teams. And this is just meant to be a temporary change, so when we're done with the migration I would have to revert these changes and engage everyone to review the PR again. And it is just a single step in the migration strategy. So to make our lives easier I think it would be better to have a common place where we do import our router components because it will allow us to surface some extra logic in single place instead of going through the whole source code again. - `react-router@6` doesn't support a custom `Route` component, so that means our custom `Route` component that we're using almost everywhere today, will need to be replaced by a different solution. I have decided to add `Routes` component, which will be responsible for rendering the proper component (`react-router@6` renamed `Switch` to `Routes`, so I have named this component to align with the dictionary of the new router) and also is going to add the logic that today is done in `Route` (moving logic to `Routes` will be done in the follow-up PR, here I just wanted to focus on using the common router components to make the review process easier) --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
45 lines
1.6 KiB
TypeScript
45 lines
1.6 KiB
TypeScript
/*
|
|
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
* or more contributor license agreements. Licensed under the Elastic License
|
|
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
* Side Public License, v 1.
|
|
*/
|
|
|
|
import React, { Component, FC } from 'react';
|
|
import { shallow } from 'enzyme';
|
|
import { Route } from './route';
|
|
import { createMemoryHistory } from 'history';
|
|
|
|
describe('Route', () => {
|
|
test('renders', () => {
|
|
const example = shallow(<Route />);
|
|
expect(example).toMatchSnapshot();
|
|
});
|
|
|
|
test('location renders as expected', () => {
|
|
// create a history
|
|
const historyLocation = createMemoryHistory();
|
|
// add the path to the history
|
|
historyLocation.push('/app/wow');
|
|
// prevent the location key from remaking itself each jest test
|
|
historyLocation.location.key = 's5brde';
|
|
// the Route component takes the history location
|
|
const example = shallow(<Route location={historyLocation.location} />);
|
|
expect(example).toMatchSnapshot();
|
|
});
|
|
|
|
test('component prop renders', () => {
|
|
const sampleComponent: FC<{}> = () => {
|
|
return <Component>Test</Component>;
|
|
};
|
|
const example = shallow(<Route component={sampleComponent} />);
|
|
expect(example).toMatchSnapshot();
|
|
});
|
|
|
|
test('render prop renders', () => {
|
|
const sampleReactNode = React.createElement('li', { id: 'li1' }, 'one');
|
|
const example = shallow(<Route render={() => sampleReactNode} />);
|
|
expect(example).toMatchSnapshot();
|
|
});
|
|
});
|