title: Dialog Material-UI Scroll start from bottom
body: <p>I'm trying to put the div scroll with ref tag inside Dialog Material-UI Design I'm getting an error says <code>Cannot read property 'scrollHeight' of undefined</code></p>
  
  <p>If I use my code out of Dialog it works fine here's the example</p>
  
  <p><a href="https://codesandbox.io/s/9r3x0nq0o" rel="nofollow noreferrer">Working Example</a></p>
  
  <p>All what I'm trying to do is to make the scroll div to start from the end</p>
  
  <p>I did an example on <a href="https://codesandbox.io/s/k5rr64pvlv" rel="nofollow noreferrer">Not working with Dialog</a></p>
  
  <pre><code>import React from 'react';
  import { render } from 'react-dom';
  import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'
  import Dialog from 'material-ui/Dialog';
  import FlatButton from 'material-ui/FlatButton';
  import RaisedButton from 'material-ui/RaisedButton';
  
  class App extends React.Component {
  
    constructor(props) {
      super(props);
      this.state = {
        open: false,
      }
    }
  
    handleOpen = () =&gt; {
      this.setState({ open: true });
    };
    handleClose = () =&gt; {
      this.setState({ open: false });
    };
    componentDidMount() {
      this.shoppingListContainer.scrollTop = this.shoppingListContainer.scrollHeight;
    }
  
    render() {
      return (
        &lt;MuiThemeProvider&gt;
        &lt;div id="scrolldiv"&gt;
            &lt;RaisedButton label="Alert" onClick={this.handleOpen} /&gt;
          &lt;Dialog
            title="Dialog With Actions"
            modal={false}
            open={this.state.open}
            onRequestClose={this.handleClose}
          &gt;
          &lt;div&gt;
          &lt;ul style={{
            width: 115,
            height: 100,
            overflow: 'auto',
            border: '2px black solid'
          }}
            ref={(shoppingListContainer) =&gt; { this.shoppingListContainer = shoppingListContainer; }}
          &gt;
            &lt;li&gt;Instagram&lt;/li&gt;
            &lt;li&gt;WhatsApp&lt;/li&gt;
            &lt;li&gt;Oculus&lt;/li&gt;
            &lt;li&gt;Instagram&lt;/li&gt;
            &lt;li&gt;WhatsApp&lt;/li&gt;
            &lt;li&gt;Oculus&lt;/li&gt;
            &lt;li&gt;Instagram&lt;/li&gt;
            &lt;li&gt;WhatsApp&lt;/li&gt;
            &lt;li&gt;Oculus&lt;/li&gt;
            &lt;li&gt;Instagram&lt;/li&gt;
            &lt;li&gt;WhatsApp&lt;/li&gt;
            &lt;li&gt;Oculus&lt;/li&gt;
  
          &lt;/ul&gt;
          &lt;/div&gt;
            &lt;/Dialog&gt;
        &lt;/div&gt;
        &lt;/MuiThemeProvider&gt;
      );
    }
  }
  
  render(&lt;App /&gt;, document.getElementById('root'));
  </code></pre>