fix: Adjust shader canvas drawing order to render on top of the node's title gradient.

Author: AEmotionStudio

package.json

@@ -1,6 +1,6 @@
 {
     "name": "comfyui-shadernoiseksampler-web",
-    "version": "1.0.1",
+    "version": "1.0.2",
     "type": "module",
     "description": "TypeScript frontend for ComfyUI ShaderNoiseKSampler custom nodes",
     "scripts": {

pyproject.toml

@@ -1,7 +1,7 @@
 [project]
 name = "comfyui-shadernoiseksampler"
 description = "Transform AI image generation from random exploration into deliberate artistic navigation. This advanced KSampler replacement blends traditional noise with shader noise. Navigate latent space with intention using adjustable noise parameters, shape masks, and colors transformations."
-version = "1.3.2"
+version = "1.3.3"
 license = {file = "LICENSE"}
 
 [project.urls]

web/shader_renderer.js

@@ -1523,6 +1523,8 @@ const FRAGMENT_SHADER_FOOTER = `
         nodeType.prototype.onDrawForeground = function (this: ShaderRendererNode, ctx: CanvasRenderingContext2D) {
             if (this.properties?.shaderVisible && this.shaderCanvas && !this.flags?.collapsed) {
                 this.isShaderActive = true;
+                // Call origOnDrawForeground FIRST so gradient title acts as background
+                if (origOnDrawForeground) origOnDrawForeground.call(this, ctx);
                 // Render shader synchronously before drawing to ensure fresh content
                 this.renderShader();
                 if (!this.animationFrameId) {
@@ -1536,8 +1538,8 @@ const FRAGMENT_SHADER_FOOTER = `
                 const baseSize = origComputeSize ? origComputeSize.call(this, [this.size[0], 0]) : [this.size[0], 0];
                 const shaderY = baseSize[1];
                 const shaderHeight = Math.max(50, this.size[1] - shaderY);
+                // Draw shader canvas AFTER origOnDrawForeground so it renders on top of the gradient
                 try { ctx.drawImage(this.shaderCanvas, 0, shaderY, this.size[0], shaderHeight); } catch (e) { /* ignore */ }
-                if (origOnDrawForeground) origOnDrawForeground.call(this, ctx);
             } else {
                 if (origOnDrawForeground) origOnDrawForeground.call(this, ctx);
                 this.isShaderActive = false;