React strict mode race condition

[zoran995]

When running react-wrapper it will run into race condition during initialization and cleanup and throw an error

Uncaught (in promise) Error: file 'extension-file://typefox.statemachine-example/extension/react-statemachine-configuration.json/' already exists

Steps to reproduce:

• Start React: Langium Statemachine Language Client & Language Server (Worker) example (only reproducible in local dev mode)
• Check strict mode
• Start the editor
• Check the error in the console (when using webpack error overlay, it will be annoying with popup)

When running in strict mode react will run useEffect twice but won't wait for async code to complete before running the cleanup, so the execution will basically be
initializing 1 -> destroying 1 -> initializing 2 -> destroyed 1 -> initialized 1 -> starting 1 -> started 1
the error is thrown inside initializing for second time.
Because both effect and cleanup are asynchronous, one possible solution would be to implement a basic task queue to ensure that nothing runs in parallel.

[cdietrich]

I see the problem also in normal mode when I change props eg to update text of Editor / switch model #858

[kaisalmen]

Hi @zoran995 and @cdietrich it's time to re-assess the whole situation. #904 is under review. The current status is available as next release: https://www.npmjs.com/package/@typefox/monaco-editor-react/v/6.7.0-next.0

[kaisalmen]

If there are more issues with the react component, please let me know. We can fix them pretty soon. 6.6.0 was not the "best" release quality wise.