[material-ui][Text Field] Typing Japanese Characters skips and displays only 2nd characters

[dennisadriano18]

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Steps to reproduce 🕹

Link to live example:

Steps:

1.Create a react component function and add material UI Textfield
2.Create a useState function and array object. (ex. const [test, setTest] = React.useState([]);)
3. Create a function to be called for onChange event. (ex. const onChange = (e)=>{setTest([])})
4.On Material-UI Textfield, edit the onChange property and call the onChange variable created on #3
5. Run this and you will see, first character is skipped and only alternating characters are converted to japanese. (ex. bあkあrいtえsうtお)

Current behavior 😯

first character is skipped and only alternating characters are converted to japanese. (ex. bあkあrいtえsうtお)

Expected behavior 🤔

this should convert the syllables into corresponding Japanese characters (ex. ばかりテスト)

Context 🔦

resetting the value of a state array or state object/json inside the onChange envent will break the TextField function.
If you have this:
const [test, setTest] = React.useState([]);
const [testObj, setTestObj] = React.useState({});

Then inside the onChange function, you put this:
setTest([]) or setTestObj({})

will cause the issue with Japanese Characters.

Your environment 🌎

npx @mui/envinfo

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

[mj12albert]

@dennisadriano18 Could you provide a repro? You can fork this template: https://mui.com/r/issue-template-latest

PS: here are some tips for providing a minimal example: https://stackoverflow.com/help/mcve

[github-actions]

Since the issue is missing key information and has been inactive for 7 days, it has been automatically closed. If you wish to see the issue reopened, please provide the missing information.