WebGPURenderer: Fix color mask setting in WebGLBackend (mrdoob#27026)

aardgoose · aardgoose · web-flow · commit 45b985db325f · 2023-10-23T00:30:20.000-03:00
Co-authored-by: aardgoose &lt;angus.sawyer@email.com&gt;
diff --git a/examples/jsm/renderers/webgl/utils/WebGLState.js b/examples/jsm/renderers/webgl/utils/WebGLState.js
@@ -30,6 +30,7 @@ class WebGLState {
 		this.currentPremultipledAlpha = null;
 		this.currentPolygonOffsetFactor = null;
 		this.currentPolygonOffsetUnits = null;
+		this.currentColorMask = null;
 		this.currentDepthFunc = null;
 		this.currentDepthMask = null;
 		this.currentStencilFunc = null;
@@ -296,6 +297,17 @@ class WebGLState {
 
 	}
 
+	setColorMask( colorMask ) {
+
+		if ( this.currentColorMask !== colorMask ) {
+
+			this.gl.colorMask( colorMask, colorMask, colorMask, colorMask );
+			this.currentColorMask = colorMask;
+
+		}
+
+	}
+
 	setDepthTest( depthTest ) {
 
 		const { gl } = this;
@@ -462,7 +474,7 @@ class WebGLState {
 		this.setDepthFunc( material.depthFunc );
 		this.setDepthTest( material.depthTest );
 		this.setDepthMask( material.depthWrite );
-		this.setDepthMask( material.colorWrite );
+		this.setColorMask( material.colorWrite );
 
 		const stencilWrite = material.stencilWrite;
 		this.setStencilTest( stencilWrite );
diff --git a/examples/screenshots/webgpu_particles.jpg b/examples/screenshots/webgpu_particles.jpg
diff --git a/examples/webgpu_particles.html b/examples/webgpu_particles.html
@@ -29,6 +29,8 @@
 			import { GUI } from 'three/addons/libs/lil-gui.module.min.js';
 
 			import WebGPU from 'three/addons/capabilities/WebGPU.js';
+			import WebGL from 'three/addons/capabilities/WebGL.js';
+
 			import WebGPURenderer from 'three/addons/renderers/webgpu/WebGPURenderer.js';
 
 			import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
@@ -40,11 +42,11 @@
 
 			function init() {
 
-				if ( WebGPU.isAvailable() === false ) {
+				if ( WebGPU.isAvailable() === false && WebGL.isWebGL2Available() === false ) {
 
 					document.body.appendChild( WebGPU.getErrorMessage() );
 
-					throw new Error( 'No WebGPU support' );
+					throw new Error( 'No WebGPU or WebGL2 support' );
 
 				}
 
diff --git a/test/e2e/puppeteer.js b/test/e2e/puppeteer.js
@@ -122,7 +122,6 @@ const exceptionList = [
 	'webgpu_loader_gltf_sheen',
 	'webgpu_materials',
 	'webgpu_materials_video',
-	'webgpu_particles',
 	'webgpu_sandbox',
 	'webgpu_shadertoy',
 	'webgpu_shadowmap',
