gbromios/repro.html

## repro.html
<!DOCTYPE html>
<html>
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/regl/1.3.11/regl.js"></script>
<script>

  const regl = createREGL({ extensions: ['WEBGL_depth_texture'] });
  /* creating the following texture warns in the console:

    regl.js:3009 WebGL: INVALID_OPERATION: texImage2D: format can not be set, only rendered to

    setImage @ regl.js:3009
    setMipMap @ regl.js:3133
    reglTexture2D @ regl.js:3418
    createTexture2D @ regl.js:3535
    (anonymous) @ index.html:12

   */

  console.log('regl depth texture:');
  const reglTexture = regl.texture({
    width: 4,
    height: 4,
    format: 'depth',
    type: 'uint32'
  });


  // After looking into it for a bit, I realized what the warning was actually
  // saying: depth textures (apparently) can't have their data writen outisde
  // of the shader. Makes sense, but initially the wording didn't click:
  const data = new Uint32Array(16);
  const gl = regl._gl;
  const vanillaTexture = gl.createTexture();
  gl.bindTexture(gl.TEXTURE_2D, vanillaTexture);

  // this is okay:
  console.log('vanilla depth texture:');
  gl.texImage2D(
    gl.TEXTURE_2D,
    0,
    gl.DEPTH_COMPONENT,
    4,
    4,
    0,
    gl.DEPTH_COMPONENT,
    gl.UNSIGNED_INT,
    null // < no data
  );

  // same warning as above:
  console.log('vanilla depth texture + data:');
  gl.texImage2D(
    gl.TEXTURE_2D,
    0,
    gl.DEPTH_COMPONENT,
    4,
    4,
    0,
    gl.DEPTH_COMPONENT,
    gl.UNSIGNED_INT,
    data, // < this warns, not allowed to supply data
  );

  // this still warns, but maybe checking `data === null` could be an option?
  console.log('regl depth texture with set to null explicitly:');
  const dataTexture = regl.texture({
    width: 4,
    height: 4,
    format: 'depth',
    data: null
  });

</script>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<body>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/regl/1.3.11/regl.js"></script>
	<script>

	const regl = createREGL({ extensions: ['WEBGL_depth_texture'] });
	/* creating the following texture warns in the console:

	regl.js:3009 WebGL: INVALID_OPERATION: texImage2D: format can not be set, only rendered to

	setImage @ regl.js:3009
	setMipMap @ regl.js:3133
	reglTexture2D @ regl.js:3418
	createTexture2D @ regl.js:3535
	(anonymous) @ index.html:12

	*/

	console.log('regl depth texture:');
	const reglTexture = regl.texture({
	width: 4,
	height: 4,
	format: 'depth',
	type: 'uint32'
	});


	// After looking into it for a bit, I realized what the warning was actually
	// saying: depth textures (apparently) can't have their data writen outisde
	// of the shader. Makes sense, but initially the wording didn't click:
	const data = new Uint32Array(16);
	const gl = regl._gl;
	const vanillaTexture = gl.createTexture();
	gl.bindTexture(gl.TEXTURE_2D, vanillaTexture);

	// this is okay:
	console.log('vanilla depth texture:');
	gl.texImage2D(
	gl.TEXTURE_2D,
	0,
	gl.DEPTH_COMPONENT,
	4,
	4,
	0,
	gl.DEPTH_COMPONENT,
	gl.UNSIGNED_INT,
	null // < no data
	);

	// same warning as above:
	console.log('vanilla depth texture + data:');
	gl.texImage2D(
	gl.TEXTURE_2D,
	0,
	gl.DEPTH_COMPONENT,
	4,
	4,
	0,
	gl.DEPTH_COMPONENT,
	gl.UNSIGNED_INT,
	data, // < this warns, not allowed to supply data
	);

	// this still warns, but maybe checking `data === null` could be an option?
	console.log('regl depth texture with set to null explicitly:');
	const dataTexture = regl.texture({
	width: 4,
	height: 4,
	format: 'depth',
	data: null
	});

	</script>
	</body>
	</html>