WebGPURenderer: Add missing Z axis to viewportCoordinate (#28041)

examples/jsm/nodes/display/ViewportNode.js

@@ -21,7 +21,9 @@ class ViewportNode extends Node {
 
 	getNodeType() {
 
-		return this.scope === ViewportNode.VIEWPORT ? 'vec4' : 'vec2';
+		if ( this.scope === ViewportNode.VIEWPORT ) return 'vec4';
+		else if ( this.scope === ViewportNode.COORDINATE ) return 'vec3';
+		else return 'vec2';
 
 	}
 
@@ -99,7 +101,7 @@ class ViewportNode extends Node {
 
 				const resolution = builder.getNodeProperties( viewportResolution ).outputNode.build( builder );
 
-				coord = `${ builder.getType( 'vec2' ) }( ${ coord }.x, ${ resolution }.y - ${ coord }.y )`;
+				coord = `${ builder.getType( 'vec3' ) }( ${ coord }.x, ${ resolution }.y - ${ coord }.y, ${ coord }.z )`;
 
 			}
 

examples/jsm/renderers/webgpu/nodes/WGSLNodeBuilder.js

@@ -522,7 +522,7 @@ ${ flowData.code }
 
 	getFragCoord() {
 
-		return this.getBuiltin( 'position', 'fragCoord', 'vec4<f32>' ) + '.xy';
+		return this.getBuiltin( 'position', 'fragCoord', 'vec4<f32>' ) + '.xyz';
 
 	}
 

examples/jsm/transpiler/GLSLDecoder.js

@@ -218,7 +218,7 @@ class GLSLDecoder {
 
 		this._currentFunction = null;
 
-		this.addPolyfill( 'gl_FragCoord', 'vec2 gl_FragCoord = vec2( viewportCoordinate.x, viewportCoordinate.y.oneMinus() );' );
+		this.addPolyfill( 'gl_FragCoord', 'vec3 gl_FragCoord = vec3( viewportCoordinate.x, viewportCoordinate.y.oneMinus(), viewportCoordinate.z );' );
 
 	}
 

examples/jsm/transpiler/ShaderToyDecoder.js

@@ -9,7 +9,7 @@ class ShaderToyDecoder extends GLSLDecoder {
 
 		this.addPolyfill( 'iTime', 'float iTime = timerGlobal();' );
 		this.addPolyfill( 'iResolution', 'vec2 iResolution = viewportResolution;' );
-		this.addPolyfill( 'fragCoord', 'vec2 fragCoord = vec2( viewportCoordinate.x, viewportResolution.y - viewportCoordinate.y );' );
+		this.addPolyfill( 'fragCoord', 'vec3 fragCoord = vec3( viewportCoordinate.x, viewportResolution.y - viewportCoordinate.y, viewportCoordinate.z );' );
 
 	}