Upgrade to react-router-dom v5.2.0 (jaegertracing#727)

* feat: upgrade to react-router-dom v5.2.0 Signed-off-by: Meenal Trivedi <meenaltrivedi6102@gmail.com> * fix: lint Signed-off-by: Meenal Trivedi <meenaltrivedi6102@gmail.com> * fix Signed-off-by: Meenal Trivedi <meenaltrivedi6102@gmail.com> * update snapshots to accomodate latest changes Signed-off-by: Meenal Trivedi <meenaltrivedi6102@gmail.com> * fix Signed-off-by: Meenal Trivedi <meenaltrivedi6102@gmail.com> * fix: object only has getter Signed-off-by: Meenal Trivedi <meenaltrivedi6102@gmail.com> * fix: tests Signed-off-by: Meenal Trivedi <meenaltrivedi6102@gmail.com> Signed-off-by: vvvprabhakar <vvvprabhakar@gmail.com>
vvvprabhakar · Jul 4, 2021 · 3669eb9 · 3669eb9
1 parent e97bf81
commit 3669eb9
Show file tree

Hide file tree

Showing 11 changed files with 37 additions and 18 deletions.
diff --git a/packages/jaeger-ui/package.json b/packages/jaeger-ui/package.json
@@ -87,7 +87,7 @@
     "react-icons": "2.2.7",
     "react-metrics": "^2.3.2",
     "react-redux": "^5.0.6",
-    "react-router-dom": "^4.3.1",
+    "react-router-dom": "^5.2.0",
     "react-router-redux": "5.0.0-alpha.6",
     "react-virtualized-select": "^3.1.0",
     "react-vis": "^1.7.2",

diff --git a/packages/jaeger-ui/src/components/App/TopNav.test.js b/packages/jaeger-ui/src/components/App/TopNav.test.js
@@ -72,17 +72,16 @@ describe('<TopNav>', () => {
 
   describe('renders the default menu options', () => {
     it('renders the "JAEGER UI" link', () => {
-      const items = wrapper.find(Link).findWhere(link => /JAEGER UI/.test(link.text()));
+      const items = wrapper.find(Link).findWhere(link => link.prop('to') === '/');
       expect(items.length).toBe(1);
     });
-
     it('renders the "Search" button', () => {
-      const items = wrapper.find(Link).findWhere(link => /Search/.test(link.text()));
+      const items = wrapper.find(Link).findWhere(link => link.prop('to') === '/search');
       expect(items.length).toBe(1);
     });
 
     it('renders the "System Architecture" button', () => {
-      const items = wrapper.find(Link).findWhere(link => /System Architecture/.test(link.text()));
+      const items = wrapper.find(Link).findWhere(link => link.prop('to') === '/dependencies');
       expect(items.length).toBe(1);
     });
   });

diff --git a/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap b/packages/jaeger-ui/src/components/App/__snapshots__/index.test.js.snap
@@ -63,19 +63,16 @@ exports[`JaegerUIApp does not explode 1`] = `
         <Redirect
           exact={true}
           path="/"
-          push={false}
           to="/search"
         />
         <Redirect
           exact={true}
           path=""
-          push={false}
           to="/search"
         />
         <Redirect
           exact={true}
           path="/"
-          push={false}
           to="/search"
         />
         <Route

diff --git a/packages/jaeger-ui/src/components/DeepDependencies/url.test.js b/packages/jaeger-ui/src/components/DeepDependencies/url.test.js
@@ -17,6 +17,10 @@ import * as reactRouterDom from 'react-router-dom';
 
 import { ROUTE_PATH, matches, getUrl, getUrlState, sanitizeUrlState } from './url';
 
+jest.mock('react-router-dom', () => ({
+  matchPath: jest.fn(),
+}));
+
 describe('DeepDependencyGraph/url', () => {
   describe('matches', () => {
     const path = 'path argument';

diff --git a/packages/jaeger-ui/src/components/QualityMetrics/url.test.js b/packages/jaeger-ui/src/components/QualityMetrics/url.test.js
@@ -16,6 +16,10 @@ import * as reactRouterDom from 'react-router-dom';
 
 import { ROUTE_PATH, matches, getUrl, getUrlState } from './url';
 
+jest.mock('react-router-dom', () => ({
+  matchPath: jest.fn(),
+}));
+
 describe('TraceDiff/url', () => {
   const lookback = 42;
   const service = 'test-service';

diff --git a/...-ui/src/components/SearchTracePage/SearchResults/__snapshots__/DiffSelection.test.js.snap b/...-ui/src/components/SearchTracePage/SearchResults/__snapshots__/DiffSelection.test.js.snap
@@ -97,7 +97,6 @@ exports[`DiffSelection renders multiple traces as expected 1`] = `
     className="DiffSelection--message"
   >
     <Link
-      replace={false}
       to="/trace/trace-id-0...trace-id-1?cohort=trace-id-0&cohort=trace-id-1"
     >
       <Button

diff --git a/...i/src/components/SearchTracePage/SearchResults/__snapshots__/ResultItemTitle.test.js.snap b/...i/src/components/SearchTracePage/SearchResults/__snapshots__/ResultItemTitle.test.js.snap
@@ -15,7 +15,6 @@ exports[`ResultItemTitle renders as expected 1`] = `
   />
   <Link
     className="ResultItemTitle--item ub-flex-auto"
-    replace={false}
     to="linkToValue"
   >
     <span

diff --git a/packages/jaeger-ui/src/components/SearchTracePage/url.test.js b/packages/jaeger-ui/src/components/SearchTracePage/url.test.js
@@ -17,6 +17,10 @@ import * as reactRouterDom from 'react-router-dom';
 import { MAX_LENGTH } from '../DeepDependencies/Graph/DdgNodeContent/constants';
 import { ROUTE_PATH, getUrl, getUrlState, isSameQuery, matches } from './url';
 
+jest.mock('react-router-dom', () => ({
+  matchPath: jest.fn(),
+}));
+
 describe('SearchTracePage/url', () => {
   const span0 = 'span-0';
   const span1 = 'span-1';

diff --git a/packages/jaeger-ui/src/components/TraceDiff/url.test.js b/packages/jaeger-ui/src/components/TraceDiff/url.test.js
@@ -16,6 +16,10 @@ import * as reactRouterDom from 'react-router-dom';
 
 import { ROUTE_PATH, matches, getUrl } from './url';
 
+jest.mock('react-router-dom', () => ({
+  matchPath: jest.fn(),
+}));
+
 describe('TraceDiff/url', () => {
   describe('matches', () => {
     const path = 'path argument';

diff --git a/...ger-ui/src/components/TracePage/TracePageHeader/__snapshots__/AltViewOptions.test.js.snap b/...ger-ui/src/components/TracePage/TracePageHeader/__snapshots__/AltViewOptions.test.js.snap
@@ -28,26 +28,24 @@ exports[`AltViewOptions renders correctly 1`] = `
         </a>
       </MenuItem>
       <MenuItem>
-        <Link
+        <ForwardRef
           onClick={[MockFunction]}
           rel="noopener noreferrer"
-          replace={false}
           target="_blank"
           to="/api/traces/test trace ID?prettyPrint=true"
         >
           Trace JSON
-        </Link>
+        </ForwardRef>
       </MenuItem>
       <MenuItem>
-        <Link
+        <ForwardRef
           onClick={[MockFunction]}
           rel="noopener noreferrer"
-          replace={false}
           target="_blank"
           to="/api/traces/test trace ID?raw=true&prettyPrint=true"
         >
           Trace JSON (unadjusted)
-        </Link>
+        </ForwardRef>
       </MenuItem>
     </Menu>
   }

diff --git a/packages/jaeger-ui/src/index.js b/packages/jaeger-ui/src/index.js
@@ -18,6 +18,7 @@
 import './site-prefix';
 
 import React from 'react';
+import { BrowserRouter } from 'react-router-dom';
 import ReactDOM from 'react-dom';
 import { document } from 'global';
 
@@ -37,8 +38,18 @@ const UI_ROOT_ID = 'jaeger-ui-root';
 
 if (trackingContext) {
   trackingContext.context(() => {
-    ReactDOM.render(<JaegerUIApp />, document.getElementById(UI_ROOT_ID));
+    ReactDOM.render(
+      <BrowserRouter>
+        <JaegerUIApp />
+      </BrowserRouter>,
+      document.getElementById(UI_ROOT_ID)
+    );
   });
 } else {
-  ReactDOM.render(<JaegerUIApp />, document.getElementById(UI_ROOT_ID));
+  ReactDOM.render(
+    <BrowserRouter>
+      <JaegerUIApp />
+    </BrowserRouter>,
+    document.getElementById(UI_ROOT_ID)
+  );
 }