WebGPURenderer: Set opaque blend mode for secondary MRT targets (#32265)

Author: sunag

src/renderers/webgl-fallback/WebGLBackend.js

@@ -268,6 +268,7 @@ class WebGLBackend extends Backend {
 
 		this.disjoint = this.extensions.get( 'EXT_disjoint_timer_query_webgl2' );
 		this.parallel = this.extensions.get( 'KHR_parallel_shader_compile' );
+		this.drawBuffersIndexedExt = this.extensions.get( 'OES_draw_buffers_indexed' );
 
 	}
 
@@ -957,6 +958,12 @@ class WebGLBackend extends Backend {
 
 		state.setMaterial( material, frontFaceCW, hardwareClippingPlanes );
 
+		if ( context.textures !== null && context.textures.length > 1 ) {
+
+			state.setMRTBlending( context.textures );
+
+		}
+
 		state.useProgram( programGPU );
 
 		// vertex state

src/renderers/webgl-fallback/utils/WebGLState.js

@@ -85,7 +85,6 @@ class WebGLState {
 		this.currentBoundTextures = {};
 		this.currentBoundBufferBases = {};
 
-
 		this._init();
 
 	}
@@ -271,6 +270,22 @@ class WebGLState {
 
 	}
 
+	setMRTBlending( textures ) {
+
+		const gl = this.gl;
+		const drawBuffersIndexedExt = this.backend.drawBuffersIndexedExt;
+
+		if ( ! drawBuffersIndexedExt ) return;
+
+		for ( let i = 1; i < textures.length; i ++ ) {
+
+			// use opaque blending for additional render targets
+			drawBuffersIndexedExt.blendFuncSeparateiOES( i, gl.ONE, gl.ZERO, gl.ONE, gl.ZERO );
+
+		}
+
+	}
+
 	/**
 	 * Defines the blending.
 	 *

src/renderers/webgpu/utils/WebGPUPipelineUtils.js

@@ -152,11 +152,22 @@ class WebGPUPipelineUtils {
 
 				const colorFormat = utils.getTextureFormatGPU( textures[ i ] );
 
-				targets.push( {
-					format: colorFormat,
-					blend: blending,
-					writeMask: colorWriteMask
-				} );
+				if ( i === 0 ) {
+
+					targets.push( {
+						format: colorFormat,
+						blend: blending,
+						writeMask: colorWriteMask
+					} );
+
+				} else {
+
+					targets.push( {
+						format: colorFormat,
+						writeMask: colorWriteMask
+					} );
+
+				}
 
 			}