debug react routes

1import React, { Component } from 'react';
2import { BrowserRouter, Route, Switch } from 'react-router-dom';
3import Login from 'components/Login'
4import DefaultComponent from 'components/DefaultComponent'
5
6class DebugRouter extends BrowserRouter {
7  constructor(props){
8    super(props);
9    console.log('initial history is: ', JSON.stringify(this.history, null,2))
10    this.history.listen((location, action)=>{
11      console.log(
12        `The current URL is ${location.pathname}${location.search}${location.hash}`
13      )
14      console.log(`The last navigation action was ${action}`, JSON.stringify(this.history, null,2));
15    });
16  }
17}
18
19class App extends Component {
20  render() {
21    return (
22      <DebugRouter>
23        <Switch>
24          <Route exact path="/login" name="Login Page" component={Login} />
25          <Route path="/" name="Home" component={DefaultComponent} />
26        </Switch>
27      </DebugRouter>
28    );
29  }
30}
31