Helpers: Ensure light helpers are not frame-late. (#21427)

* Helpers: Ensure light helpers are not frame-late.

* PointLightHelper: Use updateWorldMatrix().

* PointLightHelper: Move invocation of world matrix update.

src/helpers/DirectionalLightHelper.js

@@ -16,7 +16,6 @@ class DirectionalLightHelper extends Object3D {
 		super();
 
 		this.light = light;
-		this.light.updateMatrixWorld();
 
 		this.matrix = light.matrixWorld;
 		this.matrixAutoUpdate = false;
@@ -62,6 +61,9 @@ class DirectionalLightHelper extends Object3D {
 
 	update() {
 
+		this.light.updateWorldMatrix( true, false );
+		this.light.target.updateWorldMatrix( true, false );
+
 		_v1.setFromMatrixPosition( this.light.matrixWorld );
 		_v2.setFromMatrixPosition( this.light.target.matrixWorld );
 		_v3.subVectors( _v2, _v1 );

src/helpers/HemisphereLightHelper.js

@@ -17,7 +17,6 @@ class HemisphereLightHelper extends Object3D {
 		super();
 
 		this.light = light;
-		this.light.updateMatrixWorld();
 
 		this.matrix = light.matrixWorld;
 		this.matrixAutoUpdate = false;
@@ -77,6 +76,8 @@ class HemisphereLightHelper extends Object3D {
 
 		}
 
+		this.light.updateWorldMatrix( true, false );
+
 		mesh.lookAt( _vector.setFromMatrixPosition( this.light.matrixWorld ).negate() );
 
 	}

src/helpers/PointLightHelper.js

@@ -12,7 +12,6 @@ class PointLightHelper extends Mesh {
 		super( geometry, material );
 
 		this.light = light;
-		this.light.updateMatrixWorld();
 
 		this.color = color;
 
@@ -58,6 +57,8 @@ class PointLightHelper extends Mesh {
 
 	update() {
 
+		this.light.updateWorldMatrix( true, false );
+
 		if ( this.color !== undefined ) {
 
 			this.material.color.set( this.color );

src/helpers/SpotLightHelper.js

@@ -14,7 +14,6 @@ class SpotLightHelper extends Object3D {
 		super();
 
 		this.light = light;
-		this.light.updateMatrixWorld();
 
 		this.matrix = light.matrixWorld;
 		this.matrixAutoUpdate = false;
@@ -65,7 +64,8 @@ class SpotLightHelper extends Object3D {
 
 	update() {
 
-		this.light.updateMatrixWorld();
+		this.light.updateWorldMatrix( true, false );
+		this.light.target.updateWorldMatrix( true, false );
 
 		const coneLength = this.light.distance ? this.light.distance : 1000;
 		const coneWidth = coneLength * Math.tan( this.light.angle );