Fork me on GitHub

Not sure if this is the proper place to ask this, but I couldn't replicate the error on the Material UI website. Has anyone seen this error when working with Material UI Menus?

Warning: React does not recognize the `autoFocusItem` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `autofocusitem` instead. If you accidentally passed it from a parent component, remove it from the DOM element.


It only breaks the up and down keyboard functionality but I really hate red errors in my console


You may be passing that prop to the wrong component?


Well it happens with all Menus, Selects, and TextFields

[m/FormControl {:full-width true}
      [m/InputLabel "Test"]
      [m/Select {:value 1}
       [m/MenuItem {:value 1} "One"]
       [m/MenuItem {:value 2} "Two"]
       [m/MenuItem {:value 3} "Three"]]]
Even really simple components throw the error. The strange thing is, I haven't noticed it until recently. Tried reverting reagent, react, and MUI to previous versions but the problem still seems to persist. Passing <component>Props to disable autoFocusItem doesn't seem to work either. Thanks for the response BTW. Probably just going to write my own menu component that handles these things.

👍 4

Hmm so I fixed it... There was a key issue I had in another unrelated component that was causing the issue. Fixing that fixed the Menus and Selects.