<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">Due to the somewhat slow behaviour when using controlled textfields, I'm currently trying to use uncontrolled textfields. My first idea was to simply use <code class="notranslate">setState</code> in the onChange event handler to update the state.</p>
<p dir="auto">Basically, the code looks like this:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="&lt;TextField placeholder=&quot;Text here&quot; 
    onChange={this.handleAnswer(&quot;foo&quot;).bind(this)}
/&gt;"><pre class="notranslate"><code class="notranslate">&lt;TextField placeholder="Text here" 
    onChange={this.handleAnswer("foo").bind(this)}
/&gt;
</code></pre></div>
<p dir="auto">The event handler currently looks like this to make sure it's <code class="notranslate">setState()</code> which causes the problem:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="handleAnswer = id =&gt; event =&gt; {
        this.setState({
            test: event.target.value
        });
    }"><pre class="notranslate"><code class="notranslate">handleAnswer = id =&gt; event =&gt; {
        this.setState({
            test: event.target.value
        });
    }
</code></pre></div>
<p dir="auto">What I expect to see is that the state property "test" is set to the value of the textfield.</p>
<h2 dir="auto">Current Behavior</h2>
<p dir="auto">The event handler gets called once, which sets the state to the key pressed. However, said character does not appear in the textfield and the field immediately loses focus afterwards.</p>
<p dir="auto">What gets me is that the same code works just fine for a RadioButton.</p>
<h2 dir="auto">Steps to Reproduce (for bugs)</h2>
<p dir="auto">The non-working code is provided above.</p>
<h2 dir="auto">Context</h2>
<p dir="auto">Currently, controlled textfields are very slow. I'll have to make do with <code class="notranslate">ref</code>s then.</p>
<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.2.0</td>
</tr>
<tr>
<td>browser</td>
<td>Edge, Firefox, Chrome, Safari</td>
</tr>
</tbody>
</table>
<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">Popover renders within the context of the anchorEl document.</p>
<h2 dir="auto">Current Behavior</h2>
<p dir="auto">Popover will render in the global document unless an explicit container prop is passed to the popover</p>
<h2 dir="auto">Steps to Reproduce (for bugs)</h2>
<p dir="auto">See <a href="https://codesandbox.io/s/6lqo45vzvk" rel="nofollow">https://codesandbox.io/s/6lqo45vzvk</a> which is a demo I setup for <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="291716591" data-permission-text="Title is private" data-url="https://github.com/mui/material-ui/issues/10037" data-hovercard-type="issue" data-hovercard-url="/mui/material-ui/issues/10037/hovercard" href="https://github.com/mui/material-ui/issues/10037">#10037</a>, which includes an explicit container prop (which is clunky).</p>
<h2 dir="auto">Context</h2>
<p dir="auto">The changes made in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="284463354" data-permission-text="Title is private" data-url="https://github.com/mui/material-ui/issues/9613" data-hovercard-type="pull_request" data-hovercard-url="/mui/material-ui/pull/9613/hovercard" href="https://github.com/mui/material-ui/pull/9613">#9613</a> have been a great step forward in the right direction, and have largely fixed the issues I was having with rendering MUI components in a separate window (many thanks!!! 🎉). However any component that relies on Popover still has issues, as the container used when creating the Portal defaults to the global <code class="notranslate">document.body</code> object, instead of respecting the <code class="notranslate">document.body</code> containing the <code class="notranslate">anchorEl</code> prop.</p>
<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</td>
</tr>
<tr>
<td>browser</td>
<td>all</td>
</tr>
<tr>
<td>etc</td>
<td></td>
</tr>
</tbody>
</table>