super-three 0.164.0 → 0.167.0

package/src/renderers/webgpu/nodes/WGSLNodeFunction.js

@@ -0,0 +1,159 @@
+import NodeFunction from '../../../nodes/core/NodeFunction.js';
+import NodeFunctionInput from '../../../nodes/core/NodeFunctionInput.js';
+
+const declarationRegexp = /^[fn]*\s*([a-z_0-9]+)?\s*\(([\s\S]*?)\)\s*[\-\>]*\s*([a-z_0-9]+(?:<[\s\S]+?>)?)/i;
+const propertiesRegexp = /([a-z_0-9]+)\s*:\s*([a-z_0-9]+(?:<[\s\S]+?>)?)/ig;
+
+const wgslTypeLib = {
+	'f32': 'float',
+	'i32': 'int',
+	'u32': 'uint',
+	'bool': 'bool',
+
+	'vec2<f32>': 'vec2',
+ 	'vec2<i32>': 'ivec2',
+ 	'vec2<u32>': 'uvec2',
+ 	'vec2<bool>': 'bvec2',
+
+	'vec2f': 'vec2',
+	'vec2i': 'ivec2',
+	'vec2u': 'uvec2',
+	'vec2b': 'bvec2',
+
+	'vec3<f32>': 'vec3',
+	'vec3<i32>': 'ivec3',
+	'vec3<u32>': 'uvec3',
+	'vec3<bool>': 'bvec3',
+
+	'vec3f': 'vec3',
+	'vec3i': 'ivec3',
+	'vec3u': 'uvec3',
+	'vec3b': 'bvec3',
+
+	'vec4<f32>': 'vec4',
+	'vec4<i32>': 'ivec4',
+	'vec4<u32>': 'uvec4',
+	'vec4<bool>': 'bvec4',
+
+	'vec4f': 'vec4',
+	'vec4i': 'ivec4',
+	'vec4u': 'uvec4',
+	'vec4b': 'bvec4',
+
+	'mat2x2<f32>': 'mat2',
+	'mat2x2f': 'mat2',
+
+	'mat3x3<f32>': 'mat3',
+	'mat3x3f': 'mat3',
+
+	'mat4x4<f32>': 'mat4',
+	'mat4x4f': 'mat4',
+
+	'sampler': 'sampler',
+
+	'texture_1d': 'texture',
+
+	'texture_2d': 'texture',
+	'texture_2d_array': 'texture',
+	'texture_multisampled_2d': 'cubeTexture',
+
+	'texture_depth_2d': 'depthTexture',
+
+	'texture_3d': 'texture3D',
+
+	'texture_cube': 'cubeTexture',
+	'texture_cube_array': 'cubeTexture',
+
+	'texture_storage_1d': 'storageTexture',
+	'texture_storage_2d': 'storageTexture',
+	'texture_storage_2d_array': 'storageTexture',
+	'texture_storage_3d': 'storageTexture'
+
+};
+
+const parse = ( source ) => {
+
+	source = source.trim();
+
+	const declaration = source.match( declarationRegexp );
+
+	if ( declaration !== null && declaration.length === 4 ) {
+
+		const inputsCode = declaration[ 2 ];
+		const propsMatches = [];
+		let match = null;
+
+		while ( ( match = propertiesRegexp.exec( inputsCode ) ) !== null ) {
+
+			propsMatches.push( { name: match[ 1 ], type: match[ 2 ] } );
+
+		}
+
+		// Process matches to correctly pair names and types
+		const inputs = [];
+		for ( let i = 0; i < propsMatches.length; i ++ ) {
+
+			const { name, type } = propsMatches[ i ];
+
+			let resolvedType = type;
+
+			if ( resolvedType.startsWith( 'texture' ) ) {
+
+				resolvedType = type.split( '<' )[ 0 ];
+
+			}
+
+			resolvedType = wgslTypeLib[ resolvedType ] || resolvedType;
+
+			inputs.push( new NodeFunctionInput( resolvedType, name ) );
+
+		}
+
+		const blockCode = source.substring( declaration[ 0 ].length );
+		const outputType = declaration[ 3 ] || 'void';
+
+		const name = declaration[ 1 ] !== undefined ? declaration[ 1 ] : '';
+		const type = wgslTypeLib[ outputType ] || outputType;
+
+		return {
+			type,
+			inputs,
+			name,
+			inputsCode,
+			blockCode,
+			outputType
+		};
+
+	} else {
+
+		throw new Error( 'FunctionNode: Function is not a WGSL code.' );
+
+	}
+
+};
+
+class WGSLNodeFunction extends NodeFunction {
+
+	constructor( source ) {
+
+		const { type, inputs, name, inputsCode, blockCode, outputType } = parse( source );
+
+		super( type, inputs, name );
+
+		this.inputsCode = inputsCode;
+		this.blockCode = blockCode;
+		this.outputType = outputType;
+
+	}
+
+	getCode( name = this.name ) {
+
+		const outputType = this.outputType !== 'void' ? '-> ' + this.outputType : '';
+
+		return `fn ${ name } ( ${ this.inputsCode.trim() } ) ${ outputType }` + this.blockCode;
+
+	}
+
+}
+
+export default WGSLNodeFunction;

package/{examples/jsm → src}/renderers/webgpu/utils/WebGPUAttributeUtils.js

@@ -1,6 +1,7 @@
-import { Float16BufferAttribute } from 'three';
 import { GPUInputStepMode } from './WebGPUConstants.js';
 
+import { Float16BufferAttribute } from '../../../core/BufferAttribute.js';
+
 const typedArraysToVertexFormatPrefix = new Map( [
 	[ Int8Array, [ 'sint8', 'snorm8' ]],
 	[ Uint8Array, [ 'uint8', 'unorm8' ]],

package/{examples/jsm → src}/renderers/webgpu/utils/WebGPUBindingUtils.js

@@ -1,7 +1,8 @@
 import {
-	GPUTextureAspect, GPUTextureViewDimension, GPUBufferBindingType, GPUTextureSampleType
+	GPUTextureAspect, GPUTextureViewDimension, GPUTextureSampleType
 } from './WebGPUConstants.js';
-import { FloatType, IntType, UnsignedIntType } from 'three';
+
+import { FloatType, IntType, UnsignedIntType } from '../../../constants.js';
 
 class WebGPUBindingUtils {
 
@@ -11,7 +12,7 @@ class WebGPUBindingUtils {
 
 	}
 
-	createBindingsLayout( bindings ) {
+	createBindingsLayout( bindGroup ) {
 
 		const backend = this.backend;
 		const device = backend.device;
@@ -20,7 +21,7 @@ class WebGPUBindingUtils {
 
 		let index = 0;
 
-		for ( const binding of bindings ) {
+		for ( const binding of bindGroup.bindings ) {
 
 			const bindingGPU = {
 				binding: index ++,
@@ -33,7 +34,7 @@ class WebGPUBindingUtils {
 
 				if ( binding.isStorageBuffer ) {
 
-					buffer.type = GPUBufferBindingType.Storage;
+					buffer.type = binding.access;
 
 				}
 
@@ -62,18 +63,25 @@ class WebGPUBindingUtils {
 			} else if ( binding.isSampledTexture && binding.store ) {
 
 				const format = this.backend.get( binding.texture ).texture.format;
+				const access = binding.access;
 
-				bindingGPU.storageTexture = { format }; // GPUStorageTextureBindingLayout
+				bindingGPU.storageTexture = { format, access }; // GPUStorageTextureBindingLayout
 
 			} else if ( binding.isSampledTexture ) {
 
 				const texture = {}; // GPUTextureBindingLayout
 
+				if ( binding.texture.isMultisampleRenderTargetTexture === true ) {
+
+					texture.multisampled = true;
+
+				}
+
 				if ( binding.texture.isDepthTexture ) {
 
 					texture.sampleType = GPUTextureSampleType.Depth;
 
-				} else if ( binding.texture.isDataTexture ) {
+				} else if ( binding.texture.isDataTexture || binding.texture.isDataArrayTexture || binding.texture.isData3DTexture ) {
 
 					const type = binding.texture.type;
 
@@ -103,6 +111,10 @@ class WebGPUBindingUtils {
 
 					texture.viewDimension = GPUTextureViewDimension.TwoDArray;
 
+				} else if ( binding.isSampledTexture3D ) {
+
+					texture.viewDimension = GPUTextureViewDimension.ThreeD;
+
 				}
 
 				bindingGPU.texture = texture;
@@ -121,19 +133,18 @@ class WebGPUBindingUtils {
 
 	}
 
-	createBindings( bindings ) {
+	createBindings( bindGroup ) {
 
 		const backend = this.backend;
-		const bindingsData = backend.get( bindings );
+		const bindingsData = backend.get( bindGroup );
 
 		// setup (static) binding layout and (dynamic) binding group
 
-		const bindLayoutGPU = this.createBindingsLayout( bindings );
-		const bindGroupGPU = this.createBindGroup( bindings, bindLayoutGPU );
+		const bindLayoutGPU = this.createBindingsLayout( bindGroup );
+		const bindGroupGPU = this.createBindGroup( bindGroup, bindLayoutGPU );
 
 		bindingsData.layout = bindLayoutGPU;
 		bindingsData.group = bindGroupGPU;
-		bindingsData.bindings = bindings;
 
 	}
 
@@ -149,7 +160,7 @@ class WebGPUBindingUtils {
 
 	}
 
-	createBindGroup( bindings, layoutGPU ) {
+	createBindGroup( bindGroup, layoutGPU ) {
 
 		const backend = this.backend;
 		const device = backend.device;
@@ -157,7 +168,7 @@ class WebGPUBindingUtils {
 		let bindingPoint = 0;
 		const entriesGPU = [];
 
-		for ( const binding of bindings ) {
+		for ( const binding of bindGroup.bindings ) {
 
 			if ( binding.isUniformBuffer ) {
 
@@ -214,6 +225,10 @@ class WebGPUBindingUtils {
 
 					dimensionViewGPU = GPUTextureViewDimension.Cube;
 
+				} else if ( binding.isSampledTexture3D ) {
+
+					dimensionViewGPU = GPUTextureViewDimension.ThreeD;
+
 				} else if ( binding.texture.isDataArrayTexture ) {
 
 					dimensionViewGPU = GPUTextureViewDimension.TwoDArray;
@@ -247,6 +262,7 @@ class WebGPUBindingUtils {
 		}
 
 		return device.createBindGroup( {
+			label: 'bindGroup_' + bindGroup.name,
 			layout: layoutGPU,
 			entries: entriesGPU
 		} );

package/{examples/jsm → src}/renderers/webgpu/utils/WebGPUConstants.js

@@ -269,6 +269,12 @@ export const GPUBufferBindingType = {
 	ReadOnlyStorage: 'read-only-storage'
 };
 
+export const GPUStorageTextureAccess = {
+	WriteOnly: 'write-only',
+	ReadOnly: 'read-only',
+	ReadWrite: 'read-write',
+};
+
 export const GPUSamplerBindingType = {
 	Filtering: 'filtering',
 	NonFiltering: 'non-filtering',
@@ -320,5 +326,7 @@ export const GPUFeatureName = {
 	ShaderF16: 'shader-f16',
 	RG11B10UFloat: 'rg11b10ufloat-renderable',
 	BGRA8UNormStorage: 'bgra8unorm-storage',
-	Float32Filterable: 'float32-filterable'
+	Float32Filterable: 'float32-filterable',
+	ClipDistances: 'clip-distances',
+	DualSourceBlending: 'dual-source-blending'
 };

package/{examples/jsm → src}/renderers/webgpu/utils/WebGPUPipelineUtils.js

@@ -13,7 +13,7 @@ import {
 	AddEquation, SubtractEquation, ReverseSubtractEquation, MinEquation, MaxEquation,
 	KeepStencilOp, ZeroStencilOp, ReplaceStencilOp, InvertStencilOp, IncrementStencilOp, DecrementStencilOp, IncrementWrapStencilOp, DecrementWrapStencilOp,
 	NeverStencilFunc, AlwaysStencilFunc, LessStencilFunc, LessEqualStencilFunc, EqualStencilFunc, GreaterEqualStencilFunc, GreaterStencilFunc, NotEqualStencilFunc
-} from 'three';
+} from '../../../constants.js';
 
 class WebGPUPipelineUtils {
 
@@ -23,6 +23,12 @@ class WebGPUPipelineUtils {
 
 	}
 
+	_getSampleCount( renderObjectContext ) {
+
+		return this.backend.utils.getSampleCountRenderContext( renderObjectContext );
+
+	}
+
 	createRenderPipeline( renderObject, promises ) {
 
 		const { object, material, geometry, pipeline } = renderObject;
@@ -33,7 +39,18 @@ class WebGPUPipelineUtils {
 		const utils = backend.utils;
 
 		const pipelineData = backend.get( pipeline );
-		const bindingsData = backend.get( renderObject.getBindings() );
+
+		// bind group layouts
+
+		const bindGroupLayouts = [];
+
+		for ( const bindGroup of renderObject.getBindings() ) {
+
+			const bindingsData = backend.get( bindGroup );
+
+			bindGroupLayouts.push( bindingsData.layout );
+
+		}
 
 		// vertex buffers
 
@@ -102,22 +119,11 @@ class WebGPUPipelineUtils {
 		const primitiveState = this._getPrimitiveState( object, geometry, material );
 		const depthCompare = this._getDepthCompare( material );
 		const depthStencilFormat = utils.getCurrentDepthStencilFormat( renderObject.context );
-		let sampleCount = utils.getSampleCount( renderObject.context );
-
-		if ( sampleCount > 1 ) {
-
-			// WebGPU only supports power-of-two sample counts and 2 is not a valid value
-			sampleCount = Math.pow( 2, Math.floor( Math.log2( sampleCount ) ) );
 
-			if ( sampleCount === 2 ) {
-
-				sampleCount = 4;
-
-			}
-
-		}
+		const sampleCount = this._getSampleCount( renderObject.context );
 
 		const pipelineDescriptor = {
+			label: 'renderPipeline',
 			vertex: Object.assign( {}, vertexModule, { buffers: vertexBuffers } ),
 			fragment: Object.assign( {}, fragmentModule, { targets } ),
 			primitive: primitiveState,
@@ -135,7 +141,7 @@ class WebGPUPipelineUtils {
 				alphaToCoverageEnabled: material.alphaToCoverage
 			},
 			layout: device.createPipelineLayout( {
-				bindGroupLayouts: [ bindingsData.layout ]
+				bindGroupLayouts
 			} )
 		};
 
@@ -162,6 +168,35 @@ class WebGPUPipelineUtils {
 
 	}
 
+	createBundleEncoder( renderContext, renderObject ) {
+
+		const backend = this.backend;
+		const { utils, device } = backend;
+
+		const renderContextData = backend.get( renderContext );
+		const renderObjectData = backend.get( renderObject );
+
+		const depthStencilFormat = utils.getCurrentDepthStencilFormat( renderContext );
+		const colorFormat = utils.getCurrentColorFormat( renderContext );
+		const sampleCount = this._getSampleCount( renderObject.context );
+
+		const descriptor = {
+			label: 'renderBundleEncoder',
+			colorFormats: [ colorFormat ],
+			depthStencilFormat,
+			sampleCount
+		};
+
+		const bundleEncoder = device.createRenderBundleEncoder( descriptor );
+
+		renderObjectData.bundleEncoder = bundleEncoder;
+		renderContextData.currentSets = { attributes: {} };
+		renderContextData._renderBundleViewport = renderContext.width + '_' + renderContext.height;
+
+		return bundleEncoder;
+
+	}
+
 	createComputePipeline( pipeline, bindings ) {
 
 		const backend = this.backend;
@@ -170,12 +205,23 @@ class WebGPUPipelineUtils {
 		const computeProgram = backend.get( pipeline.computeProgram ).module;
 
 		const pipelineGPU = backend.get( pipeline );
-		const bindingsData = backend.get( bindings );
+
+		// bind group layouts
+
+		const bindGroupLayouts = [];
+
+		for ( const bindingsGroup of bindings ) {
+
+			const bindingsData = backend.get( bindingsGroup );
+
+			bindGroupLayouts.push( bindingsData.layout );
+
+		}
 
 		pipelineGPU.pipeline = device.createComputePipeline( {
 			compute: computeProgram,
 			layout: device.createPipelineLayout( {
-				bindGroupLayouts: [ bindingsData.layout ]
+				bindGroupLayouts
 			} )
 		} );
 
@@ -186,17 +232,21 @@ class WebGPUPipelineUtils {
 		let color, alpha;
 
 		const blending = material.blending;
+		const blendSrc = material.blendSrc;
+		const blendDst = material.blendDst;
+		const blendEquation = material.blendEquation;
+
 
 		if ( blending === CustomBlending ) {
 
-			const blendSrcAlpha = material.blendSrcAlpha !== null ? material.blendSrcAlpha : GPUBlendFactor.One;
-			const blendDstAlpha = material.blendDstAlpha !== null ? material.blendDstAlpha : GPUBlendFactor.Zero;
-			const blendEquationAlpha = material.blendEquationAlpha !== null ? material.blendEquationAlpha : GPUBlendFactor.Add;
+			const blendSrcAlpha = material.blendSrcAlpha !== null ? material.blendSrcAlpha : blendSrc;
+			const blendDstAlpha = material.blendDstAlpha !== null ? material.blendDstAlpha : blendDst;
+			const blendEquationAlpha = material.blendEquationAlpha !== null ? material.blendEquationAlpha : blendEquation;
 
 			color = {
-				srcFactor: this._getBlendFactor( material.blendSrc ),
-				dstFactor: this._getBlendFactor( material.blendDst ),
-				operation: this._getBlendOperation( material.blendEquation )
+				srcFactor: this._getBlendFactor( blendSrc ),
+				dstFactor: this._getBlendFactor( blendDst ),
+				operation: this._getBlendOperation( blendEquation )
 			};
 
 			alpha = {

package/{examples/jsm → src}/renderers/webgpu/utils/WebGPUTextureUtils.js

@@ -2,20 +2,22 @@ import {
 	GPUTextureFormat, GPUAddressMode, GPUFilterMode, GPUTextureDimension, GPUFeatureName
 } from './WebGPUConstants.js';
 
+import WebGPUTexturePassUtils from './WebGPUTexturePassUtils.js';
+
 import {
-	CubeTexture, Texture,
+	ByteType, ShortType,
 	NearestFilter, NearestMipmapNearestFilter, NearestMipmapLinearFilter,
 	RepeatWrapping, MirroredRepeatWrapping,
 	RGB_ETC2_Format, RGBA_ETC2_EAC_Format,
 	RGBAFormat, RGBFormat, RedFormat, RGFormat, RGBA_S3TC_DXT1_Format, RGBA_S3TC_DXT3_Format, RGBA_S3TC_DXT5_Format, UnsignedByteType, FloatType, HalfFloatType, SRGBColorSpace, DepthFormat, DepthStencilFormat,
 	RGBA_ASTC_4x4_Format, RGBA_ASTC_5x4_Format, RGBA_ASTC_5x5_Format, RGBA_ASTC_6x5_Format, RGBA_ASTC_6x6_Format, RGBA_ASTC_8x5_Format, RGBA_ASTC_8x6_Format, RGBA_ASTC_8x8_Format, RGBA_ASTC_10x5_Format,
 	RGBA_ASTC_10x6_Format, RGBA_ASTC_10x8_Format, RGBA_ASTC_10x10_Format, RGBA_ASTC_12x10_Format, RGBA_ASTC_12x12_Format, UnsignedIntType, UnsignedShortType, UnsignedInt248Type, UnsignedInt5999Type,
-	NeverCompare, AlwaysCompare, LessCompare, LessEqualCompare, EqualCompare, GreaterEqualCompare, GreaterCompare, NotEqualCompare, IntType, RedIntegerFormat, RGIntegerFormat, RGBAIntegerFormat
-} from 'three';
-
-import { CubeReflectionMapping, CubeRefractionMapping, EquirectangularReflectionMapping, EquirectangularRefractionMapping, DepthTexture } from 'three';
-
-import WebGPUTexturePassUtils from './WebGPUTexturePassUtils.js';
+	NeverCompare, AlwaysCompare, LessCompare, LessEqualCompare, EqualCompare, GreaterEqualCompare, GreaterCompare, NotEqualCompare, IntType, RedIntegerFormat, RGIntegerFormat, RGBAIntegerFormat,
+	CubeReflectionMapping, CubeRefractionMapping, EquirectangularReflectionMapping, EquirectangularRefractionMapping
+} from '../../../constants.js';
+import { CubeTexture } from '../../../textures/CubeTexture.js';
+import { DepthTexture } from '../../../textures/DepthTexture.js';
+import { Texture } from '../../../textures/Texture.js';
 
 const _compareToWebGPU = {
 	[ NeverCompare ]: 'never',
@@ -40,6 +42,7 @@ class WebGPUTextureUtils {
 
 		this.defaultTexture = {};
 		this.defaultCubeTexture = {};
+		this.defaultVideoFrame = null;
 
 		this.colorBuffer = null;
 
@@ -85,6 +88,10 @@ class WebGPUTextureUtils {
 
 			textureGPU = this._getDefaultCubeTextureGPU( format );
 
+		} else if ( texture.isVideoTexture ) {
+
+			this.backend.get( texture ).externalTexture = this._getDefaultVideoFrame();
+
 		} else {
 
 			textureGPU = this._getDefaultTextureGPU( format );
@@ -117,20 +124,9 @@ class WebGPUTextureUtils {
 
 		let sampleCount = options.sampleCount !== undefined ? options.sampleCount : 1;
 
-		if ( sampleCount > 1 ) {
-
-			// WebGPU only supports power-of-two sample counts and 2 is not a valid value
-			sampleCount = Math.pow( 2, Math.floor( Math.log2( sampleCount ) ) );
+		sampleCount = backend.utils.getSampleCount( sampleCount );
 
-			if ( sampleCount === 2 ) {
-
-				sampleCount = 4;
-
-			}
-
-		}
-
-		const primarySampleCount = texture.isRenderTargetTexture ? 1 : sampleCount;
+		const primarySampleCount = texture.isRenderTargetTexture && ! texture.isMultisampleRenderTargetTexture ? 1 : sampleCount;
 
 		let usage = GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.COPY_SRC;
 
@@ -188,7 +184,7 @@ class WebGPUTextureUtils {
 
 		}
 
-		if ( texture.isRenderTargetTexture && sampleCount > 1 ) {
+		if ( texture.isRenderTargetTexture && sampleCount > 1 && ! texture.isMultisampleRenderTargetTexture ) {
 
 			const msaaTextureDescriptorGPU = Object.assign( {}, textureDescriptorGPU );
 
@@ -261,7 +257,7 @@ class WebGPUTextureUtils {
 				height: height,
 				depthOrArrayLayers: 1
 			},
-			sampleCount: backend.parameters.sampleCount,
+			sampleCount: backend.utils.getSampleCount( backend.renderer.samples ),
 			format: GPUTextureFormat.BGRA8Unorm,
 			usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.COPY_SRC
 		} );
@@ -310,7 +306,7 @@ class WebGPUTextureUtils {
 		depthTexture.image.width = width;
 		depthTexture.image.height = height;
 
-		this.createTexture( depthTexture, { sampleCount: backend.parameters.sampleCount, width, height } );
+		this.createTexture( depthTexture, { sampleCount: backend.utils.getSampleCount( backend.renderer.samples ), width, height } );
 
 		return backend.get( depthTexture ).texture;
 
@@ -327,11 +323,11 @@ class WebGPUTextureUtils {
 
 		// transfer texture data
 
-		if ( texture.isDataTexture || texture.isData3DTexture ) {
+		if ( texture.isDataTexture ) {
 
 			this._copyBufferToTexture( options.image, textureData.texture, textureDescriptorGPU, 0, texture.flipY );
 
-		} else if ( texture.isDataArrayTexture ) {
+		} else if ( texture.isDataArrayTexture || texture.isData3DTexture ) {
 
 			for ( let i = 0; i < options.image.depth; i ++ ) {
 
@@ -464,6 +460,27 @@ class WebGPUTextureUtils {
 
 	}
 
+	_getDefaultVideoFrame() {
+
+		let defaultVideoFrame = this.defaultVideoFrame;
+
+		if ( defaultVideoFrame === null ) {
+
+			const init = {
+				timestamp: 0,
+				codedWidth: 1,
+				codedHeight: 1,
+				format: 'RGBA',
+			};
+
+			this.defaultVideoFrame = defaultVideoFrame = new VideoFrame( new Uint8Array( [ 0, 0, 0, 0xff ] ), init );
+
+		}
+
+		return defaultVideoFrame;
+
+	}
+
 	_copyCubeMapToTexture( images, textureGPU, textureDescriptorGPU, flipY ) {
 
 		for ( let i = 0; i < 6; i ++ ) {
@@ -913,6 +930,25 @@ export function getFormat( texture, device = null ) {
 
 				switch ( type ) {
 
+					case ByteType:
+						formatGPU = GPUTextureFormat.RGBA8Snorm;
+						break;
+
+					case ShortType:
+						formatGPU = GPUTextureFormat.RGBA16Sint;
+						break;
+
+					case UnsignedShortType:
+						formatGPU = GPUTextureFormat.RGBA16Uint;
+						break;
+					case UnsignedIntType:
+						formatGPU = GPUTextureFormat.RGBA32Uint;
+						break;
+
+					case IntType:
+						formatGPU = GPUTextureFormat.RGBA32Sint;
+						break;
+
 					case UnsignedByteType:
 						formatGPU = ( colorSpace === SRGBColorSpace ) ? GPUTextureFormat.RGBA8UnormSRGB : GPUTextureFormat.RGBA8Unorm;
 						break;
@@ -951,6 +987,26 @@ export function getFormat( texture, device = null ) {
 
 				switch ( type ) {
 
+					case ByteType:
+						formatGPU = GPUTextureFormat.R8Snorm;
+						break;
+
+					case ShortType:
+						formatGPU = GPUTextureFormat.R16Sint;
+						break;
+
+					case UnsignedShortType:
+						formatGPU = GPUTextureFormat.R16Uint;
+						break;
+
+					case UnsignedIntType:
+						formatGPU = GPUTextureFormat.R32Uint;
+						break;
+
+					case IntType:
+						formatGPU = GPUTextureFormat.R32Sint;
+						break;
+
 					case UnsignedByteType:
 						formatGPU = GPUTextureFormat.R8Unorm;
 						break;
@@ -974,6 +1030,26 @@ export function getFormat( texture, device = null ) {
 
 				switch ( type ) {
 
+					case ByteType:
+						formatGPU = GPUTextureFormat.RG8Snorm;
+						break;
+
+					case ShortType:
+						formatGPU = GPUTextureFormat.RG16Sint;
+						break;
+
+					case UnsignedShortType:
+						formatGPU = GPUTextureFormat.RG16Uint;
+						break;
+
+					case UnsignedIntType:
+						formatGPU = GPUTextureFormat.RG32Uint;
+						break;
+
+					case IntType:
+						formatGPU = GPUTextureFormat.RG32Sint;
+						break;
+
 					case UnsignedByteType:
 						formatGPU = GPUTextureFormat.RG8Unorm;
 						break;