How to animate a smooth camera angle transition in Three.js, without causing the camera to spin around itself several times.

QuaternionSlerpExample.js

let time = {t: 0};

const positionToLookAt = new THREE.Vector3(10, 10, 10);
const startQuaternion = camera.quaternion.clone(); //set initial angle
camera.lookAt(positionToLookAt);
const endQuaternion = camera.quaternion.clone(); //set destination angle
camera.quaternion.copy(startQuaternion);

new TWEEN.Tween(time)
  .to({t: 1}, 1000) //duration in milliseconds
  .onUpdate(() => {
      THREE.Quaternion.slerp(startQuaternion, endQuaternion, camera.quaternion, time.t);
  })
  .easing(TWEEN.Easing.Quadratic.InOut).onComplete(() => {
    //code that runs on animation completion
}).start();