WebGPURenderer: Add clipping + stencil demo. (#34325)

examples-testing/changes.patch

@@ -14784,6 +14784,46 @@ index b2b567c9a..6c1ad5f2c 100644
      const time = (currentTime - startTime) / 1000;
 
      object.position.y = 0.8;
+diff --git a/examples-testing/examples/webgpu_clipping_stencil.ts b/examples-testing/examples/webgpu_clipping_stencil.ts
+index c117bcfa8..584957a68 100644
+--- a/examples-testing/examples/webgpu_clipping_stencil.ts
++++ b/examples-testing/examples/webgpu_clipping_stencil.ts
+@@ -4,9 +4,9 @@ import { Inspector } from 'three/addons/inspector/Inspector.js';
+
+ import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
+
+-let camera, scene, renderer, object;
+-let planes, planeObjects, planeHelpers;
+-let timer;
++let camera: THREE.PerspectiveCamera, scene: THREE.Scene, renderer: THREE.WebGPURenderer, object: THREE.Group;
++let planes: THREE.Plane[], planeObjects: THREE.Mesh[], planeHelpers: THREE.PlaneHelper[];
++let timer: THREE.Timer;
+
+ const params = {
+     animate: true,
+@@ -29,7 +29,12 @@ const params = {
+
+ init();
+
+-function createPlaneStencilGroup(geometry, plane, stencilBit, renderOrder) {
++function createPlaneStencilGroup(
++    geometry: THREE.TorusKnotGeometry,
++    plane: THREE.Plane,
++    stencilBit: number,
++    renderOrder: number,
++) {
+     const group = new THREE.ClippingGroup();
+     group.clippingPlanes = [plane];
+
+@@ -184,7 +189,7 @@ function init() {
+
+     // GUI
+
+-    const gui = renderer.inspector.createParameters('Clipping settings');
++    const gui = (renderer.inspector as Inspector).createParameters('Clipping settings');
+     gui.add(params, 'animate');
+
+     const planeX = gui.addFolder('planeX');
 diff --git a/examples-testing/examples/webgpu_compile_async.ts b/examples-testing/examples/webgpu_compile_async.ts
 index fbcf0a7b0..b80719c41 100644
 --- a/examples-testing/examples/webgpu_compile_async.ts

jsdoc-testing/changes.patch

@@ -14637,7 +14637,7 @@ index 9932067a0..5eb392d78 100644
 +
 +export default CanvasTarget;
 diff --git a/jsdoc-testing/jsdoc/src/renderers/common/ClippingContext.d.ts b/jsdoc-testing/jsdoc/src/renderers/common/ClippingContext.d.ts
-index db3046a90..9a5928cef 100644
+index 0bc37ff1c..22902cb59 100644
 --- a/jsdoc-testing/jsdoc/src/renderers/common/ClippingContext.d.ts
 +++ b/jsdoc-testing/jsdoc/src/renderers/common/ClippingContext.d.ts
 @@ -1,4 +1,11 @@
@@ -14653,7 +14653,7 @@ index db3046a90..9a5928cef 100644
  /**
   * Represents the state that is used to perform clipping via clipping planes.
   * There is a default clipping context for each render context. When the
-@@ -64,13 +71,13 @@ declare class ClippingContext {
+@@ -71,13 +78,13 @@ declare class ClippingContext {
       *
       * @type {Array<Vector4>}
       */
@@ -14669,7 +14669,7 @@ index db3046a90..9a5928cef 100644
      /**
       * The version of the clipping context's parent context.
       *
-@@ -86,7 +93,7 @@ declare class ClippingContext {
+@@ -93,7 +100,7 @@ declare class ClippingContext {
       * @param {Array<Vector4>} destination - The destination.
       * @param {number} offset - The offset.
       */
@@ -14678,7 +14678,7 @@ index db3046a90..9a5928cef 100644
      /**
       * Updates the root clipping context of a scene.
       *
-@@ -114,9 +121,7 @@ declare class ClippingContext {
+@@ -121,9 +128,7 @@ declare class ClippingContext {
       * @type {number}
       * @readonly
       */

types/three/src/renderers/common/ClippingContext.d.ts

@@ -21,6 +21,13 @@ declare class ClippingContext {
      * @param {?ClippingContext} [parentContext=null] - A reference to the parent clipping context.
      */
     constructor(parentContext?: ClippingContext | null);
+    /**
+     * The id of the clipping context.
+     *
+     * @type {number}
+     * @readonly
+     */
+    readonly id: number;
     /**
      * The clipping context's version.
      *