TSL: Improve types for Fn (#2051)

* Add some tests

* Update patch and delete TSL test file

* Delete changes.patch

* Update patch and delete TSL test file

* Add TSL test file

* Update patch and delete TSL test file

* Update patch and delete TSL test file

* Add tests for color constructor function

* Update float

* Revert Fn changes for now

* Update

* Updates

* Keep that one

* Add examples

* Update patch and delete examples

* Revert constructor changes

* Add nodeObject tests

* Remove NodeObjectOption

* Update Proxied to (hopefully) be correct

* Add examples

* Update scatteringNode

* Delete examples

* Remove distracting tests

* Add sources

* Add jsdoc

* Update patch and delete jsdoc

* Add test

* Remove tests

* Format

* Narrow Layout parameter

* Add examples

* Better layout type

* Delete examples

* Naming

* stash

* Temp fix

* Remove for now

Author: Methuselah96

.github/workflows/CI.yml

@@ -94,7 +94,7 @@ jobs:
       - run: pnpm install
       - run: pnpm run build-declarations
         working-directory: jsdoc-testing
-      - run: git apply changes.patch --allow-empty
+      - run: git apply changes.patch
         working-directory: jsdoc-testing
       - run: pnpm run format-dprint
         working-directory: jsdoc-testing
@@ -118,6 +118,10 @@ jobs:
         working-directory: tsl-testing
       - run: pnpm run type-check
         working-directory: tsl-testing
+      - run: pnpm generate-tsl-test
+        working-directory: tsl-testing
+      - run: git apply changes.patch --allow-empty
+        working-directory: tsl-testing
       - run: pnpm run format-check
         working-directory: tsl-testing
       - run: pnpm run test

examples-testing/index.js

@@ -108,7 +108,7 @@ for (const section of Object.values(examplesFiles)) {
             encoding: 'utf-8',
         });
         const results = re.exec(fileContents);
-        const options = await prettier.resolveConfig(file);
+        const options = await prettier.resolveConfig(import.meta.filename);
         const formattedFile = await prettier.format(results[1], { ...options, parser: 'babel' });
         fs.writeFileSync(path.join(outDir, `${file}.ts`), formattedFile);
     }

jsdoc-testing/changes.patch

@@ -9901,7 +9901,7 @@ index 7f8da84d3..b25508365 100644
 +
 +export default SpriteNodeMaterial;
 diff --git a/jsdoc-testing/jsdoc/materials/nodes/VolumeNodeMaterial.d.ts b/jsdoc-testing/jsdoc/materials/nodes/VolumeNodeMaterial.d.ts
-index 8b5885c3c..961cefb6a 100644
+index 8b5885c3c..6175b46ab 100644
 --- a/jsdoc-testing/jsdoc/materials/nodes/VolumeNodeMaterial.d.ts
 +++ b/jsdoc-testing/jsdoc/materials/nodes/VolumeNodeMaterial.d.ts
 @@ -1,28 +1,12 @@
@@ -9956,7 +9956,7 @@ index 8b5885c3c..961cefb6a 100644
       */
 -    scatteringNode: Function | FunctionNode<vec4>;
 -    side: number;
-+    scatteringNode: (params: { positionRay: Node }) => Node | null;
++    scatteringNode: (params: { positionRay: Node<"vec3"> }) => Node | null;
 +}
 +
 +// eslint-disable-next-line @typescript-eslint/no-empty-interface

tsl-testing/.prettierrc.json

@@ -0,0 +1,8 @@
+{
+    "$schema": "http://json.schemastore.org/prettierrc",
+    "arrowParens": "avoid",
+    "singleQuote": true,
+    "trailingComma": "all",
+    "tabWidth": 4,
+    "printWidth": 120
+}

tsl-testing/TSLCore.test.ts

@@ -0,0 +1,84 @@
+import { expect, test } from 'vitest';
+import { nodeObject, vec3 } from 'three/tsl';
+import * as THREE from 'three/webgpu';
+
+const renderer = new THREE.WebGPURenderer();
+const nodeBuilder: THREE.NodeBuilder = renderer.backend.createNodeBuilder(null!, renderer);
+
+test('nodeObject(Node)', () => {
+    const testVec3 = vec3(1, 0, 2);
+    const result: typeof testVec3 = nodeObject(testVec3);
+    expect(result).toStrictEqual(testVec3);
+});
+
+test('nodeObject(number)', () => {
+    const result: THREE.Node<'float'> = nodeObject(5);
+    expect(result).toBeInstanceOf(THREE.Node);
+    expect(result.getNodeType(nodeBuilder)).toBe('float');
+});
+
+test('nodeObject(boolean)', () => {
+    const result: THREE.Node<'bool'> = nodeObject(true);
+    expect(result).toBeInstanceOf(THREE.Node);
+    expect(result.getNodeType(nodeBuilder)).toBe('bool');
+});
+
+test('nodeObject(string)', () => {
+    const stringValue = 'test';
+    const result: string = nodeObject(stringValue);
+    expect(result).toStrictEqual(stringValue);
+});
+
+test('nodeObject(Vector2)', () => {
+    const result: THREE.Node<'vec2'> = nodeObject(new THREE.Vector2());
+    expect(result).toBeInstanceOf(THREE.Node);
+    expect(result.getNodeType(nodeBuilder)).toBe('vec2');
+});
+
+test('nodeObject(Vector3)', () => {
+    const result: THREE.Node<'vec3'> = nodeObject(new THREE.Vector3());
+    expect(result).toBeInstanceOf(THREE.Node);
+    expect(result.getNodeType(nodeBuilder)).toBe('vec3');
+});
+
+test('nodeObject(Vector4)', () => {
+    const result: THREE.Node<'vec4'> = nodeObject(new THREE.Vector4());
+    expect(result).toBeInstanceOf(THREE.Node);
+    expect(result.getNodeType(nodeBuilder)).toBe('vec4');
+});
+
+test('nodeObject(Matrix2)', () => {
+    const result: THREE.Node<'mat2'> = nodeObject(new THREE.Matrix2());
+    expect(result).toBeInstanceOf(THREE.Node);
+    expect(result.getNodeType(nodeBuilder)).toBe('mat2');
+});
+
+test('nodeObject(Matrix3)', () => {
+    const result: THREE.Node<'mat3'> = nodeObject(new THREE.Matrix3());
+    expect(result).toBeInstanceOf(THREE.Node);
+    expect(result.getNodeType(nodeBuilder)).toBe('mat3');
+});
+
+test('nodeObject(Matrix4)', () => {
+    const result: THREE.Node<'mat4'> = nodeObject(new THREE.Matrix4());
+    expect(result).toBeInstanceOf(THREE.Node);
+    expect(result.getNodeType(nodeBuilder)).toBe('mat4');
+});
+
+test('nodeObject(Color)', () => {
+    const result: THREE.Node<'color'> = nodeObject(new THREE.Color());
+    expect(result).toBeInstanceOf(THREE.Node);
+    expect(result.getNodeType(nodeBuilder)).toBe('color');
+});
+
+test('nodeObject(ArrayBuffer)', () => {
+    const result: THREE.Node<'ArrayBuffer'> = nodeObject(new ArrayBuffer(8));
+    expect(result).toBeInstanceOf(THREE.Node);
+    expect(result.getNodeType(nodeBuilder)).toBe('ArrayBuffer');
+});
+
+test('nodeObject(object)', () => {
+    const randomObject = { test: 5 };
+    const result: typeof randomObject = nodeObject(randomObject);
+    expect(result).toStrictEqual(randomObject);
+});

tsl-testing/TSLCore.ts

@@ -1,5 +1,5 @@
-import { vec2, vec3 } from "three/tsl";
-import * as THREE from "three/webgpu";
+import { Fn, uniform, vec2, vec3 } from 'three/tsl';
+import * as THREE from 'three/webgpu';
 
 /**
  * Setup
@@ -12,7 +12,7 @@ const testVec3 = vec3(1, 0, 2);
  * Access swizzle properties
  */
 
-const testVec2Swizzle: THREE.Node<"vec2"> = testVec3.xy;
+const testVec2Swizzle: THREE.Node<'vec2'> = testVec3.xy;
 
 // vec2s don't have a z property
 // @ts-expect-error
@@ -100,3 +100,20 @@ testVec3.flipZX();
 // Disallow duplicate identifiers when flipping a vec swizzle property
 // @ts-expect-error
 testVec3.flipXX();
+
+/**
+ * Fn
+ */
+
+// If the Node type is more specific, we shouldn't be able to pass in a more general Node type
+const test = Fn(([param]: [THREE.ConstNode<'float', number>]) => {
+    return vec3(param);
+});
+
+declare const floatConstNode: THREE.ConstNode<'float', number>;
+
+test(floatConstNode);
+// @ts-expect-error
+test(5);
+// @ts-expect-error
+test(uniform(5));

tsl-testing/changes.patch

@@ -0,0 +1,26 @@
+import * as fs from 'node:fs';
+import * as path from 'node:path';
+
+import prettier from 'prettier';
+
+const files = ['nodes/tsl/TSLCore'];
+
+const inDir = '../three.js/src';
+const outDir = './tsl-comments';
+
+for (const file of files) {
+    console.log(file);
+
+    const fileContents = fs.readFileSync(path.join(inDir, `${file}.js`), {
+        encoding: 'utf-8',
+    });
+    const options = await prettier.resolveConfig(import.meta.filename);
+    const formattedFile = await prettier.format(fileContents, {
+        ...options,
+        parser: 'babel',
+    });
+
+    const outFile = path.join(outDir, `${file}.js`);
+    fs.mkdirSync(path.dirname(outFile), { recursive: true });
+    fs.writeFileSync(outFile, formattedFile);
+}