Drei + using KeyboardControls

Hi!

I’m trying to implement a simple camera-following controller, and am basing this off of Drei’s Minecraft example Minecraft - CodeSandbox but without the raycasting or the laser. I’m noticing however, that the keys stop working after an arbitrary amount of time (if I switch windows or release pointer lock controls). Is there something that could be causing this? This is my player script and in my App, the Canvas is wrapped in the KeyboardControls. Any help would be much appreciated!!

side note, I kept getting errors with state.camera.position.set(…ref.current.translation()) which is why I’m setting the x and y separately.

const SPEED = 4
const direction = new THREE.Vector3()
const frontVector = new THREE.Vector3()
const sideVector = new THREE.Vector3()
const rotation = new THREE.Vector3()

export function Player({ }) {
const ref = useRef()
const rapier = useRapier()
const [, get] = useKeyboardControls()

useFrame((state) => {
const { left, right, up, down, } = get()

if (ref.current) {
  const velocity = ref.current.linvel()
  // update camera
  state.camera.position.x = ref.current.translation().x;
  state.camera.position.y = ref.current.translation().y;

  // movement
  frontVector.set(0, up - down, 0)
  sideVector.set(left - right, 0, 0)
  direction.subVectors(frontVector, sideVector).normalize().multiplyScalar(SPEED).applyEuler(state.camera.rotation)
  ref.current.setLinvel({ x: direction.x, y: direction.y, z: direction.z })

}

})
return (
<>
<RigidBody ref={ref} colliders={false} mass={1} type=“dynamic” position={[-2, 0.3, 0]} enabledRotations={[false, false, false]}>
<CapsuleCollider args={[0.75, 0.5]} />

</>
)
}

Also having the same issue, keyboard just becomes unresponsive at random moments, any updates about this?

you can copy the component into your local project and that would make it a lot easier to figure out what’s the issue. it sounds like a race condition, or some kind of leak where it gets confused over adding/removing events. if you find a solution please make the pr so that it’s fixed for good.