weird state change in newest version
1muen opened this issue · comments
Describe the bug
it worked in 0.50.1 but in 0.51.0 it is weird.
0.50.1:
https://user-images.githubusercontent.com/49640488/220974267-8c5b3b12-1683-4ab6-924f-c81386439ede.mp4
It occures, if the content in the editor is loaded depending on a state. In our Application we had 3 Tabs. If a user was in the second or third Tab and modified the text and pressed save, the text got saved in the first tab.
To Reproduce
I forked the repo and modified the example. Here is Version 0.50.1:
0.51.0:
This is the Editor to reproduce:
const BuggyEditor = ()=>{
const [state, setState] = useState(()=>{return {values:["lol", "test2"], index:0}})
const options = {
selectOnLineNumbers: true,
roundedSelection: false,
readOnly: false,
cursorStyle: "line",
automaticLayout: false,
};
const valueChange = (value,event)=>{
const t = [...state?.values]
t[state?.index || 0]=value
setState({...state, values: t})}
return ( <div>
<div>
<button onClick={()=>setState({...state, index: state?.index+1})} type="button">
index++
</button>
<button onClick={()=>setState({...state, index: state?.index-1})} type="button">
index--
</button>
index={state?.index}
</div>
<hr />
<MonacoEditor
height="400"
language="html"
value={state?.values[state?.index || 0]}
options={options}
onChange={valueChange}
/>
</div>)
}
Expected behavior
A mix of both. I would not expect "test2" to stay in the editor, if the content should be undefined as it is in the 0.50.1 Version:
firefox_btRRPoHLpN.mp4
, but I would expect the behaviour of 0.51.0 if I edit something.
Environment (please complete the following information):
- OS: Linux
- Browser Firefox, Chromium, Brave
- Bundler webpack
Can confirm this issue in v0.53.0.
I have a callback function that needs to be triggered onChange.
const { updateAuthenticationSequence } = useAuthenticationFlow();
return (
<MonacoEditor
onChange={ (value: string) => {
updateAuthenticationSequence({
script: value
});
} }
...
/>
);
on editor value change, updateAuthenticationSequence
was having issues since a state i'm referring from the hook was having the initial value. It looked to me like a closure issue.
Downgrading to v0.50.0
helped.
Thanks for looking into this. Since you identified the version that introduced the issue, can you send a pull request to resolve this?
Also experiencing this issue. Downgraded to ^0.50.0
for the time being.
I don't see an obvious reason for why this is occurring, but it may be related to this useEffect how the __prevent_trigger_change_event.current
is being set.