Error creating environment for locomotion

[chykon]

Description

When creating an environment for locomotion, an error may occur:

index.ts:4 Failed to add environment to locomotion engine: Error: Locomotor not initialized or invalid Object3D
    at Locomotor.addEnvironment (@iwsdk_core.js?v=844d8f8b:86587:13)
    at LocomotionSystem.addEnvironmentToEngine (@iwsdk_core.js?v=844d8f8b:88510:42)
    at @iwsdk_core.js?v=844d8f8b:88461:12
    at QueryManager.updateEntity (@iwsdk_core.js?v=844d8f8b:754:11)
    at Entity.addComponent (@iwsdk_core.js?v=844d8f8b:249:25)
    at index.ts:4:88
addEnvironmentToEngine @ @iwsdk_core.js?v=844d8f8b:88514
(anonymous) @ @iwsdk_core.js?v=844d8f8b:88461
updateEntity @ @iwsdk_core.js?v=844d8f8b:754
addComponent @ @iwsdk_core.js?v=844d8f8b:249
(anonymous) @ index.ts:4
Promise.then
(anonymous) @ index.ts:3

Reproducer

This can be reproduced on the generated starter project:

1. Run npm create @iwsdk@latest

---

---

2. Go to the iwsdk-app folder

3. Replace the code in src/index.tx with

import { World, PlaneGeometry, MeshStandardMaterial, Mesh, LocomotionEnvironment } from "@iwsdk/core"

World.create(document.getElementById("scene-container") as HTMLDivElement, { features: { locomotion: true } }).then((world) => {
  world.createTransformEntity(new Mesh(new PlaneGeometry(), new MeshStandardMaterial)).addComponent(LocomotionEnvironment)
})

4. Run npm run dev and open page

5. Open DevTools and see error

---

I'm guessing the issue is due to a race condition in the locomotion engine creation process, because the error doesn't occur when adding a delay:

import { World, PlaneGeometry, MeshStandardMaterial, Mesh, LocomotionEnvironment } from "@iwsdk/core"

World.create(document.getElementById("scene-container") as HTMLDivElement, { features: { locomotion: true } }).then((world) => {
  setTimeout(() => {world.createTransformEntity(new Mesh(new PlaneGeometry(), new MeshStandardMaterial)).addComponent(LocomotionEnvironment)}, 1000)
})