mui / material-ui

Material UI: Ready-to-use foundational React components, free forever. It includes Material UI, which implements Google's Material Design.
https://mui.com/material-ui/
MIT License
92.04k stars 31.64k forks source link

[material-ui][TextField] TextField multiline resize is unstable. #42177

Open doublebuzzwoo opened 3 weeks ago

doublebuzzwoo commented 3 weeks ago

Steps to reproduce

Link to live example: (required)

https://codesandbox.io/p/sandbox/sad-almeida-dj5t7y

Current behavior

https://github.com/mui/material-ui/assets/88484130/65c80f07-462c-45ba-97e0-888fd43148ae

Expected behavior

https://github.com/mui/material-ui/assets/88484130/4563b265-5a72-4119-a630-54f4449e4c04

Context

I saw that the issues is already report in @mui/base refer to @mui/base/issues#168 and fixed in this PR @mui/base/pr#189 @mui/material-ui/pr#41638 . But seems it's fixed only on the TextareaAutosize component only. The TextField component of @mui/material is still bugging.

Your environment

npx @mui/envinfo ``` Browsers: Chrome npmPackages: "@mui/base": "5.0.0-beta.44", "@mui/material": "5.15.17", ```

Search keywords: resize is unstable

mj12albert commented 2 weeks ago

Hi @doublebuzzwoo I can reproduce this in your sandbox, though when you use <TextField multiline /> it renders the same TextareaAutosize that was in the previous fix

I tried to see if this would repro in Stackblitz and accidently used a template that was still on 5.15.10, weirdly the bug does not occur then: https://stackblitz.com/edit/mcve-react-material-ui-pp76zi?file=src%2FApp.tsx 🤔

But it does on 5.15.17: https://stackblitz.com/edit/mcve-react-material-ui-nh99ds?file=src%2FApp.tsx

@ZeeshanTamboli Would you be interested in having a look at this again 🙏

ZeeshanTamboli commented 2 weeks ago

@mj12albert I think it might be related to how we released it because it's working fine for me locally.

The latest fix in @mui/base was included in v6.0.0-alpha.5, but not in v5.15.16. Therefore, the TextField with the multiline prop wasn't fixed because it didn't use the updated Base UI TextareaAutosize build code.

Could you discuss this with the team and see how we can address it? Although it was decided to only release stable packages in version 5, for this specific issue, we need to release Base UI with the latest v5 changes.

Reproduction to show that it works with v6 alpha release: https://stackblitz.com/edit/vitejs-vite-8ns17h?file=src%2FApp.tsx,src%2Fmain.tsx,package.json&terminal=dev.