<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> I have searched the <a href="https://github.com/mui-org/material-ui/issues">issues</a> of this repository and believe that this is not a duplicate.</li>
</ul>
<h2 dir="auto">Expected Behavior</h2>

<p dir="auto">As a user who is navigating the react-router enabled site using the keyboard, I have made my way to a Tabs component, and it is displaying keyboard focus properly. To select the focused tab, I hit space bar, and react-router updates my view to the corresponding component.</p>
<h2 dir="auto">Current Behavior</h2>
<p dir="auto">When selecting the keyboard focused tab by hitting spacebar, a javascript error is thrown from Material UI.</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="ButtonBase.js:149 Uncaught TypeError: Cannot read property 'start' of null
    at TouchRipple.&lt;anonymous&gt; (ButtonBase.js:149)
    at commitCallbacks (react-dom.development.js:7250)
    at commitLifeCycles (react-dom.development.js:11524)
    at commitAllLifeCycles (react-dom.development.js:12294)
    at HTMLUnknownElement.callCallback (react-dom.development.js:1299)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:1338)
    at invokeGuardedCallback (react-dom.development.js:1195)
    at commitAllWork (react-dom.development.js:12415)
    at workLoop (react-dom.development.js:12687)
    at HTMLUnknownElement.callCallback (react-dom.development.js:1299)
(anonymous) @ ButtonBase.js:149
commitCallbacks @ react-dom.development.js:7250
commitLifeCycles @ react-dom.development.js:11524
commitAllLifeCycles @ react-dom.development.js:12294
callCallback @ react-dom.development.js:1299
invokeGuardedCallbackDev @ react-dom.development.js:1338
invokeGuardedCallback @ react-dom.development.js:1195
commitAllWork @ react-dom.development.js:12415
workLoop @ react-dom.development.js:12687
callCallback @ react-dom.development.js:1299
invokeGuardedCallbackDev @ react-dom.development.js:1338
invokeGuardedCallback @ react-dom.development.js:1195
performWork @ react-dom.development.js:12800
batchedUpdates @ react-dom.development.js:13244
performFiberBatchedUpdates @ react-dom.development.js:1646
stackBatchedUpdates @ react-dom.development.js:1637
batchedUpdates @ react-dom.development.js:1651
batchedUpdatesWithControlledComponents @ react-dom.development.js:1664
dispatchEvent @ react-dom.development.js:1874"><pre class="notranslate"><code class="notranslate">ButtonBase.js:149 Uncaught TypeError: Cannot read property 'start' of null
    at TouchRipple.&lt;anonymous&gt; (ButtonBase.js:149)
    at commitCallbacks (react-dom.development.js:7250)
    at commitLifeCycles (react-dom.development.js:11524)
    at commitAllLifeCycles (react-dom.development.js:12294)
    at HTMLUnknownElement.callCallback (react-dom.development.js:1299)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:1338)
    at invokeGuardedCallback (react-dom.development.js:1195)
    at commitAllWork (react-dom.development.js:12415)
    at workLoop (react-dom.development.js:12687)
    at HTMLUnknownElement.callCallback (react-dom.development.js:1299)
(anonymous) @ ButtonBase.js:149
commitCallbacks @ react-dom.development.js:7250
commitLifeCycles @ react-dom.development.js:11524
commitAllLifeCycles @ react-dom.development.js:12294
callCallback @ react-dom.development.js:1299
invokeGuardedCallbackDev @ react-dom.development.js:1338
invokeGuardedCallback @ react-dom.development.js:1195
commitAllWork @ react-dom.development.js:12415
workLoop @ react-dom.development.js:12687
callCallback @ react-dom.development.js:1299
invokeGuardedCallbackDev @ react-dom.development.js:1338
invokeGuardedCallback @ react-dom.development.js:1195
performWork @ react-dom.development.js:12800
batchedUpdates @ react-dom.development.js:13244
performFiberBatchedUpdates @ react-dom.development.js:1646
stackBatchedUpdates @ react-dom.development.js:1637
batchedUpdates @ react-dom.development.js:1651
batchedUpdatesWithControlledComponents @ react-dom.development.js:1664
dispatchEvent @ react-dom.development.js:1874
</code></pre></div>
<h2 dir="auto">Steps to Reproduce (for bugs)</h2>
<p dir="auto"><a href="https://codesandbox.io/s/m4l0lryoxy" rel="nofollow"><img src="https://camo.githubusercontent.com/90808661433696bc57dce8d4ad732307b5cec6270e6b846f114dcd7ee7f9458a/68747470733a2f2f636f646573616e64626f782e696f2f7374617469632f696d672f706c61792d636f646573616e64626f782e737667" alt="Edit MaterialUI/React-Router Bug" data-canonical-src="https://codesandbox.io/static/img/play-codesandbox.svg" style="max-width: 100%;"></a></p>
<ol dir="auto">
<li>Press Tab key until keyboard focus is on the "Bar" Item.</li>
<li>Press spacebar</li>
<li>Observe JS error</li>
</ol>
<h2 dir="auto">Your Environment</h2>

<table role="table">
<thead>
<tr>
<th>Tech</th>
<th>Version</th>
</tr>
</thead>
<tbody>
<tr>
<td>Material-UI</td>
<td>1.0.0-beta.30</td>
</tr>
<tr>
<td>React</td>
<td>16.0.0</td>
</tr>
<tr>
<td>React Router</td>
<td>4.2.2</td>
</tr>
<tr>
<td>browser</td>
<td>All</td>
</tr>
</tbody>
</table>
<p dir="auto">Not sure if this is a bug or something I'm doing wrong. I've upgraded to v1.0.0-alpha.1 to fix issues with the react-tap-event-plugin, and trying to modify things to suit the new docs but my drawer won't open.</p>
<p dir="auto">When I attempt to open it, I get this error:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="Uncaught TypeError: Cannot read property 'contains' of null
at eval (contains.js:17)
at Modal.focus (Modal.js:209)
at Modal.handleShow (Modal.js:237)
at Modal.componentDidUpdate (Modal.js:185)
at commitLifeCycles (react-dom.development.js:13462)
at commitAllLifeCycles (react-dom.development.js:13987)
at HTMLUnknownElement.boundFunc (react-dom.development.js:229)
at invokeGuardedCallback (react-dom.development.js:243)
at invokeGuardedCallback (react-dom.development.js:278)
at commitAllWork (react-dom.development.js:14100)"><pre class="notranslate"><code class="notranslate">Uncaught TypeError: Cannot read property 'contains' of null
at eval (contains.js:17)
at Modal.focus (Modal.js:209)
at Modal.handleShow (Modal.js:237)
at Modal.componentDidUpdate (Modal.js:185)
at commitLifeCycles (react-dom.development.js:13462)
at commitAllLifeCycles (react-dom.development.js:13987)
at HTMLUnknownElement.boundFunc (react-dom.development.js:229)
at invokeGuardedCallback (react-dom.development.js:243)
at invokeGuardedCallback (react-dom.development.js:278)
at commitAllWork (react-dom.development.js:14100)
</code></pre></div>
<p dir="auto">The drawer is toggled open by setting a state variable which is bound to the "open" prop of Drawer.<br>
The Drawer itself looks like this:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="&lt;Drawer
    anchor=&quot;left&quot;
    docked={false}
    open={menuOpen}
    onRequestClose={toggleMenu}
    onClick={toggleMenu}
    classes={classes}&gt;
    &lt;div&gt;This is a test&lt;/div&gt;
&lt;/Drawer"><pre class="notranslate"><code class="notranslate">&lt;Drawer
    anchor="left"
    docked={false}
    open={menuOpen}
    onRequestClose={toggleMenu}
    onClick={toggleMenu}
    classes={classes}&gt;
    &lt;div&gt;This is a test&lt;/div&gt;
&lt;/Drawer
</code></pre></div>
<p dir="auto">toggleMenu is a function that just toggles the menuOpen boolean.  From poring through the code it seems the modal has no content, but I can't figure out why. If I dump out modalContent at Modal.js:208 it comes back empty.</p>
<p dir="auto">I've tried lots of variations of content, none of them make any difference. The error only occurs once I click to open the drawer.</p>
<p dir="auto">I'm working on React 16.0.0-alpha.12</p>