title: How do you test router match params with jest and enzyme?
body: <p>Say I have the following component which I grabbed from <a href="https://www.codeday.top/2017/11/08/56644.html" rel="noreferrer">https://www.codeday.top/2017/11/08/56644.html</a>. Here I am using match.params to access the id. How would I write a unit test for this component tests the presence of the h2 element using Jest+Enzyme+Typescript+React.</p>
  
  <pre><code>import * as React from 'react';
  import * as ReactDOM from 'react-dom';
  import { Route, BrowserRouter as Router, Link, match } from 'react-router-dom';
  
  // define React components for multiple pages
  class Home extends React.Component&lt;any, any&gt; {
    render() {
      return (
        &lt;div&gt;
          &lt;div&gt;HOME&lt;/div&gt;
          &lt;div&gt;&lt;Link to='/details/id123'&gt;Goto Details&lt;/Link&gt;&lt;/div&gt;
        &lt;/div&gt;);
    }
  }
  
  interface DetailParams {
    id: string;
  }
  
  interface DetailsProps {
    required: string;
    match?: match&lt;DetailParams&gt;;
  }
  
  class Details extends React.Component&lt;DetailsProps, any&gt; {
    render() {
      const match = this.props.match;
      if (match) {
        return (
          &lt;div&gt;
            &lt;h2&gt;Details for {match.params.id}&lt;/h2&gt;
            &lt;Link to='/'&gt;Goto Home&lt;/Link&gt;
          &lt;/div&gt;
        );
      } else {
        return (
          &lt;div&gt;
            &lt;div&gt;Error Will Robinson&lt;/div&gt;
            &lt;Link to='/'&gt;Goto Home&lt;/Link&gt;
          &lt;/div&gt;
        )
      }
    }
  }
  
  ReactDOM.render(
    &lt;Router&gt;
      &lt;div&gt;
        &lt;Route exact path="/" component={Home} /&gt;
        &lt;Route exact path="/details/:id" component={(props) =&gt; &lt;Details required="some string" {...props} /&gt;} /&gt;
      &lt;/div&gt;
    &lt;/Router&gt;
  
    , document.getElementById('root')
  );
  </code></pre>