Add mat2 uniform support to WebGL setUniform, fixing silent no-op (#8…

[harshiltewari2004]

Resolves #8939

Changes

• Added the missing FLOAT_MAT2 case to the setUniform switch in
  src/webgl/utils.js (gl.uniformMatrix2fv), mirroring the existing
  mat3/mat4 cases — completing part of the //@todo
• Added FLOAT_MAT2 to the isArray classification in
  getWebGLUniformMetadata, so mat2 uniforms take the array path in
  p5.Shader's value caching
• Added a visual regression test (createFilterShader with a uniform mat2
  driving the fragment color from the matrix diagonal). Verified the test
  fails on unfixed code and passes with the fix.

Note: there was previously no direct setUniform test coverage for matrix
uniforms of any size, in either backend — this test establishes the pattern.
mat2 remains untested on the WebGPU side (where it already works); happy to
add a WGSL counterpart in a follow-up if wanted.

While verifying with a full test run, I hit an intermittent failure in
Typography > textWeight > can control non-variable fonts — unrelated to
this change (2D-mode test, no path to the modified code; passes repeatedly
in isolation on this branch). It loads its font from Google Fonts at test
time, which is the likely flake source.

PR Checklist

• npm run lint passes
• [Inline reference] is included / updated — N/A, no documented API change
• [Unit tests] are included / updated

[p5-bot]

Continuous Release

CDN link

• https://raw.esm.sh/pr/p5@97fdc84/lib/p5.min.js

Published Packages

• https://pkg.pr.new/p5@97fdc84

Commit hash: db05648

Previous deployments

---

This is an automated message.

[davepagurek]

Thanks, this is good to go I think! Are you also interested in looking into p5.strands support for matrices? Currently we don't support them, so we resort to hacks like this:

p5.js/src/core/p5.Renderer3D.js

Lines 1929 to 1943 in 5743cb5

	// Hack: we don't have matrix uniforms yet; use three vectors
	const uN1 = p5.uniformVec3('uN1');
	const uN2 = p5.uniformVec3('uN2');
	const uN3 = p5.uniformVec3('uN3');
	p5.getColor((inputs) => {
	const uFovX = uFovY * uAspect;
	const angleY = p5.mix(uFovY/2.0, -uFovY/2.0, inputs.texCoord.y);
	const angleX = p5.mix(uFovX/2.0, -uFovX/2.0, inputs.texCoord.x);
	let rotatedNormal = p5.normalize([angleX, angleY, 1]);
	rotatedNormal = [
	// Don't mind me, just doing matrix vector multiplication...
	p5.dot(rotatedNormal, uN1),
	p5.dot(rotatedNormal, uN2),
	p5.dot(rotatedNormal, uN3),
	];

If that's of interest, it'll help simplify the above snippet and help tie into @perminder-17's work on a transformation API in p5.strands, so we'd appreciate the help! A start would be to make an issue for it.

[davepagurek]

@all-contributors please add @harshiltewari2004 for code

[allcontributors]

@davepagurek

@harshiltewari2004 already contributed before to code

[harshiltewari2004]

Thanks @davepagurek! Yes, I'd be glad to look into strands matrix support — that hack is a great motivating example. I'll open an issue to lay out the problem and a proposed approach so we can settle scope before any code. Since this ties into @perminder-17's transformation API work, I'll tag him there too so we can make sure the direction lines up rather than overlapping.