Hi there!
I'm currently testing a simple React App that is run by the internal VRED server (via WebPreferences) and streamed into a web Frontplate. The React App is displayed as a UI overlay of the VRED scene.
When using the HTML interface, like buttons, to change the state of the React app, everything works fine. The state changes and refreshes the UI accordingly.
But when I connect key events in the Script Editor to send custom Javascript events to the react app. The react state cannot be changed and stays the same. It only changes once, but then stays the same. Weird behaviour.
I implemented the Javascript events according to these ressources:
- https://help.autodesk.com/view/VREDPRODUCTS/2023/ENU/?guid=VRED_Python_Documentation_Python_Examples...
- https://nimblewebdeveloper.com/blog/using-custom-react-hooks-to-listen-to-dom-events
The custom javascript event is registered in the useEffect hook.
This Github project contains the React app and also the VRED scene file to test it:
https://github.com/chr33z/vred-react-app-test
- Build the react app, rename the "index.html" in the build directory to "app.html"
- Select the build directory as the "Custom Web Root Directory", enable the "Web Server" on Port 8888
- Load the test scene "ReactTestScene.vpb"
- When cklicking the circle the state will cycle through 0, 1, 2
- When using the keys "A" (previous state) and "D" (next state) a user should also be able to cycle 0, 1, 2 (this fails)
The HTML input works, the key input does not work.
Does anyone have an idea how to fix this or experienced the same behaviour?
Best,
Christopher
