With WebGPU, light don't work

[bobolinks]

Description

With the official example 'webgpu_lights_phong.html',
just modify code as following:

`

			const addLight = ( hexColor, power = 1700, distance = 100 ) => {

				const material = new MeshPhongNodeMaterial();
				material.colorNode = color( hexColor );
				material.lights = false;

				const mesh = new THREE.Mesh( sphereGeometry, material );

				const light = new THREE.PointLight( hexColor, 1, distance );
				light.power = power;
				light.add( mesh );

				// scene.add( light );

				return light;

			};

			light1 = addLight( 0x0040ff );
			light2 = addLight( 0xffffff );
			light3 = addLight( 0x80ff80 );
			light4 = addLight( 0xffaa00 );

			setTimeout( () => {

				scene.add( light1 );
				scene.add( light2 );
				scene.add( light3 );
				scene.add( light4 );

			}, 3000 );

`

Reproduction steps

1. check out three to local and npm i
2. modify webgpu_lights_phong.html code as above
3. run it

Code

// code goes here

			const addLight = ( hexColor, power = 1700, distance = 100 ) => {

				const material = new MeshPhongNodeMaterial();
				material.colorNode = color( hexColor );
				material.lights = false;

				const mesh = new THREE.Mesh( sphereGeometry, material );

				const light = new THREE.PointLight( hexColor, 1, distance );
				light.power = power;
				light.add( mesh );

// remove this line
// scene.add( light );

				return light;

			};

			light1 = addLight( 0x0040ff );
			light2 = addLight( 0xffffff );
			light3 = addLight( 0x80ff80 );
			light4 = addLight( 0xffaa00 );

// delay add lights to scene
setTimeout( () => {

				scene.add( light1 );
				scene.add( light2 );
				scene.add( light3 );
				scene.add( light4 );

			}, 3000 );

Live example

• jsfiddle-latest-release
• jsfiddle-dev

Screenshots

No response

Version

0.157.0

Device

Desktop

Browser

Chrome

OS

MacOS