title: Select Component's inputProps (Material UI)
body: <p>Following <a href="https://stackoverflow.com/questions/57055690/material-ui-form-inputs-classname-property">this question</a>, I would like to replace the TextField (to input the age) component to use a Select component since I notice both have the inputProps property.</p>
  
  <p>Original app:</p>
  
  <pre><code>function App() {
    const [state, setState] = React.useState({
      cats: [{ name: "cat1", age: "2" }, { name: "cat2", age: "5" }],
      owner: "Owner's Name"
    });
    const handleFormChange = e =&gt; {
      if (["name", "age"].includes(e.target.dataset.fieldType)) {
        const newCats = [...state.cats];
        newCats[e.target.dataset.id][e.target.dataset.fieldType] = e.target.value;
        setState({ ...state, cats: newCats });
      } else {
        setState({ ...state, [e.target.name]: e.target.value });
      }
    };
    return (
      &lt;form onChange={handleFormChange}&gt;
        &lt;TextField label="Owner" value={state.owner} name="owner" /&gt;
        &lt;br /&gt;
        &lt;br /&gt;
        &lt;TextField
          label="Name 1"
          value={state.cats[0].name}
          inputProps={{ "data-id": 0, "data-field-type": "name" }}
        /&gt;
        &lt;TextField  &lt;-----------------------replace with a Select
          label="Age 1"
          value={state.cats[0].age}
          inputProps={{ "data-id": 0, "data-field-type": "age" }}
        /&gt;
      &lt;/form&gt;
    );
  }
  </code></pre>
  
  <p>The Select component I'm replace the second TextField:</p>
  
  <pre><code>    &lt;Select
        onChange={handleSelectChange}
        label={"Age 1"}
        value={state.cats[0].age}
        inputProps={{
          "data-id": idx,
          "data-field-type": "age",
          name: "customName"
        }}
      &gt;
        &lt;MenuItem value={10}&gt;Ten&lt;/MenuItem&gt;
        &lt;MenuItem value={20}&gt;Twenty&lt;/MenuItem&gt;
        &lt;MenuItem value={30}&gt;Thirty&lt;/MenuItem&gt;
      &lt;/Select&gt;
  </code></pre>
  
  <p>But in my handleSelectChange function: </p>
  
  <pre><code> const handleSelectChange = e =&gt; {
      console.log("value", e.target.value); //OK
      console.log("name", e.target.name); // OK
      console.log("dataset", e.target.dataset); //undefined
    };
  </code></pre>
  
  <p>The data attributes passed to the inputProps are undefined, why is that?</p>
  
  <p>This is a codesandbox I made testing this behaviour: <a href="https://codesandbox.io/s/dynamic-form-change-handler-with-select-ft4dj" rel="nofollow noreferrer">https://codesandbox.io/s/dynamic-form-change-handler-with-select-ft4dj</a></p>